Change <it will="..."> to <test name="...">. Fix issue cleaning up generated files after failed run.

Author: johnsusek

README.md

@@ -29,15 +29,29 @@ The file is split into two sections, the `<tests>` and the `<script>`.
 
 More details are available in the [API Docs](https://github.com/johnsusek/vue-test-declarative/blob/master/docs/API.md).
 
-## Example .vuetest file
+## Examples
+
+## Simplest
+
+The simplest possible test just checks for the specified text anywhere in the rendered component.
+
+```xml
+<tests for="@/components/MyComponent.vue">
+  <test name="Contains success message">
+    <expect text to-match="Success!" />
+  </it>
+</tests>
+```
+
+## HelloWorld
 
 For this example, we'll test the `HelloWorld` component from the [default vue-cli template](https://github.com/vuejs/vue-cli/blob/master/packages/@vue/cli-service/generator/template/src/components/HelloWorld.vue). 
 
 Create a `HelloWorld.vuetest` file in the `tests/declarative` directory with these contents:
 
 ```xml
 <tests for="@/components/HelloWorld.vue">
-  <it will="render message correctly" v-bind:props="props">
+  <test name="Render message correctly" v-bind:props="props">
     <expect text to-match="Welcome!" />
   </it>
 </tests>

bin/run.js

@@ -160,13 +160,13 @@ function runTests() {
 
 // remove generated tests
 function cleanup() {
-  glob(workingDir + '/*.vuetest.spec.js', options, (err, files) => {
-    files.forEach(file => {
-      fs.unlinkSync(file);
-    })
+  let files = glob.sync(workingDir + '/*.vuetest.spec.js', options);
+  
+  files.forEach(file => {
+    fs.unlinkSync(file);
+  })
 
-    fs.unlinkSync(workingDir + '/generated-setup.js');
-  });
+  fs.unlinkSync(workingDir + '/generated-setup.js');
 }
 
 function quit(message, code = 1) {

docs/API.md

@@ -3,11 +3,11 @@
 In summary, a .vuetest file looks like this:
 ```xml
 <tests>
-  <it>
+  <test>
     <set>
     <trigger>
     <expect>
-  </it>
+  </test>
 </tests>
 
 <script></script>
@@ -34,16 +34,16 @@ This is the path to the component, used when importing it into your tests. Webpa
 
 <br>
 
-## `<it>`
+## `<test>`
 <details>
  <summary>Details</summary>
 
 ```xml
-<it will="WillValue" BindingTarget="BindingValue">
+<test name="NameValue" BindingTarget="BindingValue">
 ```
 
-### WillValue
-This is used as the description for the test case.
+### NameValue
+This is used as the display name when running the test.
 
 ### BindingTarget
 
@@ -59,13 +59,13 @@ The BindingTarget will be set to this value of the `context` variable in your `<
 
 #### Examples:
 ```xml
-<it will="render app">
+<test name="render app">
 ```
 ```xml
-<it will="render message correctly" v-bind:props="myProps">
+<test name="render message correctly" v-bind:props="myProps">
 ```
 ```xml
-<it will="render data value correctly" v-bind:data="myData">
+<test name="render data value correctly" v-bind:data="myData">
 ```
 
 </details>

docs/Install.md

@@ -26,7 +26,7 @@ Create config file `vuetest.config.json` with these contents:
 Create test file `tests/declarative/App.vuetest` in this directory with these contents:
 ```xml
 <tests for="../../examples/todomvc/components/App.vue">
-  <it will="Render app">
+  <test name="Render app">
     <expect html to-match="todos" />
   </it>
 </tests>

docs/examples/Vue-CLI-HelloWorld.vuetest

@@ -4,9 +4,9 @@
 -->
 
 <tests for="@/components/HelloWorld.vue">
-  <it will="render message correctly" v-bind:props="props">
+  <test name="render message correctly" v-bind:props="props">
     <expect text to-match="Welcome!" />
-  </it>
+  </test>
 </tests>
 
 <script>

docs/examples/Vuex-TodoMVC.vuetest

@@ -9,48 +9,48 @@
 -->
 
 <tests for="../../examples/todomvc/components/App.vue">
-  <it will="render header">
+  <test name="render header">
     <expect text-of="h1" to-match="todos" />
-  </it>
+  </test>
 
-  <it will="add a todo">
+  <test name="add a todo">
     <set selector=".new-todo" value="First" />
     <trigger selector=".new-todo" event="keyup.enter" />
     <expect text-of=".todo-list li" to-match="First" />
     <expect text-of=".todo-count" to-match="1 item left" />
-  </it>
+  </test>
 
-  <it will="remove a todo">
+  <test name="remove a todo">
     <expect text-of=".todo-list" to-be-truthy />
     <trigger selector=".todo-list li .destroy" event="click" />
     <expect text-of=".todo-list" to-be-falsy />
-  </it>
+  </test>
 
-  <it will="add then complete a todo">
+  <test name="add then complete a todo">
     <set selector=".new-todo" value="Another" />
     <trigger selector=".new-todo" event="keyup.enter" />
     <trigger selector="input.toggle" event="click" />
     <expect text-of=".todo.completed" to-match="Another" />
-  </it>
+  </test>
 
-  <it will="clicking `active` hides list">
+  <test name="clicking `active` hides list">
     <expect text-of=".todo-list" to-be-truthy />
     <trigger selector='a[href="#/active"]' event="click" />
     <expect text-of=".todo-list" to-be-falsy />
-  </it>
+  </test>
 
-  <it will="clicking `completed` shows item we added + completed">
+  <test name="clicking `completed` shows item we added + completed">
     <trigger selector='a[href="#/completed"]' event="click" />
     <expect text-of=".todo-list" to-equal="Another" />
-  </it>
+  </test>
 
-  <it will="clear the list when `clear completed` is clicked">
+  <test name="clear the list when `clear completed` is clicked">
     <expect text-of=".todo-list" to-equal="Another" />
     <trigger selector=".clear-completed" event="click" />
     <expect text-of=".todo-list" to-be-falsy />
-  </it>
+  </test>
 
-  <it will="mark all items completed when `toggle all` clicked">
+  <test name="mark all items completed when `toggle all` clicked">
     <!-- Add a todo -->
     <set selector=".new-todo" value="Another" />
     <trigger selector=".new-todo" event="keyup.enter" />
@@ -62,5 +62,5 @@
     <!-- Confirm the active list is empty -->
     <trigger selector='a[href="#/active"]' event="click" />
     <expect text-of=".todo-list" to-be-falsy />
-  </it>
+  </test>
 </tests>

generate.js

@@ -1,5 +1,5 @@
 // Loop through parsed xml and write out js
-let generateIt = require('./generateIt');
+let generateTest = require('./generateTest');
 
 let head = `
 /* THIS FILE IS AUTO-GENERATED, EDITS WILL BE OVERWRITTEN */
@@ -21,20 +21,20 @@ function generate(componentPath, parsed, script, localVue) {
 
   lines.push(`describe('${componentPath}', () => {\n`);
 
-  let its;
+  let tests;
 
-  // parsed.tests.it might be either an object (single child) or array (multiple)
+  // parsed.tests.test might be either an object (single child) or array (multiple)
   // if single child, turn into array then foreach like usual
-  if (Array.isArray(parsed.tests.it)) {
-    its = parsed.tests.it;
+  if (Array.isArray(parsed.tests.test)) {
+    tests = parsed.tests.test;
   }
   else {
-    its = [parsed.tests.it];
+    tests = [parsed.tests.test];
   }
 
   // loop through each 'its' to generate the case
-  its.forEach(it => {
-    lines = lines.concat(generateIt.generateIt(it));
+  tests.forEach(test => {
+    lines = lines.concat(generateTest.generateTest(test));
   });
 
   lines.push('});');

generateIt.js renamed to generateTest.js

@@ -2,30 +2,30 @@ let { generateExpect } = require('./generateExpect');
 let { generateTrigger } = require('./generateTrigger');
 let { generateSet } = require('./generateSet');
 
-function generateIt(it) {
+function generateTest(test) {
   let lines = [];
 
-  lines.push(`  it('will ${it.$.will}', async () => {`);
+  lines.push(`  it('${test.$.name}', async () => {`);
 
   // TODO: move this out one level?
   lines.push(`    let options = { localVue, sync: false }`)
   lines.push(`    if (typeof store !== 'undefined') { options.store = store; }`);
   lines.push(`    let wrapper = mount(Component, options);`);
 
   // v-bind:props="props" = wrapper.setProps(props)
-  let propsBinding = it.$['v-bind:props'];
+  let propsBinding = test.$['v-bind:props'];
   if (propsBinding) {
     lines.push(`    wrapper.setProps(context.${propsBinding});`);
   }
 
   // v-bind:data="data" = wrapper.setData(data)
-  let dataBinding = it.$['v-bind:data'];
+  let dataBinding = test.$['v-bind:data'];
   if (dataBinding) {
     lines.push(`    wrapper.setData(context.${dataBinding});`);
   }
 
-  // loop through each child of it.$$ and build either an expect line or a trigger line
-  it.$$.forEach(child => {
+  // loop through each child of test.$$ and build either an expect line or a trigger line
+  test.$$.forEach(child => {
     lines = lines.concat(generateLines(child));
   });
 
@@ -52,7 +52,7 @@ function generateLines(child) {
       break;
   }
 
-  // For some reason, the first tag shows up in it.$$ and 
+  // For some reason, the first tag shows up in test.$$ and 
   // the rest of the tags show up on the first child's $$
   // on tags with bare attributes like 'to-be-truthy'
   // This really seems like it could be a parser bug, but
@@ -69,5 +69,5 @@ function generateLines(child) {
 }
 
 module.exports = {
-  generateIt
+  generateTest
 }