Update Cypress plugin to reflect new cross-browser capabilities

[amirrustam]

Cypress version 4.0.0 will be introducing Firefox and MS Edge support. Vue CLI Cypress plugin users will now be able to run tests in Chromium-based browsers, Firefox, and Electron. This PR updates the CLI messaging and plugin readme to reflect these upcoming changes.

What kind of change does this PR introduce? (check at least one)

• Bugfix
• Feature
• Code style update
• Refactor
• Docs
• Underlying tools
• Other, please describe:

Does this PR introduce a breaking change? (check one)

• Yes
• No

[vesper8]

The migration guide mentions at least 5 breaking changes to look out for when upgrading to 4.0 so I'm not sure if it's accurate to say that changing the dependency of Cypress to ^4.0 causes no breaking changes

I certainly see this breaking unaware people's cypress tests in many cases

https://docs.cypress.io/guides/references/migration-guide.html#Migrating-to-Cypress-4-0

[amirrustam]

Thanks for the feedback @vesper8.

Breaking changes are rare with Cypress, but when they are introduced during a major version bump, we take great care to communicate the changes to users and guide them to resources/examples for a quick resolution.

For example, let's take a look at the first migration example from the guide you linked regarding the use of a done() callback while a test returns a promise. I can simulate this scenario with the following:

describe('4.0 Migration Scenarios', () => {
  it('mocha upgrade', (done) => {
    cy.visit('https://example.cypress.io')

    return new Promise((resolve) => {
      resolve()
    }).then(() => {
      done()
    })
  })
})

When we run this test, it does not mysteriously fail and leave the user confused. Instead, the user will see the following:

1. The error is explained in plain English.
2. Link user to related fix, guide, or explanation.

We actually have a page in the Cypress docs that explains all error message, and we link to each one as appropriate from Cypress.

The important thing is that we're upfront and helpful to the user during these moments.

Some questions to move things forward:

• Will Cypress breaking changes require a major release for Vue CLI?
• Is the breaking change communication/experience of Cypress sufficient for Vue CLI users after an upgrade?

[vesper8]

Thank you for your helpful message @amirrustam, to be clear I've already upgraded to Cypress 4 and found the experience easy and smooth. I for one would certainly love for Cypress 4 to become the new default in vue-cli v4. I was simply pointing out that the upgrade does mention a few breaking changes and this will in all likelihood result in tests breaking so the answer in the initial post indicating that this PR brings in no breaking change was questionable. I sure do appreciate the usefulness of the warnings and errors that Cypress can return.

[Akryum]

I don't think we can push a minor or a patch update that breaks our users tests even if Cypress can document itself. Also, we have enterprise users that are not as flexible as solo developers and it would be a hassle to require them to update their test in a "non-breaking" update. We would need to bump Vue CLI version to 5.0 imo.

[Akryum]

@sodatea Do we have a 5.0 release planned already?

[sodatea]

I've created a project board for v5.

But I'd more like to wait until Webpack 5 reaches RC phase to start working on it.

[loter]

Please update cypress version from 4.0.0 to 4.0.1

[amirrustam]

@sodatea thank you for including this within your v5 plans. Is there a timeframe for Webpack 5 RC release?

It would be great to deliver the new Firefox support and other Cypress v4 benefits to Vue CLI users sooner than later. I appreciate your consideration.

[jacobbundren]

Is this going into an upcoming release?

[MickaelBergem]

FWIW the latest version is now 4.3.0 :)

[smarandav]

Can we use a Cypress >=4.5.0 as there is a dependency down the chain on cypress on mocha 2.4.5 that is reeeay old and causes issues with other plugins? Many thanks!

And any luck for this pr to be merged soon? :)

[amirrustam]

@jacobbundren This will be added in the v5 version of the CLI.

@MickaelBergem There will be many more releases of Cypress by the time v5 of the CLI is released. I'll update the PR with the latest version prior to the CLI release.

[doits]

FYI: Until a new vue-cli version is released you can manually force the latest version if you use yarn with resolutions. In your package.json:

{
  "resolutions": {
    "cypress": "^4.4.0"
  }
}

[ZwapKillrath]

Any news yet...Waiting eagerly :-)

[igorshubovych]

It make sense to upgrade to Cypress at least 4.4.0, because it better supports TS.

[sodatea]

My updated plan:
Ship Vue CLI 4.5 next month with preliminary 1st-party support for Vue 3.
Then start working on the next major version regardless of the progress of webpack 5.

[morgant]

Upgrading to Cypres 4.x would also improve BSD support as Cypress 4.0.0 bumps its cachedir dependency to a version which correctly supports more POSIX OSes, esp. BSDs. Prior versions of cypress (and so @vue/cli-plugin-e2e-cypress) fail to install on BSDs due to a cachedir error.

[smarandav]

Any news when this is going to be merged as we are eagerly waiting for the bump of cypress version above 4.5, thanks!! @sodatea

[tschoartschi]

@smarandav we are also waiting for the newest version of Cypress. In the meanwhile we use the following workaround: #5352

We bumped to 4.8.0 and we are not experiencing any troubles.

[tongvantruong]

Hi bros, I am waiting for this change. Thanks

[maltewirz]

Hi there @yyx990803 , also waiting for this. Many thanks!

[mathew-ferry13]

@yyx990803 Any updates?

[sodatea]

Scheduled after the v4.5 release.

For v4.5, I'm still reviewing #5356 #5479 and working on #5637

[amirrustam]

We'll be releasing Cypress version 5.0 soon. I'll update this PR after the release, so CLI 4.5 can at least be anchored to the next major version of Cypress.

[layanto]

@amirrustam Will component unit testing via cypress be supported in addition to the currently supported unit testing with Mocha+Chai or Jest? See https://github.com/JessicaSachs/vue-cli-plugin-cypress-experimental

[ZwapKillrath]

We'll be releasing Cypress version 5.0 soon. I'll update this PR after the release, so CLI 4.5 can at least be anchored to the next major version of Cypress.

Hi Amir,

When do you expect 5.0 to be released?
(no pressure added :-) )

[Mikilll94]

Any updates on this?

[amirrustam]

We just released Cypress v5.0. Updating this PR now.

[amirrustam]

@sodatea looks like the previous version of this PR was slated for 4.5, but now it's scheduled for 5.0. What's the expected time frame for CLI v5?

We'd like Cypress version updates to be easier in the future. So are you open to this idea? #5703 (comment)

Side-topic: my latest commit failed a Cypress test, I can easily resolve this locally, but a faster way to see what went wrong is the Cypress Dashboard. I can get Vue CLI project OSS plan access (essentially full-featured for free), would you be interested?

[sodatea]

@amirrustam
I'm working on the development plan of v5 this week.

According to past experience, it may cost ~3 months before the stable release. An alpha version may come out before the end of October.

And yeah, Cypress should be a peer dependency in the next major. It's a regret that we didn't make it in v4.

[sodatea]

The Cypress Dashboard looks really cool! I'd love to have access to its features. Thanks very much 😄

[sodatea]

Merged via command line with 3717f7c & 149e3f1