Skip to content
This repository was archived by the owner on Sep 20, 2024. It is now read-only.

Commit 3224e15

Browse files
codebender828codebender828
authored
Merge pull request #176 from Shyrro/feat/upgradeCypress
Feat/upgrade cypress
2 parents 2011d38 + a869dfc commit 3224e15

38 files changed

+307
-544
lines changed

‎.huskyrc

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
{
22
"hooks": {
33
"pre-commit": "lint-staged",
4-
"pre-push": "yarn test:ci",
4+
"pre-push": "yarn test:silent",
55
"commit-msg": "commitlint -E HUSKY_GIT_PARAMS"
66
}
77
}

‎cypress.config.ts

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
import { defineConfig } from "cypress"
2+
3+
export default defineConfig({
4+
video: false,
5+
fixturesFolder: false,
6+
reporter: "spec",
7+
component: {
8+
setupNodeEvents(on, config) {},
9+
specPattern: "packages//**/*.cy.*",
10+
excludeSpecPattern: "**/*.snap",
11+
devServer: {
12+
framework: "vue",
13+
bundler: "vite",
14+
},
15+
},
16+
})

‎cypress.json

Lines changed: 0 additions & 10 deletions
This file was deleted.

‎tests/plugins.js renamed to ‎cypress/plugins/index.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,9 +2,9 @@ const { startDevServer } = require("@cypress/vite-dev-server")
22

33
module.exports = (on, config) => {
44
on("dev-server:start", (options) => {
5-
const viteConfig = require("../vite.config")
5+
const viteConfig = require("../../vite.config")
66
viteConfig.esbuild = viteConfig.default.esbuild || {}
7-
// viteConfig.esbuild.jsx = 'preserve'
7+
viteConfig.esbuild.jsx = "preserve"
88
viteConfig.esbuild.jsxFactory = "h"
99
viteConfig.esbuild.jsxFragment = "Fragment"
1010
viteConfig.logLevel = "error"

‎tests/a11y.ts renamed to ‎cypress/support/commands.ts

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,5 @@
1+
/// <reference types="cypress" />
2+
13
/*
24
* This file should be replaced with cypress-axe
35
* once that package becomes esm-compatible
@@ -8,6 +10,7 @@ axeCore.configure({
810
rules: [{ id: "color-contrast", enabled: false }],
911
})
1012

13+
// @ts-ignore
1114
Cypress.Commands.add("checkA11y", () => {
1215
// @ts-ignore
1316
expect().to.be.accessible
@@ -20,7 +23,7 @@ const isAccessible = (_chai, utils) => {
2023
_chai.Assertion.addProperty("accessible", function () {
2124
let _this = this
2225

23-
return cy.get("#__cy_root", { log: false }).then(async ($root) => {
26+
return cy.get("div[data-cy-root]", { log: false }).then(async ($root) => {
2427
const result = await axeCore.run($root[0])
2528
console.log(`A11y results: `, result)
2629
const { passes, violations } = result

‎cypress/support/component-index.html

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<meta charset="utf-8">
5+
<meta http-equiv="X-UA-Compatible" content="IE=edge">
6+
<meta name="viewport" content="width=device-width,initial-scale=1.0">
7+
<title>Components App</title>
8+
</head>
9+
<body>
10+
<div data-cy-root></div>
11+
</body>
12+
</html>

‎cypress/support/component.ts

Lines changed: 87 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,87 @@
1+
/// <reference types="cypress" />
2+
3+
// ***********************************************************
4+
// This example support/component.ts is processed and
5+
// loaded automatically before your test files.
6+
//
7+
// This is a great place to put global configuration and
8+
// behavior that modifies Cypress.
9+
//
10+
// You can change the location of this file or turn off
11+
// automatically serving support files with the
12+
// 'supportFile' configuration option.
13+
//
14+
// You can read more here:
15+
// https://on.cypress.io/configuration
16+
// ***********************************************************
17+
18+
// Import commands.js using ES2015 syntax:
19+
import "./commands"
20+
21+
// Alternatively you can use CommonJS syntax:
22+
// require('./commands')
23+
24+
import { mount } from "cypress/vue"
25+
import Chakra, {
26+
chakra,
27+
extendTheme,
28+
extendChakra,
29+
CReset,
30+
} from "@chakra-ui/vue-next"
31+
import { mode } from "@chakra-ui/vue-theme-tools"
32+
import { feActivity, feUser } from "feather-icons-paths"
33+
import { h, Fragment, defineComponent } from "vue"
34+
35+
import { domElements } from "@chakra-ui/vue-system"
36+
37+
import { MotionPlugin } from "@vueuse/motion"
38+
import "./env"
39+
40+
// Augment the Cypress namespace to include type definitions for
41+
// your custom command.
42+
// Alternatively, can be defined in cypress/support/component.d.ts
43+
// with a <reference path="./component" /> at the top of your spec.
44+
declare global {
45+
namespace Cypress {
46+
interface Chainable {
47+
mount: typeof mount
48+
checkA11y: () => Chainable
49+
}
50+
}
51+
}
52+
53+
const chakraOptions = extendChakra({
54+
cssReset: true,
55+
icons: {
56+
library: {
57+
feActivity,
58+
feUser,
59+
},
60+
},
61+
extendTheme: extendTheme({}),
62+
})
63+
64+
// @ts-ignore
65+
Cypress.Commands.add("mount", (component, options = {}) => {
66+
options.global = options.global || {}
67+
options.global.plugins = options.global.plugins || []
68+
options.global.components = options.global.components || {}
69+
options.global.plugins.push({
70+
install(app) {
71+
app.use(MotionPlugin)
72+
app.use(Chakra, chakraOptions)
73+
},
74+
})
75+
76+
domElements.forEach((tag) => {
77+
// @ts-ignore
78+
options.global.components[`chakra?.${tag}`] = chakra(tag)
79+
})
80+
81+
// <component> is a built-in component that comes with Vue
82+
// @ts-ignore
83+
return mount(component, options)
84+
})
85+
86+
// Example use:
87+
// cy.mount(MyComponent)

‎tests/env.ts renamed to ‎cypress/support/env.ts

File renamed without changes.

‎tests/index.d.ts renamed to ‎cypress/support/index.d.ts

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,4 @@
11
/// <reference types="cypress" />
2-
/// <reference types="local-cypress" />
3-
/// <reference types="cypress-plugin-tab" />
42

53
import { ChakraProps, HTMLChakraProps } from "@chakra-ui/vue-system"
64
import { mount } from "@cypress/vue"

‎package.json

Lines changed: 5 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -27,11 +27,12 @@
2727
"playground:dev": "cross-env NODE_ENV=development vite serve playground --config ./vite.config.ts --open",
2828
"preplaygound:build": "node ./scripts/dev.js",
2929
"playground:build": "yarn install && yarn build && cross-env NODE_ENV=production vite build playground --config ./vite.config.ts",
30-
"cy:open": "cypress open-ct",
31-
"cy:run": "cypress run-ct --quiet",
30+
"cy:open": "cypress open",
31+
"cy:run": "cypress run --component --quiet",
3232
"test:component": "yarn cy:run",
3333
"test": "jest",
34-
"test:ci": "cross-env NODE_ENV=test jest --verbose --silent --config jest.config.js",
34+
"test:silent": "cross-env NODE_ENV=test jest --verbose --silent --config jest.config.js",
35+
"test:ci": "yarn test:silent && yarn cy:run",
3536
"test:unit": "cross-env NODE_ENV=test jest --config jest.config.js",
3637
"lint": "eslint '*/**/*.{js,ts,tsx}' --quiet --fix",
3738
"docs:dev:legacy": "vitepress dev docs",
@@ -65,7 +66,6 @@
6566
"@commitlint/cli": "^11.0.0",
6667
"@commitlint/config-conventional": "^11.0.0",
6768
"@ctrl/tinycolor": "^3.4.1",
68-
"@cypress/snapshot": "^2.1.7",
6969
"@cypress/vite-dev-server": "^1.2.6",
7070
"@cypress/vue": "^3.0.3",
7171
"@emotion/css": "^11.7.1",
@@ -121,9 +121,7 @@
121121
"cross-env": "^7.0.2",
122122
"css-get-unit": "^1.0.1",
123123
"csstype": "^3.0.5",
124-
"cypress": "^7.2.0",
125-
"cypress-commands": "^1.1.0",
126-
"cypress-plugin-tab": "^1.0.5",
124+
"cypress": "10.9.0",
127125
"dequal": "^2.0.2",
128126
"dom-focus-lock": "^1.0.4",
129127
"esbuild": "0.13.4",
@@ -149,7 +147,6 @@
149147
"jest-transform-stub": "^2.0.0",
150148
"lerna": "^3.22.1",
151149
"lint-staged": "^10.5.3",
152-
"local-cypress": "^1.2.1",
153150
"lodash.camelcase": "^4.3.0",
154151
"lodash.kebabcase": "^4.1.1",
155152
"lodash.mergewith": "^4.6.2",

0 commit comments

Comments
 (0)