-
Notifications
You must be signed in to change notification settings - Fork 10.3k
chore: Upgrade Cypress from v9 to v12 #37810
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Conversation
| @@ -1,5 +1,3 @@ | |||
| import { parseSrcset } from "srcset" | |||
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Unused import
| }, | ||
| "devDependencies": { | ||
| "@cypress/snapshot": "^2.1.7", | ||
| "@simonsmith/cypress-image-snapshot": "^6.0.1", |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
cypress-image-snapshot doesn't work with Cypress 12 and this is a fork
| "serve": "gatsby serve", | ||
| "cy:open": "cypress open", | ||
| "cy:run": "node ../../scripts/cypress-run-with-conditional-record-flag.js --browser chrome" | ||
| "cy:open": "cypress open --browser chrome --e2e", |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Cypress now also has component testing so this tells it to directly open the e2e test suite with the chrome browser
|
|
||
| describe(`testing error overlay and ability to automatically recover runtime errors cause by content changes (page queries variant)`, () => { | ||
| it(`displays content initially (no errors yet)`, () => { | ||
| describe(`testing error overlay and ability to automatically recover runtime errors cause by content changes (page queries variant)`, { testIsolation: false } , () => { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
New default in Cypress 12 is test isolation but these tests kinda rely on them so we opt-out
| it(`plain less`, () => { | ||
| // we don't want to visit page for each test - we want to visit once and then test HMR | ||
| cy.window().then(win => { | ||
| cy.spy(win.console, `log`).as(`hmrConsoleLog`) |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This is already getting set inside the support/e2e.ts file with the
Cypress.Commands.overwrite("visit")
overwrite
| window.notReloaded = true | ||
| window.___navigate(`/deep-link-page/`) | ||
| }) | ||
| // just setting some property on the window |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Adjusted from https://glebbahmutov.com/blog/detect-page-reload/
| // we expect 2 `componentDidMount` calls - 1 for initial page and 1 for second page | ||
| cy.lifecycleCallCount(`componentDidMount`).should(`equal`, 2) | ||
| cy.lifecycleCallCount(`render`).should(`equal`, Cypress.env(`TEST_PLUGIN_OFFLINE`) ? 3 : 2) | ||
| cy.lifecycleCallCount(`render`).should(`equal`, 2) |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This now works 🤷
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
The paths for the snapshots changed. You can check the E2E test to compare the paths it generates now to this
|
|
||
| const shouldRecord = | ||
| !!process.env.CYPRESS_PROJECT_ID && !!process.env.CYPRESS_RECORD_KEY && IS_CI | ||
| const shouldRecord = !!process.env.CYPRESS_RECORD_KEY && IS_CI |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
projectId is now mostly in the config file itself, so this had to go
| cypressArgs.push(`--record`) | ||
|
|
||
| if (process.env.CYPRESS_GROUP_NAME) { | ||
| cypressArgs.push(`--group`, process.env.CYPRESS_GROUP_NAME) |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
--group alone fails if --record is not also given
Description
This updates our E2E tests from Cypress v9 to v12. Migration guide: https://docs.cypress.io/guides/references/migration-guide
I did also do some other following changes while at it:
start-server-and-testto v2 (no breaking changes for us)cypress-image-snapshotto@simonsmith/cypress-image-snapshotbecause the former isn't compatible with Cypress v12Tests
All tests should still run fully and pass.