"Test case" should be two words
This commit is contained in:
Jeremy Ruston
parent
5a7f958c64
commit
4234aa968e
|
|
@ -65,9 +65,9 @@ sidebar-tab-foreground-selected: Sidebar tab foreground for selected tabs
|
|||
sidebar-tab-foreground: Sidebar tab foreground
|
||||
sidebar-tiddler-link-foreground-hover: Sidebar tiddler link foreground hover
|
||||
sidebar-tiddler-link-foreground: Sidebar tiddler link foreground
|
||||
testcase-accent-level-1: Testcase accent colour with no nesting
|
||||
testcase-accent-level-2: Testcase accent colour with 2nd level nesting
|
||||
testcase-accent-level-3: Testcase accent colour with 3rd level nesting or higher
|
||||
testcase-accent-level-1: Test case accent colour with no nesting
|
||||
testcase-accent-level-2: Test case accent colour with 2nd level nesting
|
||||
testcase-accent-level-3: Test case accent colour with 3rd level nesting or higher
|
||||
site-title-foreground: Site title foreground
|
||||
static-alert-foreground: Static alert foreground
|
||||
tab-background-selected: Tab background for selected tabs
|
||||
|
|
|
|||
|
|
@ -12,12 +12,12 @@ title: $:/core/ui/testcases/DefaultTemplate
|
|||
<$let
|
||||
state={{{ [<qualify "$:/state/testcase">] }}}
|
||||
>
|
||||
<div class="tc-testcase-wrapper">
|
||||
<div class="tc-testcase-header">
|
||||
<div class="tc-test-case-wrapper">
|
||||
<div class="tc-test-case-header">
|
||||
<h2>
|
||||
<$genesis $type={{{ [<linkTarget>!match[]then[$link]else[div]] }}}>
|
||||
<%if [<testResult>!match[]] %>
|
||||
<span class={{{ tc-testcase-result-icon [<testResult>!match[fail]then[tc-testcase-result-icon-pass]] [<testResult>match[fail]then[tc-testcase-result-icon-fail]] +[join[ ]] }}}>
|
||||
<span class={{{ tc-test-case-result-icon [<testResult>!match[fail]then[tc-test-case-result-icon-pass]] [<testResult>match[fail]then[tc-test-case-result-icon-fail]] +[join[ ]] }}}>
|
||||
<%if [<testResult>!match[fail]] %>
|
||||
{{$:/core/images/done-button}}
|
||||
<%else%>
|
||||
|
|
@ -30,27 +30,27 @@ title: $:/core/ui/testcases/DefaultTemplate
|
|||
</h2>
|
||||
</div>
|
||||
<%if [[Narrative]is[tiddler]] %>
|
||||
<div class="tc-testcase-narrative">
|
||||
<div class="tc-test-case-narrative">
|
||||
<$transclude $tiddler="Narrative" mode="block"/>
|
||||
</div>
|
||||
<%endif%>
|
||||
<%if [<testResult>match[fail]] %>
|
||||
<div class="tc-testcase-result-fail">
|
||||
<div class="tc-testcase-result-fail-header">
|
||||
<div class="tc-test-case-result-fail">
|
||||
<div class="tc-test-case-result-fail-header">
|
||||
TEST FAILED
|
||||
</div>
|
||||
<div class="tc-testcase-result-fail-body">
|
||||
<div class="tc-test-case-result-fail-body">
|
||||
<$diff-text source=<<expectedHTML>> dest=<<outputHTML>>/>
|
||||
</div>
|
||||
</div>
|
||||
<%endif%>
|
||||
<div class="tc-testcase-panes">
|
||||
<div class="tc-testcase-source">
|
||||
<div class="tc-test-case-panes">
|
||||
<div class="tc-test-case-source">
|
||||
<$macrocall $name="tabs" tabsList="[all[tiddlers]sort[]] -[prefix<state>] -Description -Narrative -ExpectedResult -Output Output +[putfirst[]] -[has[plugin-type]]" state=<<state>> default="Output" template="$:/core/ui/testcases/DefaultTemplate/SourceTabs"/>
|
||||
</div>
|
||||
<div class="tc-testcase-divider">
|
||||
<div class="tc-test-case-divider">
|
||||
</div>
|
||||
<div class="tc-testcase-output">
|
||||
<div class="tc-test-case-output">
|
||||
<%if [<displayFormat>!match[]else[wikitext]match[plaintext]] %>
|
||||
<pre><$view tiddler="Output" format="plainwikified" mode="block"/></pre>
|
||||
<%else%>
|
||||
|
|
|
|||
|
|
@ -3,19 +3,19 @@ modified: 20240507221902644
|
|||
created: 20240507221902644
|
||||
tags: Concepts
|
||||
|
||||
Testcase tiddlers encapsulate one or more tiddlers that can be displayed as a [[testcase|TestCaseWidget]]: an independent embedded wiki that can be used for testing or learning purposes.
|
||||
Test case tiddlers encapsulate one or more tiddlers that can be displayed as a [[test case|TestCaseWidget]]: an independent embedded wiki that can be used for testing or learning purposes.
|
||||
|
||||
Testcase tiddlers are formatted as CompoundTiddlers, allowing them to contain multiple tiddlers packed into one.
|
||||
Test case tiddlers are formatted as CompoundTiddlers, allowing them to contain multiple tiddlers packed into one.
|
||||
|
||||
Testcase tiddlers have the following fields:
|
||||
Test case tiddlers have the following fields:
|
||||
|
||||
|!Field |!Description |
|
||||
|<<.field type>> | Should be set to `text/vnd.tiddlywiki-multiple` |
|
||||
|<<.field tags>> | Testcases are tagged [[$:/tags/wiki-test-spec]]. Test cases that intentionally fail are tagged [[$:/tags/wiki-test-spec-failing]] |
|
||||
|<<.field tags>> | Test cases are tagged [[$:/tags/wiki-test-spec]]. Test cases that intentionally fail are tagged [[$:/tags/wiki-test-spec-failing]] |
|
||||
|<<.field description>> |Descriptive heading for the test, intended to make it easy to identify the test |
|
||||
|<<.field display-format>> |Optional, defaults to `wikitext`. Set to `plaintext` to cause the output to be rended as plain text |
|
||||
|
||||
Testcase tiddlers with the appropriate tag are shown in $:/ControlPanel
|
||||
Test case tiddlers with the appropriate tag are shown in $:/ControlPanel
|
||||
|
||||
Some payload tiddlers are set aside for special purposes:
|
||||
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@ description: An example of a failing test
|
|||
|
||||
title: Narrative
|
||||
|
||||
This testcase intentionally fails to show how failures are displayed.
|
||||
This test case intentionally fails to show how failures are displayed.
|
||||
+
|
||||
title: Output
|
||||
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@ description: Simple transclusion
|
|||
|
||||
title: Narrative
|
||||
|
||||
This testcase demonstrates transclusion of and links to other tiddlers.
|
||||
This test case demonstrates transclusion of and links to other tiddlers.
|
||||
+
|
||||
title: Output
|
||||
|
||||
|
|
|
|||
|
|
@ -11,11 +11,11 @@ The <<.wid testcase>> widget is designed to present interactive example test cas
|
|||
|
||||
This makes it possible to run independent tests that also serve as documentation examples.
|
||||
|
||||
The <<.wid testcase>> widget can be used directly as documented below, but it is generally easier to create [[TestCaseTiddlers]]. These are special CompoundTiddlers that can contain multiple payload tiddlers making up a testcase.
|
||||
The <<.wid testcase>> widget can be used directly as documented below, but it is generally easier to create [[TestCaseTiddlers]]. These are special CompoundTiddlers that can contain multiple payload tiddlers making up a test case.
|
||||
|
||||
!! Features
|
||||
|
||||
Here is an example of a testcase showing the default split view with the source tiddlers on the left and the tiddler titled `Output` rendered on the right.
|
||||
Here is an example of a test case showing the default split view with the source tiddlers on the left and the tiddler titled `Output` rendered on the right.
|
||||
|
||||
<<testcase "TestCases/TranscludeWidget/SimpleTransclusion">>
|
||||
|
||||
|
|
@ -23,7 +23,7 @@ Notice also that clicking on links within the output pane will switch to the tab
|
|||
|
||||
The text of the payload tiddlers listed on the left are editable, with the results being immediately reflected in the preview pane on the right. However, if the <<.wid testcase>> widget is refreshed then the modifications are lost.
|
||||
|
||||
The green tick at the top left of a testcase indicates that a test has been set up and that it passes.
|
||||
The green tick at the top left of a test case indicates that a test has been set up and that it passes.
|
||||
|
||||
If the test fails, a red cross is shown, and there is a display of the differences between the actual results and the expected results:
|
||||
|
||||
|
|
@ -36,16 +36,16 @@ The <<.wid testcase>> widget creates a lightweight TiddlyWiki environment that i
|
|||
* Output is rendered into a DIV, and so cannot be styled independently of the host wiki
|
||||
* Any changes to the wiki made interactively by the user are volatile, and are lost when the <<.wid testcase>> widget is refreshed
|
||||
* Startup actions are not supported
|
||||
* Only plugins available in the host wiki can be included in the testcase
|
||||
* Only plugins available in the host wiki can be included in the test case
|
||||
|
||||
If these limitations are a problem, the [[Innerwiki Plugin]] offers the ability to embed a fully independent subwiki via an `<iframe>` element, but without the testing related features of the <<.wid testcase>> widget.
|
||||
|
||||
! Content and Attributes
|
||||
|
||||
The content of the `<$testcase>` widget is not displayed but instead is scanned for <<.wlink DataWidget>> widgets that define the payload tiddlers to be included in the testcase.
|
||||
The content of the `<$testcase>` widget is not displayed but instead is scanned for <<.wlink DataWidget>> widgets that define the payload tiddlers to be included in the test case.
|
||||
|
||||
|!Attribute |!Description |
|
||||
|<<.attr template>> |Optional title of the template used to display the testcase (defaults to $:/core/ui/testcases/DefaultTemplate). Note that custom templates will need to be explicitly added to the payload |
|
||||
|<<.attr template>> |Optional title of the template used to display the test case (defaults to $:/core/ui/testcases/DefaultTemplate). Note that custom templates will need to be explicitly added to the payload |
|
||||
|<<.attr testOutput>> |Optional title of the tiddler whose output should be subject to testing (note that both <<.attr testOutput>> and <<.attr testExpectedResult>> must be provided in order for testing to occur) |
|
||||
|<<.attr testExpectedResult>> |Optional title of the tiddler whose content is the expected result of rendering the output tiddler (note that both <<.attr testOutput>> and <<.attr testExpectedResult>> must be provided in order for testing to occur) |
|
||||
|<<.attr testActions>> |Optional title of the tiddler containing actions that should be executed before the test occurs |
|
||||
|
|
@ -59,7 +59,7 @@ The payload tiddlers are the tiddler values that are loaded into the subwiki tha
|
|||
|
||||
The <<.attr template>> attribute defaults to $:/core/ui/testcases/DefaultTemplate
|
||||
|
||||
The default testcase template assigns special meanings to a number of payload tiddlers:
|
||||
The default test case template assigns special meanings to a number of payload tiddlers:
|
||||
|
||||
|!Tiddler |!Description |
|
||||
|''Description'' |Descriptive heading for the test, intended to make it easy to identify the test |
|
||||
|
|
@ -67,20 +67,20 @@ The default testcase template assigns special meanings to a number of payload ti
|
|||
|''Output'' |The tiddler that produces the test output |
|
||||
|''~ExpectedResult'' |HTML of expected result of rendering the ''Output'' tiddler |
|
||||
|
||||
The testcase wiki will inherit variables that are visible to the <<.wid testcase>> widget itself. The default template uses several variables that can be set by the user:
|
||||
The test case wiki will inherit variables that are visible to the <<.wid testcase>> widget itself. The default template uses several variables that can be set by the user:
|
||||
|
||||
|!Variable |!Description |
|
||||
|<<.var linkTarget>> |Causes the testcase description to be rendered as a link to the current tiddler |
|
||||
|<<.var linkTarget>> |Causes the test case description to be rendered as a link to the current tiddler |
|
||||
|<<.var displayFormat>> |Defaults to "wikitext", can also be "plaintext" to force plain text display |
|
||||
|
||||
A custom template can be specified for special purposes. For example, the provided template $:/core/ui/testcases/RawJSONTemplate just displays the payload tiddlers in JSON, which can be used for debugging purposes.
|
||||
|
||||
! Testcase Template Variables
|
||||
! Test Czase Template Variables
|
||||
|
||||
The <<.wid testcase>> widget makes the following variables available within the rendered template:
|
||||
|
||||
|!Variable |!Description |
|
||||
|<<.var transclusion>> |A hash that reflects the names and values of all the payload tiddlers. This makes it easier for testcase templates to create unique state tiddler titles using the [[qualify Macro]] or QualifyWidget |
|
||||
|<<.var transclusion>> |A hash that reflects the names and values of all the payload tiddlers. This makes it easier for test case templates to create unique state tiddler titles using the [[qualify Macro]] or QualifyWidget |
|
||||
|<<.var payloadTiddlers>> |JSON array of payload tiddler fields |
|
||||
|<<.var outputHTML>> |The actual output HTML if running tests |
|
||||
|<<.var expectedHTML>> |The expected output HTML if running tests |
|
||||
|
|
@ -88,10 +88,10 @@ The <<.wid testcase>> widget makes the following variables available within the
|
|||
|
||||
! Example
|
||||
|
||||
Here is an example of setting up a testcase that includes expected test results:
|
||||
Here is an example of setting up a test case that includes expected test results:
|
||||
|
||||
<$testcase>
|
||||
<$data title="Description" text="Example of a testcase with expected results"/>
|
||||
<$data title="Description" text="Example of a test case with expected results"/>
|
||||
<$data title="Output" text="""<$testcase testOutput="Output" testExpectedResult="ExpectedResult">
|
||||
<$data title="Description" text="How to calculate 2 plus 2"/>
|
||||
<$data title="Output" text="<$text text={{{ [[2]add[2]] }}}/>"/>
|
||||
|
|
|
|||
|
|
@ -3226,40 +3226,40 @@ span.tc-translink > a:first-child {
|
|||
** Test Cases
|
||||
*/
|
||||
|
||||
.tc-testcase-wrapper {
|
||||
.tc-test-case-wrapper {
|
||||
border: 1px solid <<colour foreground>>;
|
||||
background-color: <<colour muted-foreground>>;
|
||||
border-radius: 6px;
|
||||
}
|
||||
|
||||
.tc-tiddler-frame .tc-testcase-wrapper {
|
||||
.tc-tiddler-frame .tc-test-case-wrapper {
|
||||
margin-left: -0.5em;
|
||||
margin-right: -0.5em;
|
||||
}
|
||||
|
||||
.tc-testcase-wrapper {
|
||||
.tc-test-case-wrapper {
|
||||
background-color: <<colour testcase-accent-level-1>>;
|
||||
}
|
||||
|
||||
.tc-testcase-wrapper .tc-testcase-wrapper {
|
||||
.tc-test-case-wrapper .tc-test-case-wrapper {
|
||||
background-color: <<colour testcase-accent-level-2>>;
|
||||
}
|
||||
|
||||
.tc-testcase-wrapper .tc-testcase-wrapper .tc-testcase-wrapper {
|
||||
.tc-test-case-wrapper .tc-test-case-wrapper .tc-test-case-wrapper {
|
||||
background-color: <<colour testcase-accent-level-3>>;
|
||||
}
|
||||
|
||||
.tc-testcase-header {
|
||||
.tc-test-case-header {
|
||||
font-weight: normal;
|
||||
margin: 0.5em 0;
|
||||
padding: 0 0.5em;
|
||||
}
|
||||
|
||||
.tc-testcase-divider {
|
||||
.tc-test-case-divider {
|
||||
x-background-color: <<colour muted-foreground>>;
|
||||
}
|
||||
|
||||
.tc-testcase-result-icon {
|
||||
.tc-test-case-result-icon {
|
||||
fill: #fff;
|
||||
padding: 0.25em;
|
||||
display: inline-block;
|
||||
|
|
@ -3269,29 +3269,29 @@ span.tc-translink > a:first-child {
|
|||
margin-right: 0.25em;
|
||||
}
|
||||
|
||||
.tc-testcase-result-icon-pass {
|
||||
.tc-test-case-result-icon-pass {
|
||||
background-color: green;
|
||||
}
|
||||
|
||||
.tc-testcase-result-icon-fail {
|
||||
.tc-test-case-result-icon-fail {
|
||||
background-color: red;
|
||||
}
|
||||
|
||||
.tc-testcase-result-icon svg {
|
||||
.tc-test-case-result-icon svg {
|
||||
width: 0.5em;
|
||||
height: 0.5em;
|
||||
}
|
||||
|
||||
.tc-testcase-header > h2,
|
||||
.tc-testcase-source > pre {
|
||||
.tc-test-case-header > h2,
|
||||
.tc-test-case-source > pre {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.tc-testcase-header > h2 a.tc-tiddlylink-missing {
|
||||
.tc-test-case-header > h2 a.tc-tiddlylink-missing {
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
.tc-testcase-result-fail {
|
||||
.tc-test-case-result-fail {
|
||||
border: 1px solid <<colour foreground>>;
|
||||
background-color: <<colour background>>;
|
||||
border-radius: 4px;
|
||||
|
|
@ -3299,7 +3299,7 @@ span.tc-translink > a:first-child {
|
|||
padding: 0;
|
||||
}
|
||||
|
||||
.tc-testcase-result-fail-header {
|
||||
.tc-test-case-result-fail-header {
|
||||
background: <<colour diff-delete-background>>;
|
||||
color: <<colour diff-delete-foreground>>;
|
||||
border-top-left-radius: 4px;
|
||||
|
|
@ -3307,19 +3307,19 @@ span.tc-translink > a:first-child {
|
|||
padding: 4px;
|
||||
}
|
||||
|
||||
.tc-testcase-result-fail-body {
|
||||
.tc-test-case-result-fail-body {
|
||||
padding: 4px;
|
||||
}
|
||||
|
||||
.tc-testcase-source > pre {
|
||||
.tc-test-case-source > pre {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.tc-testcase-narrative {
|
||||
.tc-test-case-narrative {
|
||||
padding: 0.5em;
|
||||
}
|
||||
|
||||
.tc-testcase-panes {
|
||||
.tc-test-case-panes {
|
||||
display: flex;
|
||||
align-items: stretch;
|
||||
flex-wrap: wrap;
|
||||
|
|
@ -3328,21 +3328,21 @@ span.tc-translink > a:first-child {
|
|||
border-bottom-right-radius: 6px;
|
||||
}
|
||||
|
||||
.tc-testcase-source {
|
||||
.tc-test-case-source {
|
||||
flex: 1 0 49%;
|
||||
min-width: 250px;
|
||||
}
|
||||
|
||||
.tc-testcase-source .tc-tab-content {
|
||||
.tc-test-case-source .tc-tab-content {
|
||||
background: <<colour background>>;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.tc-testcase-source .tc-field-table {
|
||||
.tc-test-case-source .tc-field-table {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.tc-testcase-source table.tc-field-table {
|
||||
.tc-test-case-source table.tc-field-table {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
|
|
@ -3350,15 +3350,15 @@ span.tc-translink > a:first-child {
|
|||
margin: 0;
|
||||
}
|
||||
|
||||
.tc-testcase-divider {
|
||||
.tc-test-case-divider {
|
||||
flex: 0 0 1.5%;
|
||||
}
|
||||
|
||||
.tc-testcase-source .tc-tab-buttons {
|
||||
.tc-test-case-source .tc-tab-buttons {
|
||||
padding-top: 0;
|
||||
}
|
||||
|
||||
.tc-testcase-output {
|
||||
.tc-test-case-output {
|
||||
box-shadow: inset 2px 2px 10px 0px <<colour muted-foreground>>;
|
||||
background: <<colour background>>;
|
||||
border-radius: 4px;
|
||||
|
|
|
|||
Loading…
Reference in New Issue