Skip to content

Commit 16c7efb

Browse files
chriskariOliwiaGoworIwonaLanger
authored
feat: migrate UI5 vitest unit tests to cypress component tests (#3551)
* cypress config for component testing * first tests migration * migrated badge tests * migrated generic list * migrated counting card * migrated copiable text * migrated namespace settings * migrated ui5radial chart * migrated podrestarts * migrated errorboundary * migrated pagination * migrated listactions * migrated resourcenotfound * migrated modalwithform * migrated helmreleases * migrated selector * migrated ResourceLink * migrated controlledby * mocked ui5 dependencies in nodeQueries test * migrated JoinedArray * migrated CodeViewer * mocked ui5 dependencies in useCreateResource test * mocked ui5 dependencies in useGetCRDByPath * migrated Columns * migrated Widget * mocked ui5 dependencies in linkExtractor * migrated SecretData * migrated SideDrawer * migrated ResourceDetailsColumns * migrated ResourceDetailsVisibility * fixed issues in tests * migrated Table * mocked ui5 dependencies in Widget.copyable * fixed useGet test * refined vitest * adjust github actions workflow * adjust github actions workflow * added command for headless component tests * add cypress as dev dependency * fixed genericList test * adjusted testing-strategy.md * Update docs/contributor/testing-strategy.md Co-authored-by: Iwona Langer <iwona.langer@sap.com> --------- Co-authored-by: Oliwia Gowor <72342415+OliwiaGowor@users.noreply.github.com> Co-authored-by: Iwona Langer <iwona.langer@sap.com>
1 parent eb90c63 commit 16c7efb

File tree

77 files changed

+3840
-2633
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

77 files changed

+3840
-2633
lines changed

‎.github/workflows/pull-unit-tests.yml‎

Lines changed: 17 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,24 +1,27 @@
1-
name: PR Unit Tests
1+
name: PR Unit and Component Tests
22

3-
on:
3+
on:
44
pull_request:
55
types: [opened, edited, synchronize, reopened, ready_for_review]
66
paths:
7-
- ".github/workflows/pull-unit-tests.yml"
8-
- "public/**"
9-
- "src/**"
10-
- "package.json"
7+
- '.github/workflows/pull-unit-tests.yml'
8+
- 'public/**'
9+
- 'src/**'
10+
- 'backend/**'
11+
- 'package.json'
12+
- 'cypress/support/**'
13+
- 'cypress.config.component.ts'
1114

1215
jobs:
13-
run-unit-test:
16+
run-unit-and-component-test:
1417
runs-on: ubuntu-latest
1518
if: github.event.pull_request.draft == false
1619
steps:
1720
- uses: gardenlinux/workflow-telemetry-action@v2
1821
with:
1922
comment_on_pr: false
2023
- uses: actions/checkout@v4
21-
- uses: ./.github/actions/rebase
24+
#- uses: ./.github/actions/rebase # TODO UNCOMMENT BEFORE FEATURE BRANCH MERGE!
2225
- uses: actions/setup-node@v4
2326
with:
2427
node-version: 20
@@ -27,7 +30,11 @@ jobs:
2730
run: |
2831
set -e
2932
npm ci
30-
- name: run_tests
33+
- name: run_unit_tests
3134
shell: bash
32-
run: |
35+
run: |
3336
npm run test
37+
- name: run_component_tests
38+
shell: bash
39+
run: |
40+
npm run component-test-headless

‎cypress.config.component.ts‎

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
import { defineConfig } from 'cypress';
2+
3+
export default defineConfig({
4+
component: {
5+
screenshotOnRunFailure: false,
6+
includeShadowDom: true,
7+
devServer: {
8+
framework: 'react',
9+
bundler: 'vite',
10+
},
11+
specPattern: 'src/**/*.cy.{js,jsx,ts,tsx}',
12+
supportFile: 'cypress/support/component.jsx',
13+
},
14+
});

‎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.jsx‎

Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
/* global Cypress */
2+
import React from 'react';
3+
import { mount } from 'cypress/react18';
4+
import { ThemeProvider } from '@ui5/webcomponents-react';
5+
import { MemoryRouter } from 'react-router-dom';
6+
import { RecoilRoot } from 'recoil';
7+
8+
import i18n from 'i18next';
9+
import { initReactI18next } from 'react-i18next';
10+
import { I18nextProvider } from 'react-i18next';
11+
12+
i18n.use(initReactI18next).init({
13+
lng: 'en',
14+
fallbackLng: false,
15+
nsSeparator: '::',
16+
defaultNS: 'translation',
17+
saveMissing: true,
18+
interpolation: {
19+
escapeValue: false,
20+
},
21+
});
22+
23+
Cypress.Commands.add(
24+
'mount',
25+
(component, { initializeRecoil, ...options } = {}) => {
26+
return mount(
27+
<RecoilRoot initializeState={initializeRecoil}>
28+
<I18nextProvider i18n={i18n}>
29+
<MemoryRouter>
30+
<ThemeProvider>{component}</ThemeProvider>
31+
</MemoryRouter>
32+
</I18nextProvider>
33+
</RecoilRoot>,
34+
options,
35+
);
36+
},
37+
);

‎docs/contributor/testing-strategy.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ Each pull request (PR) to the repository triggers CI/CD jobs that verify the Bus
1212
- `PR Kyma Dashboard Smoke Tests Prod / run-smoke-test-prod` - Performs smoke testing for Busola with PROD environement and configuration related to the Kyma functionalities using a k3d cluster with installed Kyma.
1313
- `PR Lighthouse Test / run-lighthouse-test` - Performs performance testing for Busola - threshold for accessibility: 80, best-practices: 100.
1414
- `PR Lint Check / run-lint-check` - Performing ESlint and Prettier code quality.
15-
- `PR Unit Tests / run-unit-test` - Performs unit tests of the Busola.
15+
- `PR Unit and Component Tests / run-unit-and-component-test` - Performs unit tests and component tests of Busola.
1616
- `Lint Markdown Links PR / markdown-link-check` - Checks links in documentation.
1717
- `CodeQL / Analyze (javascript)` - Code quality static code check.
1818

0 commit comments

Comments
 (0)