vue-cli: [cypress] test:e2e doesn't run in headless mode if project uses cli-plugin-typescript

Version

3.1.1

Reproduction link

https://github.com/cexbrayat/vue-cypress-e2e-issue

Node and OS info

Node 8.11, npm 6.4, macOS 10.14

Steps to reproduce

npx @vue/cli@3.1.1 create vue-cypress-e2e-issue --inlinePreset '{"useConfigFiles": true,"plugins": {"@vue/cli-plugin-typescript": {"classComponent": true,"tsLint": true,"lintOn": ["save"]},"@vue/cli-plugin-unit-jest": {},"@vue/cli-plugin-e2e-cypress": {}}}'

# or git clone https://github.com/cexbrayat/vue-cypress-e2e-issue

cd vue-cypress-e2e-issue
npm run test:e2e -- --headless

What is expected?

When running npm run test:e2e -- --headless, the test should complete.

What is actually happening?

The task hangs and never runs the test nor fails or completes.

It logs:

vue-cypress-e2e-issue git:master ❯ npm run test:e2e -- --headless

> vue-cypress-e2e-issue@0.1.0 test:e2e /Users/ced-pro/Code/test/vue/vue-cypress-e2e-issue
> vue-cli-service test:e2e "--headless"

 INFO  Starting e2e tests...
 INFO  Starting development server...
Starting type checking and linting service...
Using 1 worker with 2048MB memory limit


 DONE  Compiled successfully in 2012ms                                                                                            11:45:27 AM

Type checking and linting in progress...

  App running at:
  - Local:   http://localhost:8080/
  - Network: http://192.168.150.187:8080/

  App is served in production mode.
  Note this is for preview or E2E testing only.

No type errors found
No lint errors found
Version: typescript 3.1.6, tslint 5.11.0
Time: 2246ms

====================================================================================================

  (Run Starting)

  ┌────────────────────────────────────────────────────────────────────────────────────────────────┐
  │ Cypress:    3.1.1                                                                              │
  │ Browser:    Electron 59 (headless)                                                             │
  │ Specs:      1 found (test.js)                                                                  │
  └────────────────────────────────────────────────────────────────────────────────────────────────┘


────────────────────────────────────────────────────────────────────────────────────────────────────

  Running: test.js...                                                                      (1 of 1)
Starting type checking and linting service...
Using 1 worker with 2048MB memory limit


 DONE  Compiled successfully in 2994ms

And hangs there indefinitely.

Note that it works well if not in headless mode.


The project uses cli-plugin-typescript. The e2e tests run fine if not in headless mode.

If TypeScript is not used, the e2e tests are fine in headless mode or not.

Workaround

Commenting:

module.exports = (on, config) => {
  on('file:preprocessor', webpack({
    // webpackOptions: require('@vue/cli-service/webpack.config'),
    watchOptions: {}
  }))

in tests/e2e/plugins/index.js fixes the issue. The task then run fine in headless mode as well.

Might be related to https://github.com/vuejs/vue-cli/issues/2783 but in this case I never have a complete run not even the first one.

About this issue

  • Original URL
  • State: closed
  • Created 6 years ago
  • Reactions: 1
  • Comments: 17 (11 by maintainers)

Commits related to this issue

Most upvoted comments

Existing projects that currently have this preprocessor configured would have their builds fail after updating the cypress package, since fresh npm install calls wouldn’t install the preprocessor dependency anymore.

Actually this dependency is injected into package.json once the generator gets called so no existing project will break.

https://github.com/vuejs/vue-cli/blob/662b1d38b98b1ed7c1f2066846e6589d9832b006/packages/%40vue/cli-plugin-e2e-cypress/generator/index.js#L7-L10

I’d like to get @sodatea’s view on this first. If he’s on the same page, you can submit a PR, sure.