[#14] Support Cypress 10 (#15)

* feat: bump to cypress 10
* docs: update examples
* ci: move away from Cypress GH action

.github/workflows/test.yml

@@ -17,27 +17,29 @@ jobs:
  run: |
  git config --global core.autocrlf false
  git config --global core.eol lf
-
  - uses: actions/checkout@v2
  - uses: actions/setup-node@v2
  with:
  node-version: "16"
-
  - name: Install dependencies
  run: yarn install --frozen-lockfile
-
  - name: Lint
  run: yarn lint
-
  - name: Test
  run: yarn test
 
  examples:
  runs-on: ubuntu-latest
- container: cypress/browsers:node14.17.0-chrome91-ff89
+ container: cypress/browsers:node16.14.2-slim-chrome100-ff99-edge
  steps:
  - uses: actions/checkout@v2
- - uses: cypress-io/github-action@v2
- with:
- browser: chrome
- project: ./examples
+ - name: Install dependencies
+ run: yarn install --frozen-lockfile
+ - name: Cypress 9.x
+ run: |
+ yarn --cwd examples/9.x install --frozen-lockfile
+ yarn --cwd examples/9.x cy:run
+ - name: Cypress 10.x
+ run: |
+ yarn --cwd examples/10.x install --frozen-lockfile
+ yarn --cwd examples/10.x cy:run

.gitignore

@@ -1,4 +1,5 @@
 coverage
+downloads
 fixtures
 node_modules
 screenshots

README.md

@@ -60,7 +60,7 @@ describe("web-vitals", () => {
 
 ## Examples
 
-An example Cypress test setup with a variety of tests using `cypress-web-vitals` is available in the [`./examples` directory](./examples).
+Example Cypress test setups with a variety of tests using `cypress-web-vitals` for both Cypress 9.x and 10.x are available in the [`./examples` directory](./examples).
 
 ## API
 

cypress/support/commands.js

@@ -0,0 +1,25 @@
+// ***********************************************
+// This example commands.js shows you how to
+// create various custom commands and overwrite
+// existing commands.
+//
+// For more comprehensive examples of custom
+// commands please read more here:
+// https://on.cypress.io/custom-commands
+// ***********************************************
+//
+//
+// -- This is a parent command --
+// Cypress.Commands.add('login', (email, password) => { ... })
+//
+//
+// -- This is a child command --
+// Cypress.Commands.add('drag', { prevSubject: 'element'}, (subject, options) => { ... })
+//
+//
+// -- This is a dual command --
+// Cypress.Commands.add('dismiss', { prevSubject: 'optional'}, (subject, options) => { ... })
+//
+//
+// -- This will overwrite an existing command --
+// Cypress.Commands.overwrite('visit', (originalFn, url, options) => { ... })

cypress/support/e2e.js

@@ -0,0 +1,20 @@
+// ***********************************************************
+// This example support/e2e.js is processed and
+// loaded automatically before your test files.
+//
+// This is a great place to put global configuration and
+// behavior that modifies Cypress.
+//
+// You can change the location of this file or turn off
+// automatically serving support files with the
+// 'supportFile' configuration option.
+//
+// You can read more here:
+// https://on.cypress.io/configuration
+// ***********************************************************
+
+// Import commands.js using ES2015 syntax:
+import './commands'
+
+// Alternatively you can use CommonJS syntax:
+// require('./commands')

examples/10.x/cypress.config.js

@@ -0,0 +1,9 @@
+const { defineConfig } = require("cypress");
+
+module.exports = defineConfig({
+ video: false,
+ screenshotOnRunFailure: false,
+ e2e: {
+ setupNodeEvents(_on, _config) {},
+ },
+});

examples/cypress/support/commands.js → examples/10.x/cypress/support/commands.js

@@ -24,4 +24,4 @@
 // -- This will overwrite an existing command --
 // Cypress.Commands.overwrite('visit', (originalFn, url, options) => { ... })
 
-import "../../../commands";
+import "../../../../commands";

examples/10.x/package.json

@@ -0,0 +1,16 @@
+{
+ "name": "cypress-web-vitals-examples-10.x",
+ "version": "1.0.0",
+ "description": "web-vitals command examples for Cypress 9.x",
+ "author": "Craig Morten <craig.morten@hotmail.co.uk>",
+ "license": "MIT",
+ "main": "index.js",
+ "scripts": {
+ "cy:open": "cypress open",
+ "cy:run": "cypress run --headless --browser chrome"
+ },
+ "devDependencies": {
+ "cypress": "^10.3.0",
+ "cypress-real-events": "^1.7.1"
+ }
+}