eddyerburgh / vue-test-utils-ava-example

An example vue-test-utils project with AVA

vue-test-utils-ava-example

An example project using vue-test-utils and ava to run unit tests

Build Setup

# install dependencies
npm install

# serve with hot reload at localhost:8080
npm run dev

# build for production with minification
npm run build

# build for production and view the bundle analyzer report
npm run build --report

For detailed explanation on how things work, checkout the guide and docs for vue-loader.

Demo project using Nuxt.js and AVA for E2E and unit testing.

vue-test-utils-ava-example's Issues

Question about source maps

I'm using this setup for testing on my own application and ran into issues with source maps.

The require-extension-hooks extension does seem to be producing a source map, but it's not getting respected by Ava. So when a test fails, the stack track/error that Ava throws is usually completely wrong.

Any ideas how I might be able to get sourcemaps working properly with this example?

Multi File Components Not Mounting

I'm having an issue where multi file components aren't mounting. I forked this example and moved the JS to its own file and it fails the basic test. Is there a different way to handle multi file components to be compatible with AVA?

https://github.com/Gregoyle/Ava_Vue_Multi_File_Fail
https://github.com/Gregoyle/Ava_Vue_Multi_File_Fail/blob/master/src/components/List.vue

Coverage with nyc not mapped correctly

Related to #1, I can't seem to get the nyc coverage reports working correctly.

In this fork: https://github.com/mdvorscak/vue-test-utils-ava-example I added nyc, partially following https://github.com/avajs/ava/blob/master/docs/recipes/code-coverage.md .

If you checkout the fork and run npm run unit you'll see the branch coverage on List.Vue is not correct:

This appears to be related to the source map (considering there are no lines 18-20 in the source List.vue)

I've tried a whole bunch of combinations of setups from the ava code coverage recipe, and can't seem to get the coverage working with Vue. Any ideas on how to get the source maps working?

Demo with Nuxt

Hi,

Just wanted to add a link to the demo repo which uses Ava & Nuxt for folks coming here via searching the interwebz.

https://github.com/vinayakkulkarni/nuxt-ava-e2e-unit-testing

--
Regards,
Vinayak Ku

Build Setup steps and tests fail

Hello,

I am going through your example projects trying to find a test harness that works.

Following the build setup steps:

• npm install: ok
• npm run dev: fails
  • a webpage is opened (http://localhost:8080/) but gives a 404 Cannot GET /
  • this error is shown:

 ERROR  Failed to compile with 2 errors                                                                                                                                                                    3:11:34 PM

Module build failed: TypeError: sourceText.startsWith is not a function
    at Function.SourceCodeFixer.applyFixes (/home/jsanders/Downloads/vue-test-utils-ava-example/node_modules/eslint/lib/util/source-code-fixer.js:76:26)
    at Function.SourceCodeFixer.applyFixes (/home/jsanders/Downloads/vue-test-utils-ava-example/node_modules/eslint-plugin-html/src/index.js:151:23)
    at Linter.verifyAndFix (/home/jsanders/Downloads/vue-test-utils-ava-example/node_modules/eslint/lib/linter.js:1141:43)
    at processText (/home/jsanders/Downloads/vue-test-utils-ava-example/node_modules/eslint/lib/cli-engine.js:180:32)
    at CLIEngine.executeOnText (/home/jsanders/Downloads/vue-test-utils-ava-example/node_modules/eslint/lib/cli-engine.js:620:17)
    at lint (/home/jsanders/Downloads/vue-test-utils-ava-example/node_modules/eslint-loader/index.js:218:17)
    at Object.module.exports (/home/jsanders/Downloads/vue-test-utils-ava-example/node_modules/eslint-loader/index.js:213:21)

Module build failed: TypeError: sourceText.startsWith is not a function
    at Function.SourceCodeFixer.applyFixes (/home/jsanders/Downloads/vue-test-utils-ava-example/node_modules/eslint/lib/util/source-code-fixer.js:76:26)
    at Function.SourceCodeFixer.applyFixes (/home/jsanders/Downloads/vue-test-utils-ava-example/node_modules/eslint-plugin-html/src/index.js:151:23)
    at Linter.verifyAndFix (/home/jsanders/Downloads/vue-test-utils-ava-example/node_modules/eslint/lib/linter.js:1141:43)
    at processText (/home/jsanders/Downloads/vue-test-utils-ava-example/node_modules/eslint/lib/cli-engine.js:180:32)
    at CLIEngine.executeOnText (/home/jsanders/Downloads/vue-test-utils-ava-example/node_modules/eslint/lib/cli-engine.js:620:17)
    at lint (/home/jsanders/Downloads/vue-test-utils-ava-example/node_modules/eslint-loader/index.js:218:17)
    at Object.module.exports (/home/jsanders/Downloads/vue-test-utils-ava-example/node_modules/eslint-loader/index.js:213:21)

You may use special comments to disable some warnings.
Use // eslint-disable-next-line to ignore the next line.
Use /* eslint-disable */ to ignore all warnings in a file.
> Listening at http://localhost:8080

• removing the eslint-loader fixes this step and then the page can be viewed

• npm run build: suffers the same issues as npm run dev

• npm run unit: fails with this error:

internal/modules/cjs/loader.js:638
    throw err;
    ^

Error: Cannot find module 'vue-test-utils'
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:636:15)
    at Function.Module._load (internal/modules/cjs/loader.js:562:25)
    at Module.require (internal/modules/cjs/loader.js:690:17)
    at require (internal/modules/cjs/helpers.js:25:18)
    at Object.<anonymous> (/home/jsanders/Downloads/vue-test-utils-ava-example/test/specs/Message.spec.js:1:1)
    at Module._compile (internal/modules/cjs/loader.js:776:30)
    at extensions.(anonymous function) (/home/jsanders/Downloads/vue-test-utils-ava-example/node_modules/require-precompiled/index.js:13:11)
    at Object.require.extensions.(anonymous function) [as .js] (/home/jsanders/Downloads/vue-test-utils-ava-example/node_modules/ava/lib/process-adapter.js:100:4)
    at Module.load (internal/modules/cjs/loader.js:653:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:593:12)
internal/modules/cjs/loader.js:638
    throw err;

Error: Cannot find module 'vue-test-utils'
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:636:15)
    at Function.Module._load (internal/modules/cjs/loader.js:562:25)
    at Module.require (internal/modules/cjs/loader.js:690:17)
    at require (internal/modules/cjs/helpers.js:25:18)
    at Object.<anonymous> (/home/jsanders/Downloads/vue-test-utils-ava-example/test/specs/List.spec.js:1:1)
    at Module._compile (internal/modules/cjs/loader.js:776:30)
    at extensions.(anonymous function) (/home/jsanders/Downloads/vue-test-utils-ava-example/node_modules/require-precompiled/index.js:13:11)
    at Object.require.extensions.(anonymous function) [as .js] (/home/jsanders/Downloads/vue-test-utils-ava-example/node_modules/ava/lib/process-adapter.js:100:4)
    at Module.load (internal/modules/cjs/loader.js:653:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:593:12)
internal/modules/cjs/loader.js:638
    throw err;
    ^

Error: Cannot find module 'vue-test-utils'
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:636:15)
    at Function.Module._load (internal/modules/cjs/loader.js:562:25)
    at Module.require (internal/modules/cjs/loader.js:690:17)
    at require (internal/modules/cjs/helpers.js:25:18)
    at Object.<anonymous> (/home/jsanders/Downloads/vue-test-utils-ava-example/test/specs/MessageToggle.spec.js:1:1)
    at Module._compile (internal/modules/cjs/loader.js:776:30)
    at extensions.(anonymous function) (/home/jsanders/Downloads/vue-test-utils-ava-example/node_modules/require-precompiled/index.js:13:11)
    at Object.require.extensions.(anonymous function) [as .js] (/home/jsanders/Downloads/vue-test-utils-ava-example/node_modules/ava/lib/process-adapter.js:100:4)
    at Module.load (internal/modules/cjs/loader.js:653:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:593:12)

  3 exceptions

  ✖ test/specs/Message.spec.js exited with a non-zero exit code: 1

  ✖ test/specs/List.spec.js exited with a non-zero exit code: 1

  ✖ test/specs/MessageToggle.spec.js exited with a non-zero exit code: 1

• this is despite the fact that vue-test-utils is found in node_modules