chore: update UI5 from v1 to v2 (#3542)

* chore: UI5 bump packages (#3439) * chore: update packages * chore: bump ui5-react * fix: adjust tests to not use enzyme * chore: fix dependencies * fix: remove unused * fix: remove not existing import * chore: add compatibility package * fix: adjust render, css names and imports (#3440) * fix: change render * fix: adjust css names * fix: change imports for Toolbar * fix: change imports for tables * fix: rename list comp. & badge * fix: fix imports * chore: adjust spacing to classNames (#3442) * change some spacing to new classnames * fix merge * pray to god, that everything is working * pray to god, that everything is working * some spacing and iconEnd for ExternalLink * some spacing and iconEnd for SA token * add no-margin class in index.scss * adjust the rest of the spacing * remove unused impott * fix stupid classNames * adjust separatorLine to tsx and use style prop * review changes * fix: Ui5 codemod adjustments (#3449) * fix: ui5 codemode adjustments * fix: fix imports * fix: fix table imports * fix: fix unused * fix: adjust DynamicPageComponent (#3445) * fix: adjust dynamicPage * fix: separate actionsBar * fix: fix actions behavior * fix: remove unused * fix: fix classNames * fix: fix empty toolbar & move banners * fix: fix dependency * fix: remove spacing file * fix: toast adjustments (#3462) * fix: adjust tokens (#3463) * fix: adjust tokens * fix: adjust spacing * fix: adjust badges (#3464) * fix: adjust badges type names * fix: fix type mappings * fix: remove console.log * fix: adjust headers size (#3467) * fix: add 'size' to headers * fix: add size to headers * fix: defaultProps (#3469) * remove defaultProps and disableEdit prop from resourcelist * Update src/shared/components/ResourcesList/ResourcesList.js Co-authored-by: Oliwia Gowor <[email protected]> --------- Co-authored-by: Oliwia Gowor <[email protected]> * fix: spinner size (#3474) * fix: theme (#3475) * fix: adjust forms (#3473) * fix: fix styling and alerts * fix: fix unsaved message * fix: fix background in add modules * fix: remove unused * fix: passing props * fix: key error * fix: resources in list * fix: adjust Preferences modal (#3476) * fix: adjust Preferences modal * fix: move import * fix: opening preferences menu * fix: list props * fix: props * fix: objectPageHeader styling and modules card (#3487) * fix: Ui5 console errors (#3486) * fix: key errors * fix: fetch error * fix: monaco worker fix * fix: dynamicPage header error * fix: small fixes * fix: review fixes * fix: adjust V1 Tables (#3491) * fix: adjust tables * fix: emptyListComp flickering * fix: adjust reset.css * fix: change logo acc name (#3518) * remove unnecessary css code from reset.css & some minor adjustments (#3524) * fix: Busola is flickering when ObjectPage is opened (#3498) * fix: fix flickering on column layout * fix: remove unused * fix: replace DynamicPage with ObjectPage * fix: fix key error * fix: banner height and remove unused * fix: initial render flicker * fix: change to DynamicPage * hotfix * Replace props spread * hotfix * fix: shadow & unused * fix: shadow & sticky tabs * fix: hide button everywhere --------- Co-authored-by: mrCherry97 <[email protected]> Co-authored-by: akucharska <[email protected]> * fix: selected in lists (#3543) Co-authored-by: Oliwia Gowor <[email protected]> * fix: Fix delete cluster action (#3540) * Fix delete cluster action * fix: Toast is hidden behind Dialogs (#3538) * Revert "Merge branch 'main' into ui5-migrate-v2" This reverts commit 79fb867, reversing changes made to 5b7fd61. * fix: selected in lists (#3539) * fix: toasts in dialogs * fix: adjust Cypress tests (#3553) * fix: adjust tests * fix: adjust more tests * fix: selected in list * comment out rebase action * comment out rebase action v2 * fix: create namespace * fix: adjust comboboxes * fix: adjust tests * fix: add wait * cleanup * chore: add unsafe eval for accessibility tests (#3554) * fix: small leftover bugs (#3555) * fix: small fixes * fix: ProgressIndicator colors * fix: sidebar z-index * fix: acc tests * fix: more acc * 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 <[email protected]> --------- Co-authored-by: Oliwia Gowor <[email protected]> Co-authored-by: Iwona Langer <[email protected]> * fix: theme on initial and refresh (#3565) * fix: combobox (#3588) * fix: Command Palette shouldn't navigate when Form is edited (#3583) * fix: command palette and form + tests * fix: badge test * fix: keyboard navigation * fix: adjust styles (#3595) * fix: open dropdown popover correctly (#3594) * fix: dropdown popover opens correctly * test: added component test for Dropdown component * fix: remove empty selectedKey property * fix: remove unused css & small changes (#3599) * fix: container selector (#3597) * fix: remove unused proprtey from KymaModulesAddModule * fix: remove unnecessary css from FormGroup * fix: @container selector for featurecard * fix: @container selector for ClusterStats * fix: @container selector for rest of the components * fix: small styling fixes * test: adjust viewport for pagination component test * test: fix flakiness for pvc test * fix: change classnames to be less generic * test: adjust unit test workflow (#3609) * fix: UI5 adjust badges (#3619) * fix: adjust badges * fix: add checkBeta back * fix: adjust Web Components to React 18 (#3622) * fix: adjust badges after overriding functionality (#3627) * fix: adjust badges * adjust test * Update docs/contributor/testing-strategy.md Co-authored-by: Grzegorz Karaluch <[email protected]> * fix: undefined in data sources (#3633) * fix: undefined in state * fix: stabilize test * fix: stabilize navigation test * fix: stabilize tests? * move wait for cr test --------- Co-authored-by: Oliwia Gowor <[email protected]> Co-authored-by: Christian Karidas <[email protected]> Co-authored-by: akucharska <[email protected]> Co-authored-by: Oliwia Gowor <[email protected]> Co-authored-by: Agata Kucharska <[email protected]> Co-authored-by: Iwona Langer <[email protected]> Co-authored-by: Damian Badura <[email protected]> Co-authored-by: Grzegorz Karaluch <[email protected]>
kyma-project · Jan 29, 2025 · 86b9ab4 · 86b9ab4
1 parent 79d7b67
commit 86b9ab4
Show file tree

Hide file tree

Showing 333 changed files with 6,344 additions and 5,894 deletions.
diff --git a/.github/workflows/pull-integration-cluster-k3d.yml b/.github/workflows/pull-integration-cluster-k3d.yml
@@ -16,12 +16,6 @@ jobs:
     runs-on: ubuntu-latest
     if: github.event.pull_request.draft == false
     steps:
-      - name: Install Chrome # this step could be removed after https://github.com/cypress-io/cypress/issues/30374 is resolved
-        shell: bash
-        run: |
-          wget --no-verbose -O /tmp/chrome.deb https://dl.google.com/linux/chrome/deb/pool/main/g/google-chrome-stable/google-chrome-stable_127.0.6533.119-1_amd64.deb 
-          sudo apt install --allow-downgrades -y /tmp/chrome.deb 
-          rm /tmp/chrome.deb
       - uses: gardenlinux/workflow-telemetry-action@v2
         with:
           comment_on_pr: false

diff --git a/.github/workflows/pull-integration-namespace-k3d.yml b/.github/workflows/pull-integration-namespace-k3d.yml
@@ -16,12 +16,6 @@ jobs:
     runs-on: ubuntu-latest
     if: github.event.pull_request.draft == false
     steps:
-      - name: Install Chrome
-        shell: bash
-        run: |
-          wget --no-verbose -O /tmp/chrome.deb https://dl.google.com/linux/chrome/deb/pool/main/g/google-chrome-stable/google-chrome-stable_127.0.6533.119-1_amd64.deb 
-          sudo apt install --allow-downgrades -y /tmp/chrome.deb 
-          rm /tmp/chrome.deb
       - uses: gardenlinux/workflow-telemetry-action@v2
         with:
           comment_on_pr: false

diff --git a/.github/workflows/pull-unit-tests.yml b/.github/workflows/pull-unit-tests.yml
@@ -1,16 +1,19 @@
-name: PR Unit Tests
+name: PR Unit and Component Tests
 
-on: 
+on:
   pull_request:
     types: [opened, edited, synchronize, reopened, ready_for_review]
     paths:
-      - ".github/workflows/pull-unit-tests.yml"
-      - "public/**"
-      - "src/**"
-      - "package.json"
+      - '.github/workflows/pull-unit-tests.yml'
+      - 'public/**'
+      - 'src/**'
+      - 'backend/**'
+      - 'package.json'
+      - 'cypress/**'
+      - 'cypress.config.component.ts'
 
 jobs:
-  run-unit-test:
+  run-unit-and-component-test:
     runs-on: ubuntu-latest
     if: github.event.pull_request.draft == false
     steps:
@@ -27,7 +30,11 @@ jobs:
         run: |
           set -e
           npm ci
-      - name: run_tests
+      - name: run_unit_tests
         shell: bash
-        run: |          
+        run: |
           npm run test
+      - name: run_component_tests
+        shell: bash
+        run: |
+          npm run component-test-headless
diff --git a/cypress.config.component.ts b/cypress.config.component.ts
@@ -0,0 +1,14 @@
+import { defineConfig } from 'cypress';
+
+export default defineConfig({
+  component: {
+    screenshotOnRunFailure: false,
+    includeShadowDom: true,
+    devServer: {
+      framework: 'react',
+      bundler: 'vite',
+    },
+    specPattern: 'src/**/*.cy.{js,jsx,ts,tsx}',
+    supportFile: 'cypress/support/component.jsx',
+  },
+});
diff --git a/cypress/support/component-index.html b/cypress/support/component-index.html
@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8" />
+    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+    <meta name="viewport" content="width=device-width,initial-scale=1.0" />
+    <title>Components App</title>
+  </head>
+  <body>
+    <div data-cy-root></div>
+  </body>
+</html>
diff --git a/cypress/support/component.jsx b/cypress/support/component.jsx
@@ -0,0 +1,37 @@
+/* global Cypress */
+import React from 'react';
+import { mount } from 'cypress/react18';
+import { ThemeProvider } from '@ui5/webcomponents-react';
+import { MemoryRouter } from 'react-router-dom';
+import { RecoilRoot } from 'recoil';
+
+import i18n from 'i18next';
+import { initReactI18next } from 'react-i18next';
+import { I18nextProvider } from 'react-i18next';
+
+i18n.use(initReactI18next).init({
+  lng: 'en',
+  fallbackLng: false,
+  nsSeparator: '::',
+  defaultNS: 'translation',
+  saveMissing: true,
+  interpolation: {
+    escapeValue: false,
+  },
+});
+
+Cypress.Commands.add(
+  'mount',
+  (component, { initializeRecoil, ...options } = {}) => {
+    return mount(
+      <RecoilRoot initializeState={initializeRecoil}>
+        <I18nextProvider i18n={i18n}>
+          <MemoryRouter>
+            <ThemeProvider>{component}</ThemeProvider>
+          </MemoryRouter>
+        </I18nextProvider>
+      </RecoilRoot>,
+      options,
+    );
+  },
+);
diff --git a/docs/contributor/testing-strategy.md b/docs/contributor/testing-strategy.md
@@ -12,7 +12,7 @@ Each pull request (PR) to the repository triggers CI/CD jobs that verify the Bus
 - `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.
 - `PR Lighthouse Test / run-lighthouse-test` - Performs performance testing for Busola - threshold for accessibility: 80, best-practices: 100.
 - `PR Lint Check / run-lint-check` - Performing ESlint and Prettier code quality.
-- `PR Unit Tests / run-unit-test` - Performs unit tests of the Busola.
+- `PR Unit and Component Tests / run-unit-and-component-test` - Performs unit and component tests of Busola.
 - `Lint Markdown Links PR / markdown-link-check` - Checks links in documentation.
 - `CodeQL / Analyze (javascript)` - Code quality static code check.