From 496df0df7825859905a3cd8bcfd6b6f26ca2aac0 Mon Sep 17 00:00:00 2001 From: John Coburn Date: Fri, 8 Nov 2024 10:42:04 -0600 Subject: [PATCH] replace karma test suite with cypress --- .gitignore | 1 + cypress.config.js | 3 +++ cypress/fixtures/example.json | 5 +++++ cypress/support/commands.js | 25 +++++++++++++++++++++++ cypress/support/component-index.html | 12 +++++++++++ cypress/support/component.js | 30 ++++++++++++++++++++++++++++ package.json | 6 +++--- 7 files changed, 79 insertions(+), 3 deletions(-) create mode 100644 cypress.config.js create mode 100644 cypress/fixtures/example.json create mode 100644 cypress/support/commands.js create mode 100644 cypress/support/component-index.html create mode 100644 cypress/support/component.js diff --git a/.gitignore b/.gitignore index d8e5d6583..997bbab89 100644 --- a/.gitignore +++ b/.gitignore @@ -11,3 +11,4 @@ artifacts /storybook-static/ .vscode .idea +/cypress/screenshots/ \ No newline at end of file diff --git a/cypress.config.js b/cypress.config.js new file mode 100644 index 000000000..cdd9d2735 --- /dev/null +++ b/cypress.config.js @@ -0,0 +1,3 @@ +const { getBaseCypressConfig } = require('@folio/stripes-cli'); + +module.exports = getBaseCypressConfig(); diff --git a/cypress/fixtures/example.json b/cypress/fixtures/example.json new file mode 100644 index 000000000..02e425437 --- /dev/null +++ b/cypress/fixtures/example.json @@ -0,0 +1,5 @@ +{ + "name": "Using fixtures to represent data", + "email": "hello@cypress.io", + "body": "Fixtures are a great way to mock data for responses to routes" +} diff --git a/cypress/support/commands.js b/cypress/support/commands.js new file mode 100644 index 000000000..66ea16ef0 --- /dev/null +++ b/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) => { ... }) \ No newline at end of file diff --git a/cypress/support/component-index.html b/cypress/support/component-index.html new file mode 100644 index 000000000..ac6e79fd8 --- /dev/null +++ b/cypress/support/component-index.html @@ -0,0 +1,12 @@ + + + + + + + Components App + + +
+ + \ No newline at end of file diff --git a/cypress/support/component.js b/cypress/support/component.js new file mode 100644 index 000000000..d8277a8ba --- /dev/null +++ b/cypress/support/component.js @@ -0,0 +1,30 @@ +// *********************************************************** +// This example support/component.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 '@cypress/code-coverage/support'; + +// Import commands.js using ES2015 syntax: +import './commands' + +// Alternatively you can use CommonJS syntax: +// require('./commands') + +import { mount } from 'cypress/react18' + +Cypress.Commands.add('mount', mount) + +// Example use: +// cy.mount() + + diff --git a/package.json b/package.json index 57b0ef1b2..abc50d031 100644 --- a/package.json +++ b/package.json @@ -18,8 +18,8 @@ "storybook": "storybook dev -p 9001 -c .storybook", "storybook-build": "storybook build -c .storybook -o .out", "stylelint": "stylelint \"lib/**/*.css\"", - "test": "stripes test karma", - "test-dev": "stripes test karma --watch" + "test": "stripes test cypress", + "test-dev": "stripes test cypress --cypress.open" }, "engines": { "node": ">=10.0.0" @@ -53,7 +53,7 @@ "@bigtest/interactor": "0.7.2", "@csstools/postcss-relative-color-syntax": "^2.0.7", "@folio/eslint-config-stripes": "^7.0.0", - "@folio/stripes-cli": "^3.0.0", + "@folio/stripes-cli": "https://github.com/folio-org/stripes-cli.git#STCLI-255", "@folio/stripes-testing": "^4.7.0", "@formatjs/cli": "^6.1.3", "@storybook/addon-actions": "^7.6.12",