Vue-test-utils: Window is undefined, vue-test-utils needs to be run in a browser environment.

[DylanC]

Version

1.0.0-beta.24

Steps to reproduce

Packages:

• "@vue/test-utils": "^1.0.0-beta.24"
• "jest-serializer-vue": "^2.0.2"
• "jest": "^23.6.0"
• "babel-jest": "^21.2.0"

Run jest --config test/unit/jest.conf.js

My config file:
`const path = require('path')

module.exports = {
rootDir: path.resolve(__dirname, '../../'),
testEnvironment: 'node',
moduleFileExtensions: [
'js',
'json',
'vue'
],
moduleNameMapper: {
'^@/(.)$': '/src/$1'
},
transform: {
'^. \.js$': '/node_modules/babel-jest',
'.\.(vue)$': '/node_modules/vue-jest'
},
snapshotSerializers: ['/node_modules/jest-serializer-vue'],
setupFiles: ['/test/unit/setup'],
collectCoverage:false,
coverageThreshold: {
"global": {
"branches": 0,
"functions": 0,
"lines": 0
}
}
}`

What is expected?

Tests should have a status of PASS.

What is actually happening?

All tests have a status of FAIL for the reason above.

[M3psipax]

Well, it seems you don't have a browser environment for your tests....

npm i --save-dev jsdom-global

add the following line in /test/unit/setup:

require('jsdom-global')

[DylanC]

@M3psipax - Thanks. I also had to add this to my exports:

verbose: true,
testURL: "http://localhost/"

Now I'm back to trying to solve my other issue of require(png) causing error.

Unexpected character '�'

[M3psipax]

since you hadn't added jsdom to your test setup, it's a pretty safe bet you didn't read the docs, which is the least you should do before creating an issue on the github repo.

https://vue-test-utils.vuejs.org/guides/#getting-started

[DylanC]

@M3psipax - I did read the docs. Here is a quote:

The Jest test runner sets up JSDOM automatically. For other test runners, you can manually set up JSDOM for the tests using jsdom-global in the entry for your tests

So I did see JSDOM is setup automatically and my tests did in fact run without adding JSDOM previously. For some reason my tests stopped working which is why I ended up posting an issue.

If JSDOM really is required by default then the docs need to be updated.

[M3psipax]

Oh my bad. Sorry. I use mocha, so I had to do this anyway.

In that case, you're justified and the docs at best seem to be not entirely clear about that.

[DylanC]

@M3psipax - Its no problem. Your suggestion worked anyway and I got my test suites to pass again.

[M3psipax]

you may want to update to beta 25 as well. since the issue might already have been fixed through that.

[eddyerburgh]

Yes currently Vue Test Utils needs to run in a DOM environment. There is a section on it in the docs, and the error message is intended to be descriptive.

I'm open to suggestions for how to improve the docs/ error message.

[mkopinsky]

The full code in question is

function warnIfNoWindow () {
  if (typeof window === 'undefined') {
    throwError(
      "window is undefined, vue-test-utils needs to be " +
      "run in a browser environment. \n" +
      "You can run the tests in node using jsdom \n" +
      "See https://vue-test-utils.vuejs.org/guides/common-tips.html " +
      "for more details."
    );
  }
}

That seems pretty self-explanatory - my only suggestion would be to link to https://vue-test-utils.vuejs.org/guides/#browser-environment instead of https://vue-test-utils.vuejs.org/guides/common-tips.html.

As a non-jest user, I'm curious why

verbose: true,
testURL: "http://localhost/"

were necessary. Are those a code bug, a documentation bug, or a quirk of your setup?

[eddyerburgh]

testURL was recently required by jsdom, and at the time it had to be set in Jest directly—https://github.com/facebook/jest/issues/6766. It looks like Jest now sets a default testURL, which fixes the issue.