mirror of
https://gitee.com/element-plus/element-plus.git
synced 2024-12-02 03:08:21 +08:00
ci(test): add SSR test framework (#6570)
* test(ci): add ssr test framework - Setup SSR test framework (cypress) * Update cypress configs * Fix format issue * Move cypress tests * Move vite.config.cy.mjs under cypress/
This commit is contained in:
parent
4ad2453124
commit
16f79ede21
51
.github/workflows/cypress.yml
vendored
51
.github/workflows/cypress.yml
vendored
@ -1,51 +0,0 @@
|
||||
name: Cypress E2E testing
|
||||
|
||||
on:
|
||||
workflow_run:
|
||||
workflows: ['Website Preview']
|
||||
types: [completed]
|
||||
|
||||
jobs:
|
||||
cypress-run:
|
||||
name: Cypress Run
|
||||
runs-on: ubuntu-latest
|
||||
container: cypress/browsers:node14.7.0-chrome84
|
||||
steps:
|
||||
- name: Checkout
|
||||
uses: actions/checkout@v3
|
||||
|
||||
- name: Download artifact
|
||||
uses: dawidd6/action-download-artifact@v2
|
||||
with:
|
||||
workflow: ${{ github.event.workflow.id }}
|
||||
run_id: ${{ github.event.workflow_run.id }}
|
||||
name: docs
|
||||
|
||||
- name: Setup pnpm
|
||||
uses: pnpm/action-setup@v2
|
||||
with:
|
||||
version: latest
|
||||
|
||||
- name: Cache ~/.pnpm-store
|
||||
uses: actions/cache@v2
|
||||
env:
|
||||
cache-name: cache-pnpm-store
|
||||
with:
|
||||
path: ~/.pnpm-store
|
||||
key: ${{ runner.os }}-test-${{ env.cache-name }}-${{ hashFiles('**/pnpm-lock.yaml') }}
|
||||
restore-keys: |
|
||||
${{ runner.os }}-test-${{ env.cache-name }}-
|
||||
${{ runner.os }}-test-
|
||||
${{ runner.os }}-
|
||||
|
||||
- name: Install dependencies
|
||||
run: pnpm i --frozen-lockfile
|
||||
|
||||
- name: Install serve
|
||||
run: pnpm install serve -D -w
|
||||
|
||||
- name: Serve documentation site
|
||||
run: pnpm exec serve docs -p 5001 &
|
||||
|
||||
- name: Run Cypress
|
||||
run: npx cypress run
|
@ -1,4 +1,7 @@
|
||||
{
|
||||
"componentFolder": "e2e",
|
||||
"testFiles": "**/*spec.cy.{ts,tsx}",
|
||||
"video": false,
|
||||
"baseUrl": "http://127.0.0.1:5001/en-US/"
|
||||
"supportFile": "./cypress/support/index.js",
|
||||
"pluginFile": "./cypress/plugins/index.js"
|
||||
}
|
||||
|
@ -1,10 +0,0 @@
|
||||
context('ElButton', () => {
|
||||
beforeEach(() => {
|
||||
cy.visit('component/button.html')
|
||||
})
|
||||
|
||||
it('should be able to render button on the screen', () => {
|
||||
cy.screenshot()
|
||||
cy.get('.el-button').should('have.lengthOf', 68)
|
||||
})
|
||||
})
|
@ -11,19 +11,15 @@
|
||||
|
||||
// This function is called when a project is opened or re-opened (e.g. due to
|
||||
// the project's config changing)
|
||||
|
||||
const { startDevServer } = require('@cypress/vite-dev-server')
|
||||
/**
|
||||
* @type {Cypress.PluginConfig}
|
||||
*/
|
||||
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
||||
module.exports = (on, _config) => {
|
||||
on('before:browser:launch', (browser = {}, args) => {
|
||||
if (browser.name === 'chrome') {
|
||||
// ^ make sure this is your browser name, you may
|
||||
// be using 'canary' or 'chromium' for example, so change it to match!
|
||||
args.push('--proxy-bypass-list=<-loopback>')
|
||||
return args
|
||||
}
|
||||
on('dev-server:start', async (options) => {
|
||||
const { default: viteConfig } = await import('../vite.config.cy.mjs')
|
||||
return startDevServer({ options, viteConfig })
|
||||
})
|
||||
// `on` is used to hook into various events Cypress emits
|
||||
// `config` is the resolved Cypress config
|
||||
|
20
cypress/vite.config.cy.mjs
Normal file
20
cypress/vite.config.cy.mjs
Normal file
@ -0,0 +1,20 @@
|
||||
import { defineConfig } from 'vite'
|
||||
import vue from '@vitejs/plugin-vue'
|
||||
import vueJsx from '@vitejs/plugin-vue-jsx'
|
||||
import DefineOptions from 'unplugin-vue-define-options/rollup'
|
||||
import ElementPlus from 'unplugin-element-plus/vite'
|
||||
|
||||
// https://vitejs.dev/config/
|
||||
export default defineConfig({
|
||||
plugins: [
|
||||
vue(),
|
||||
vueJsx(),
|
||||
DefineOptions(),
|
||||
ElementPlus({
|
||||
// options
|
||||
}),
|
||||
],
|
||||
server: {
|
||||
port: 5000,
|
||||
},
|
||||
})
|
14
e2e/button/button.spec.cy.tsx
Normal file
14
e2e/button/button.spec.cy.tsx
Normal file
@ -0,0 +1,14 @@
|
||||
import { mount } from '@cypress/vue'
|
||||
import { ElButton } from 'element-plus'
|
||||
|
||||
const AXIOM = 'rem is the best girl'
|
||||
|
||||
describe('Cypress Button', () => {
|
||||
describe('when initialized', () => {
|
||||
it('render correctly', () => {
|
||||
mount(() => <ElButton>{AXIOM}</ElButton>)
|
||||
|
||||
cy.get('.el-button').should('have.text', AXIOM)
|
||||
})
|
||||
})
|
||||
})
|
@ -83,6 +83,8 @@
|
||||
"@babel/preset-typescript": "^7.16.7",
|
||||
"@commitlint/cli": "^16.2.1",
|
||||
"@commitlint/config-conventional": "^16.2.1",
|
||||
"@cypress/vite-dev-server": "^2.2.2",
|
||||
"@cypress/vue": "^3.1.0",
|
||||
"@element-plus/eslint-config": "workspace:*",
|
||||
"@pnpm/find-workspace-packages": "^3.1.42",
|
||||
"@pnpm/logger": "^4.0.0",
|
||||
@ -134,6 +136,7 @@
|
||||
"ts-morph": "^14.0.0",
|
||||
"type-fest": "^2.12.0",
|
||||
"typescript": "^4.6.2",
|
||||
"unplugin-element-plus": "^0.3.1",
|
||||
"unplugin-vue-define-options": "^0.4.0",
|
||||
"vitest": "^0.5.9",
|
||||
"vue": "^3.2.31",
|
||||
|
@ -12,6 +12,8 @@ importers:
|
||||
'@babel/preset-typescript': ^7.16.7
|
||||
'@commitlint/cli': ^16.2.1
|
||||
'@commitlint/config-conventional': ^16.2.1
|
||||
'@cypress/vite-dev-server': ^2.2.2
|
||||
'@cypress/vue': ^3.1.0
|
||||
'@element-plus/components': workspace:*
|
||||
'@element-plus/constants': workspace:*
|
||||
'@element-plus/directives': workspace:*
|
||||
@ -83,6 +85,7 @@ importers:
|
||||
ts-morph: ^14.0.0
|
||||
type-fest: ^2.12.0
|
||||
typescript: ^4.6.2
|
||||
unplugin-element-plus: ^0.3.1
|
||||
unplugin-vue-define-options: ^0.4.0
|
||||
vitest: ^0.5.9
|
||||
vue: ^3.2.31
|
||||
@ -116,6 +119,8 @@ importers:
|
||||
'@babel/preset-typescript': 7.16.7_@babel+core@7.17.5
|
||||
'@commitlint/cli': 16.2.1
|
||||
'@commitlint/config-conventional': 16.2.1
|
||||
'@cypress/vite-dev-server': 2.2.2
|
||||
'@cypress/vue': 3.1.0_cypress@8.5.0+vue@3.2.31
|
||||
'@element-plus/eslint-config': link:internal/eslint-config
|
||||
'@pnpm/find-workspace-packages': 3.1.42_@pnpm+logger@4.0.0
|
||||
'@pnpm/logger': 4.0.0
|
||||
@ -167,6 +172,7 @@ importers:
|
||||
ts-morph: 14.0.0
|
||||
type-fest: 2.12.0
|
||||
typescript: 4.6.2
|
||||
unplugin-element-plus: 0.3.1_c30e5c6c929d1f3c3b17cbac52c918c0
|
||||
unplugin-vue-define-options: 0.4.0_c30e5c6c929d1f3c3b17cbac52c918c0
|
||||
vitest: 0.5.9_0806f0693d07c4237ca3c20ba5503180
|
||||
vue: 3.2.31
|
||||
@ -1866,6 +1872,10 @@ packages:
|
||||
engines: {node: '>=10'}
|
||||
dev: false
|
||||
|
||||
/@cypress/mount-utils/1.0.2:
|
||||
resolution: {integrity: sha512-Fn3fdTiyayHoy8Ol0RSu4MlBH2maQ2ZEXeEVKl/zHHXEQpld5HX3vdNLhK5YLij8cLynA4DxOT/nO9iEnIiOXw==}
|
||||
dev: true
|
||||
|
||||
/@cypress/request/2.88.10:
|
||||
resolution: {integrity: sha512-Zp7F+R93N0yZyG34GutyTNr+okam7s/Fzc1+i3kcqOP8vk6OuajuE9qZJ6Rs+10/1JFtXFYMdyarnU1rZuJesg==}
|
||||
engines: {node: '>= 6'}
|
||||
@ -1890,6 +1900,37 @@ packages:
|
||||
uuid: 8.3.2
|
||||
dev: true
|
||||
|
||||
/@cypress/vite-dev-server/2.2.2:
|
||||
resolution: {integrity: sha512-02y/Fm0N+CQjKbSjjRtktPgPbp91kOvtc8+WW2l2odIYQkKlG6IOCpmgc898muW0lBAcCszdEIHR/ItdZDiYPw==}
|
||||
peerDependencies:
|
||||
vite: '>= 2.1.3'
|
||||
dependencies:
|
||||
debug: 4.3.3
|
||||
get-port: 5.1.1
|
||||
transitivePeerDependencies:
|
||||
- supports-color
|
||||
dev: true
|
||||
|
||||
/@cypress/vue/3.1.0_cypress@8.5.0+vue@3.2.31:
|
||||
resolution: {integrity: sha512-E2aFQtPvLLW9yKZz7t94VN1SuO53Jx9wN12gi7pvpHId5E6p+8Z+v2zlzzREpA8Gbi2QGNMwK8ciSYcwZG2bXg==}
|
||||
engines: {node: '>=8'}
|
||||
peerDependencies:
|
||||
'@cypress/webpack-dev-server': '*'
|
||||
babel-loader: '*'
|
||||
cypress: '>=7.0.0'
|
||||
vue: '>=3.0.0'
|
||||
peerDependenciesMeta:
|
||||
'@cypress/webpack-dev-server':
|
||||
optional: true
|
||||
babel-loader:
|
||||
optional: true
|
||||
dependencies:
|
||||
'@cypress/mount-utils': 1.0.2
|
||||
'@vue/test-utils': 2.0.0-rc.16_vue@3.2.31
|
||||
cypress: 8.5.0
|
||||
vue: 3.2.31
|
||||
dev: true
|
||||
|
||||
/@cypress/xvfb/1.2.4:
|
||||
resolution: {integrity: sha512-skbBzPggOVYCbnGgV+0dmBdW/s77ZkAOXIC1knS8NagwDjBrNC1LuXtQJeiN6l+m7lzmHtaoUw/ctJKdqkG57Q==}
|
||||
dependencies:
|
||||
@ -6855,6 +6896,11 @@ packages:
|
||||
engines: {node: '>=8.0.0'}
|
||||
dev: true
|
||||
|
||||
/get-port/5.1.1:
|
||||
resolution: {integrity: sha512-g/Q1aTSDOxFpchXC4i8ZWvxA1lnPqx/JHqcpIw0/LX9T8x/GBbi6YnlN5nhaKIFkT8oFsscUKgDJYxfwfS6QsQ==}
|
||||
engines: {node: '>=8'}
|
||||
dev: true
|
||||
|
||||
/get-source/2.0.12:
|
||||
resolution: {integrity: sha512-X5+4+iD+HoSeEED+uwrQ07BOQr0kEDFMVqqpBuI+RaZBpBpHCuXxo70bjar6f0b0u/DQJsJ7ssurpP0V60Az+w==}
|
||||
dependencies:
|
||||
@ -12022,6 +12068,24 @@ packages:
|
||||
engines: {node: '>= 10.0.0'}
|
||||
dev: true
|
||||
|
||||
/unplugin-element-plus/0.3.1_c30e5c6c929d1f3c3b17cbac52c918c0:
|
||||
resolution: {integrity: sha512-DowQB5yvyJ/89q45o9LELGiRFYIGo5AJZqEBsjVJOVHL0x3OY57XB5BTLxUd5Of3wPk646MvADKY3htJvopy9w==}
|
||||
engines: {node: '>=14'}
|
||||
peerDependencies:
|
||||
vue: '3'
|
||||
dependencies:
|
||||
'@rollup/pluginutils': 4.1.2
|
||||
es-module-lexer: 0.9.3
|
||||
magic-string: 0.25.7
|
||||
unplugin: 0.3.2_esbuild@0.14.25+rollup@2.69.2
|
||||
vue: 3.2.31
|
||||
transitivePeerDependencies:
|
||||
- esbuild
|
||||
- rollup
|
||||
- vite
|
||||
- webpack
|
||||
dev: true
|
||||
|
||||
/unplugin-icons/0.13.2_d1ceb6729d992b8502afaf839b1d9fb4:
|
||||
resolution: {integrity: sha512-Dwfn5DkKrp/BpZV0R/2wgU39j+kjkeuIQ54PmJ9LhXNpNAS+Huf6Fl/PUmUrlWOvMAz0uPo3y/5lQKZUBjBkBQ==}
|
||||
peerDependencies:
|
||||
|
Loading…
Reference in New Issue
Block a user