From 388fdee0b10bb5efdc48dbf444b2526c40032d70 Mon Sep 17 00:00:00 2001 From: Oliwia Gowor Date: Tue, 3 Dec 2024 09:34:14 +0100 Subject: [PATCH 01/20] fix: adjust tests --- src/hooks/useAvailableNamespaces.ts | 6 +++++- tests/integration/support/commands.js | 10 +++++----- tests/integration/support/inspect-list.js | 2 +- .../tests/cluster/test-cluster-configuration.spec.js | 4 ++-- .../tests/cluster/test-cluster-overview.spec.js | 10 +++++++--- .../tests/cluster/test-cluster-role-bindings.spec.js | 3 ++- .../tests/cluster/test-dashboard-version.spec.js | 4 ++-- .../cluster/test-multiple-context-kubeconfig.spec.js | 10 ++++++++-- .../tests/cluster/test-navigation-features.spec.js | 8 ++++---- tests/integration/tests/namespace/a-run-before.spec.js | 3 +-- .../tests/namespace/test-resource-validation.spec.js | 6 +++--- 11 files changed, 40 insertions(+), 26 deletions(-) diff --git a/src/hooks/useAvailableNamespaces.ts b/src/hooks/useAvailableNamespaces.ts index 288426131f..117e4803ea 100644 --- a/src/hooks/useAvailableNamespaces.ts +++ b/src/hooks/useAvailableNamespaces.ts @@ -37,7 +37,10 @@ export function useAvailableNamespaces() { if (showHiddenNamespaces) return true; return !hiddenNamespaces.includes(n); }); - if (filteredNamespaces) { + if ( + filteredNamespaces && + JSON.stringify(filteredNamespaces) !== JSON.stringify(namespaces) + ) { setNamespaces(filteredNamespaces); } }, [ @@ -46,6 +49,7 @@ export function useAvailableNamespaces() { hiddenNamespaces, setNamespaces, showHiddenNamespaces, + namespaces, ]); return { namespaces, refetch, silentRefetch, setNamespaces }; diff --git a/tests/integration/support/commands.js b/tests/integration/support/commands.js index 04b0410e65..2952ea1a1d 100644 --- a/tests/integration/support/commands.js +++ b/tests/integration/support/commands.js @@ -43,14 +43,14 @@ Cypress.Commands.add( Cypress.Commands.add('checkItemOnGenericListLink', resourceName => { cy.get('ui5-table-row') .find('ui5-table-cell') - .contains('span', resourceName) + .contains('ui5-text', resourceName) .should('be.visible'); }); Cypress.Commands.add('clickGenericListLink', resourceName => { cy.get('ui5-table-row') .find('ui5-table-cell') - .contains('span', resourceName) + .contains('ui5-text', resourceName) .click(); }); @@ -177,8 +177,8 @@ Cypress.Commands.add( cy.wait(1000); if (selectSearchResult) { - cy.get('ui5-li-suggestion-item:visible') - .contains(resourceName) + cy.get('ui5-suggestion-item:visible') + .contains('li', resourceName) .click(); } @@ -233,7 +233,7 @@ Cypress.Commands.add( cy.get('ui5-table-row') .find('ui5-table-cell') - .contains('span', resourceName) + .contains('ui5-text', resourceName) .should('not.be.visible'); cy.getMidColumn() diff --git a/tests/integration/support/inspect-list.js b/tests/integration/support/inspect-list.js index d93e116688..5cb3d7a890 100644 --- a/tests/integration/support/inspect-list.js +++ b/tests/integration/support/inspect-list.js @@ -6,5 +6,5 @@ Cypress.Commands.add('inspectList', (resourceName, hiddenButtons = false) => { .wait(1000) .type(`${resourceName}{enter}`); - cy.contains('span', resourceName).should('be.visible'); + cy.contains('ui5-text', resourceName).should('be.visible'); }); diff --git a/tests/integration/tests/cluster/test-cluster-configuration.spec.js b/tests/integration/tests/cluster/test-cluster-configuration.spec.js index 8b74b75f6c..b8e148fba6 100644 --- a/tests/integration/tests/cluster/test-cluster-configuration.spec.js +++ b/tests/integration/tests/cluster/test-cluster-configuration.spec.js @@ -65,7 +65,7 @@ context('Test Cluster configuration', () => { cy.get('[title="Profile"]').click(); - cy.get('ui5-menu-li:visible') + cy.get('ui5-menu-item:visible') .contains('Preferences') .click({ force: true }); @@ -77,7 +77,7 @@ context('Test Cluster configuration', () => { .contains('20') .click(); - cy.get('ui5-list:visible') + cy.get('ui5-option:visible') .contains('10') .click(); diff --git a/tests/integration/tests/cluster/test-cluster-overview.spec.js b/tests/integration/tests/cluster/test-cluster-overview.spec.js index ce3efbf2f8..d35ffb90ee 100644 --- a/tests/integration/tests/cluster/test-cluster-overview.spec.js +++ b/tests/integration/tests/cluster/test-cluster-overview.spec.js @@ -52,7 +52,7 @@ context('Test Cluster Overview', () => { .get('.radial-chart') .contains('text.progress-label', '50%') .get('.radial-chart') - .contains('span.additional-info', 'test1233456'); + .contains('ui5-text.additional-info', 'test1233456'); // test injected statistical card exists and works cy.contains( @@ -93,13 +93,17 @@ context('Test Cluster Overview', () => { cy.loginAndSelectCluster(); - cy.get('[name="feedback"]').should('exist'); + cy.get('ui5-shellbar') + .find('[name="feedback"]') + .should('exist'); cy.setBusolaFeature('FEEDBACK', false); cy.loginAndSelectCluster(); - cy.get('[name="feedback"]').should('not.exist'); + cy.get('ui5-shellbar') + .find('[name="feedback"]') + .should('not.exist'); }); it('Go to Node details', () => { diff --git a/tests/integration/tests/cluster/test-cluster-role-bindings.spec.js b/tests/integration/tests/cluster/test-cluster-role-bindings.spec.js index e61cb35aee..261125961d 100644 --- a/tests/integration/tests/cluster/test-cluster-role-bindings.spec.js +++ b/tests/integration/tests/cluster/test-cluster-role-bindings.spec.js @@ -71,7 +71,7 @@ context('Test Cluster Role Bindings', () => { cy.contains('[role="combobox"]', 'User').click(); - cy.get('ui5-li:visible') + cy.get('ui5-option:visible') .contains('ServiceAccount') .find('li') .click({ force: true }); @@ -96,6 +96,7 @@ context('Test Cluster Role Bindings', () => { cy.inspectTab('View'); cy.getMidColumn() + .find('ui5-table-cell') .contains('Group') .should('be.visible'); diff --git a/tests/integration/tests/cluster/test-dashboard-version.spec.js b/tests/integration/tests/cluster/test-dashboard-version.spec.js index 2b64b0da8d..4426e09b76 100644 --- a/tests/integration/tests/cluster/test-dashboard-version.spec.js +++ b/tests/integration/tests/cluster/test-dashboard-version.spec.js @@ -10,8 +10,8 @@ context('Test Kyma Dashboard Version link', () => { it('Check Kyma Dashboard Version link', () => { cy.get('[title="Profile"]').click(); - cy.get('.ui5-menu-rp') - .find('ui5-menu-li:visible') + cy.get('ui5-menu') + .find('ui5-menu-item:visible') .contains('Legal Information') .click({ force: true }); diff --git a/tests/integration/tests/cluster/test-multiple-context-kubeconfig.spec.js b/tests/integration/tests/cluster/test-multiple-context-kubeconfig.spec.js index 59c7598eae..97dbcabe21 100644 --- a/tests/integration/tests/cluster/test-multiple-context-kubeconfig.spec.js +++ b/tests/integration/tests/cluster/test-multiple-context-kubeconfig.spec.js @@ -64,21 +64,27 @@ context('Test multiple context kubeconfig', () => { .contains(kubeconfig['current-context']) .click(); - cy.get('ui5-li:visible').contains(kubeconfig.contexts[1].name); + cy.get('ui5-option:visible').contains(kubeconfig.contexts[1].name); - cy.get('ui5-li:visible') + cy.wait(3000); + + cy.get('ui5-option:visible') .contains('All contexts') .click(); + cy.wait(3000); cy.contains('Next').click({ force: true }); + cy.wait(3000); cy.get('ui5-button:visible') .contains('Next step') .click(); + cy.wait(3000); cy.get(`[accessible-name="last-step"]:visible`) .contains('Connect cluster') .click({ force: true }); + cy.wait(3000); cy.contains('Cluster Details').should('exist'); diff --git a/tests/integration/tests/cluster/test-navigation-features.spec.js b/tests/integration/tests/cluster/test-navigation-features.spec.js index 2c869ba928..cd0a2c276b 100644 --- a/tests/integration/tests/cluster/test-navigation-features.spec.js +++ b/tests/integration/tests/cluster/test-navigation-features.spec.js @@ -36,12 +36,12 @@ context('Test navigation features', () => { .wait(1000) .type('cronjob-controller'); - cy.get('ui5-li-suggestion-item:visible') - .contains('cronjob-controller') + cy.get('ui5-suggestion-item:visible') + .contains('li', /cronjob-controller/) .click(); - cy.contains('cronjob-controller (SA)') // link wrapper - .contains('cronjob-controller') // link itself + cy.contains('ui5-table-cell', 'cronjob-controller (SA)') + .find('ui5-link') // link itself .click(); cy.contains('disabled').should('exist'); diff --git a/tests/integration/tests/namespace/a-run-before.spec.js b/tests/integration/tests/namespace/a-run-before.spec.js index 0a299bf1b3..64ac992939 100644 --- a/tests/integration/tests/namespace/a-run-before.spec.js +++ b/tests/integration/tests/namespace/a-run-before.spec.js @@ -27,10 +27,9 @@ context('Create Namespace', () => { .find('ui5-icon[accessible-name="Select Options"]') .click(); - cy.get('ui5-static-area') + cy.get('ui5-responsive-popover') .find('ui5-li:visible') .contains('XL (limits: 9Gi, requests: 8.4Gi)') - .find('li[role="listitem"]') .click({ force: true }); cy.get('.create-form') diff --git a/tests/integration/tests/namespace/test-resource-validation.spec.js b/tests/integration/tests/namespace/test-resource-validation.spec.js index 2f166a0cce..14b5ce7344 100644 --- a/tests/integration/tests/namespace/test-resource-validation.spec.js +++ b/tests/integration/tests/namespace/test-resource-validation.spec.js @@ -41,7 +41,7 @@ context('Test resource validation', () => { it('Disables resource validation via preferences', () => { cy.get('[title="Profile"]').click(); - cy.get('ui5-menu-li:visible') + cy.get('ui5-menu-item:visible') .contains('Preferences') .click({ force: true }); @@ -80,7 +80,7 @@ context('Test resource validation', () => { it('Customize resource validation policies via preferences', () => { cy.get('[title="Profile"]').click(); - cy.get('ui5-menu-li:visible') + cy.get('ui5-menu-item:visible') .contains('Preferences') .click({ force: true }); @@ -136,7 +136,7 @@ context('Test resource validation', () => { cy.get('[title="Profile"]').click(); - cy.get('ui5-menu-li:visible') + cy.get('ui5-menu-item:visible') .contains('Preferences') .click({ force: true }); From e00236628ad6997df75a0d2d4dc57c9c7a8f8bff Mon Sep 17 00:00:00 2001 From: Oliwia Gowor Date: Tue, 3 Dec 2024 11:27:49 +0100 Subject: [PATCH 02/20] fix: icon in labels & commandPalette with modal --- src/command-pallette/CommandPaletteProvider.tsx | 2 +- src/shared/components/Labels/Labels.js | 2 ++ 2 files changed, 3 insertions(+), 1 deletion(-) diff --git a/src/command-pallette/CommandPaletteProvider.tsx b/src/command-pallette/CommandPaletteProvider.tsx index a641c65d9b..0202056e3d 100644 --- a/src/command-pallette/CommandPaletteProvider.tsx +++ b/src/command-pallette/CommandPaletteProvider.tsx @@ -16,7 +16,7 @@ export const CommandPaletteProvider = ({ >(); const setShowDialog = (value: boolean) => { - const modalPresent = document.querySelector('ui5-dialog[open="true"]'); + const modalPresent = document.querySelector('ui5-dialog[open]'); // disable opening palette if other modal is present if (!modalPresent || !value) { _setShowDialog(value); diff --git a/src/shared/components/Labels/Labels.js b/src/shared/components/Labels/Labels.js index 62e2a14319..00f87cbecc 100644 --- a/src/shared/components/Labels/Labels.js +++ b/src/shared/components/Labels/Labels.js @@ -14,6 +14,7 @@ export const Labels = ({ style = null, displayLabelForLabels = false, disableMarginBottom = false, + hideIcon = true, }) => { const { t } = useTranslation(); if (!labels || Object.keys(labels).length === 0) { @@ -54,6 +55,7 @@ export const Labels = ({ className={`sap-margin-end-tiny ${ disableMarginBottom ? '' : 'sap-margin-bottom-tiny' }`} + hideStateIcon={hideIcon} > {shortenLongLabels && label.length > SHORTENING_TRESHOLD ? shortenLabel(label) From 87a516f34c498713af3af4903afd37173013e2d9 Mon Sep 17 00:00:00 2001 From: Oliwia Gowor Date: Tue, 3 Dec 2024 13:51:23 +0100 Subject: [PATCH 03/20] fix: adjust tests --- tests/integration/tests/cluster/test-cluster-overview.spec.js | 3 ++- tests/integration/tests/cluster/test-custom-resources.spec.js | 4 ++-- .../integration/tests/cluster/test-dashboard-version.spec.js | 3 +-- tests/integration/tests/namespace/test-jobs.spec.js | 2 +- .../integration/tests/namespace/test-service-accounts.spec.js | 3 ++- 5 files changed, 8 insertions(+), 7 deletions(-) diff --git a/tests/integration/tests/cluster/test-cluster-overview.spec.js b/tests/integration/tests/cluster/test-cluster-overview.spec.js index d35ffb90ee..3feaec4e5a 100644 --- a/tests/integration/tests/cluster/test-cluster-overview.spec.js +++ b/tests/integration/tests/cluster/test-cluster-overview.spec.js @@ -62,7 +62,8 @@ context('Test Cluster Overview', () => { .find('ui5-link.counting-card__link') .click(); - cy.get('ui5-title') + cy.get('ui5-dynamic-page-title') + .find('ui5-title') .contains('Hpatest') .should('be.visible'); diff --git a/tests/integration/tests/cluster/test-custom-resources.spec.js b/tests/integration/tests/cluster/test-custom-resources.spec.js index d41e03cdea..e933556be7 100644 --- a/tests/integration/tests/cluster/test-custom-resources.spec.js +++ b/tests/integration/tests/cluster/test-custom-resources.spec.js @@ -113,7 +113,7 @@ context('Test Custom Resources', () => { cy.getMidColumn() .get('ui5-table-row') .find('ui5-table-cell') - .contains('span', 'tcluster-test') + .contains('ui5-text', 'tcluster-test') .click(); cy.testEndColumnLayout('tcluster-test', false); @@ -121,7 +121,7 @@ context('Test Custom Resources', () => { cy.getMidColumn() .get('ui5-table-row') .find('ui5-table-cell') - .contains('span', 'tcluster-test') + .contains('ui5-text', 'tcluster-test') .click(); cy.getMidColumn() diff --git a/tests/integration/tests/cluster/test-dashboard-version.spec.js b/tests/integration/tests/cluster/test-dashboard-version.spec.js index 4426e09b76..3dfef5b58d 100644 --- a/tests/integration/tests/cluster/test-dashboard-version.spec.js +++ b/tests/integration/tests/cluster/test-dashboard-version.spec.js @@ -15,8 +15,7 @@ context('Test Kyma Dashboard Version link', () => { .contains('Legal Information') .click({ force: true }); - cy.get('ui5-responsive-popover[placement-type="Right"]') - .find('ui5-menu-li:visible') + cy.get('li:visible') .contains('Kyma Dashboard version:') .should('be.visible'); }); diff --git a/tests/integration/tests/namespace/test-jobs.spec.js b/tests/integration/tests/namespace/test-jobs.spec.js index 28815fd957..9af8d088a1 100644 --- a/tests/integration/tests/namespace/test-jobs.spec.js +++ b/tests/integration/tests/namespace/test-jobs.spec.js @@ -100,7 +100,7 @@ context('Test Jobs', () => { .find('ui5-panel') .find('ui5-table-row') .find('ui5-table-cell') - .contains('span', JOB_NAME) + .contains('ui5-text', JOB_NAME) .click(); cy.wait(1000); diff --git a/tests/integration/tests/namespace/test-service-accounts.spec.js b/tests/integration/tests/namespace/test-service-accounts.spec.js index 1c52b32948..16866d3ed1 100644 --- a/tests/integration/tests/namespace/test-service-accounts.spec.js +++ b/tests/integration/tests/namespace/test-service-accounts.spec.js @@ -107,11 +107,12 @@ context('Test Service Accounts', () => { .contains('ui5-button', 'Generate TokenRequest') .click(); + cy.contains('TokenRequest generated').should('be.visible'); + cy.contains( 'The TokenRequest allows you to log in with your ServiceAccount credentials.', ).should('be.visible'); - cy.contains('TokenRequest generated').should('be.visible'); cy.readFile(filepath).should('not.exist'); //check if TokenRequest is being generated after value change From c8d66724c58b7fa5967bdae5c3f12af9a550b30b Mon Sep 17 00:00:00 2001 From: Oliwia Gowor Date: Tue, 3 Dec 2024 15:12:16 +0100 Subject: [PATCH 04/20] fix: useGet --- src/hooks/useAvailableNamespaces.ts | 2 +- src/shared/hooks/BackendAPI/useGet.js | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/hooks/useAvailableNamespaces.ts b/src/hooks/useAvailableNamespaces.ts index 117e4803ea..56137fb337 100644 --- a/src/hooks/useAvailableNamespaces.ts +++ b/src/hooks/useAvailableNamespaces.ts @@ -14,9 +14,9 @@ export function useAvailableNamespaces() { const { data: allNamespaces, error, refetch, silentRefetch } = useGetList()( '/api/v1/namespaces', { - skip: false, pollingInterval: 3000, onDataReceived: () => {}, + skip: false, }, ) as { loading: boolean; diff --git a/src/shared/hooks/BackendAPI/useGet.js b/src/shared/hooks/BackendAPI/useGet.js index 24ac8eb4b5..b39181cff4 100644 --- a/src/shared/hooks/BackendAPI/useGet.js +++ b/src/shared/hooks/BackendAPI/useGet.js @@ -14,7 +14,7 @@ const ERROR_TOLERANCY = 2; const useGetHook = processDataFn => function( path, - { pollingInterval, onDataReceived, skip, errorTolerancy = undefined } = {}, + { pollingInterval, onDataReceived, skip, errorTolerancy } = {}, ) { const authData = useRecoilValue(authDataState); const lastAuthData = useRef(null); From 4e6dab28838f0fd40f0fc14095828f0ef729cc71 Mon Sep 17 00:00:00 2001 From: Oliwia Gowor Date: Wed, 4 Dec 2024 11:18:58 +0100 Subject: [PATCH 05/20] fix: adjust more tests --- tests/integration/support/commands.js | 2 +- .../tests/accessibility/test-acc-performance.spec.js | 2 +- .../tests/cluster/test-navigation-features.spec.js | 4 +++- .../tests/extensibility/ext-test-extensibility.spec.js | 8 ++++---- .../tests/namespace/test-protected-resources.spec.js | 2 +- tests/integration/tests/namespace/test-settings.spec.js | 8 ++++---- 6 files changed, 14 insertions(+), 12 deletions(-) diff --git a/tests/integration/support/commands.js b/tests/integration/support/commands.js index 2952ea1a1d..cc1a72361f 100644 --- a/tests/integration/support/commands.js +++ b/tests/integration/support/commands.js @@ -255,7 +255,7 @@ Cypress.Commands.add( cy.get('ui5-table-row') .find('ui5-table-cell') - .contains('span', resourceName) + .contains('ui5-text', resourceName) .should('not.be.visible'); cy.getEndColumn() diff --git a/tests/integration/tests/accessibility/test-acc-performance.spec.js b/tests/integration/tests/accessibility/test-acc-performance.spec.js index b224db89e8..1bae637c99 100644 --- a/tests/integration/tests/accessibility/test-acc-performance.spec.js +++ b/tests/integration/tests/accessibility/test-acc-performance.spec.js @@ -13,7 +13,7 @@ context('Accessibility test Cluster list and overview', () => { it('Acc test with performance panel open', () => { cy.get('[title="Profile"]').click(); - cy.get('ui5-menu-li:visible') + cy.get('ui5-menu-item:visible') .contains('Preferences') .click({ force: true }); diff --git a/tests/integration/tests/cluster/test-navigation-features.spec.js b/tests/integration/tests/cluster/test-navigation-features.spec.js index cd0a2c276b..a896601bb0 100644 --- a/tests/integration/tests/cluster/test-navigation-features.spec.js +++ b/tests/integration/tests/cluster/test-navigation-features.spec.js @@ -40,7 +40,9 @@ context('Test navigation features', () => { .contains('li', /cronjob-controller/) .click(); - cy.contains('ui5-table-cell', 'cronjob-controller (SA)') + cy.wait(1000); + + cy.contains('div', 'cronjob-controller (SA)') .find('ui5-link') // link itself .click(); diff --git a/tests/integration/tests/extensibility/ext-test-extensibility.spec.js b/tests/integration/tests/extensibility/ext-test-extensibility.spec.js index 1ae9f6efc4..27e4ab057d 100644 --- a/tests/integration/tests/extensibility/ext-test-extensibility.spec.js +++ b/tests/integration/tests/extensibility/ext-test-extensibility.spec.js @@ -95,8 +95,8 @@ context('Test Extensibility Create/Update', () => { .wait(1000) .clear() .type(EXTENSION_NAME) - .get('ui5-li-suggestion-item:visible') - .contains(EXTENSION_NAME) + .get('ui5-suggestion-item:visible') + .contains('li', EXTENSION_NAME) .click(); cy.get('ui5-table-row') @@ -123,8 +123,8 @@ context('Test Extensibility Create/Update', () => { .wait(1000) .clear() .type(EXTENSION_NAME) - .get('ui5-li-suggestion-item:visible') - .contains(EXTENSION_NAME) + .get('ui5-suggestion-item:visible') + .contains('li', EXTENSION_NAME) .click(); cy.clickGenericListLink(EXTENSION_NAME); diff --git a/tests/integration/tests/namespace/test-protected-resources.spec.js b/tests/integration/tests/namespace/test-protected-resources.spec.js index 80a669b74f..fa9e092f85 100644 --- a/tests/integration/tests/namespace/test-protected-resources.spec.js +++ b/tests/integration/tests/namespace/test-protected-resources.spec.js @@ -118,7 +118,7 @@ context('Test Protected Resources', () => { it('Change protection setting', () => { cy.get('[title="Profile"]').click(); - cy.get('ui5-menu-li:visible') + cy.get('ui5-menu-item:visible') .contains('Preferences') .click({ force: true }); diff --git a/tests/integration/tests/namespace/test-settings.spec.js b/tests/integration/tests/namespace/test-settings.spec.js index 46bed4327d..826e40e075 100644 --- a/tests/integration/tests/namespace/test-settings.spec.js +++ b/tests/integration/tests/namespace/test-settings.spec.js @@ -11,7 +11,7 @@ context('Test app settings and preferences', () => { it('Deletes without confirmation', () => { cy.get('[title="Profile"]').click(); - cy.get('ui5-menu-li:visible') + cy.get('ui5-menu-item:visible') .contains('Preferences') .click({ force: true }); @@ -52,7 +52,7 @@ context('Test app settings and preferences', () => { // disable "deletion without confirmation" to not mess other tests cy.get('[title="Profile"]').click(); - cy.get('ui5-menu-li:visible') + cy.get('ui5-menu-item:visible') .contains('Preferences') .click({ force: true }); @@ -71,7 +71,7 @@ context('Test app settings and preferences', () => { it('Changes application theme', () => { cy.get('[title="Profile"]').click(); - cy.get('ui5-menu-li:visible') + cy.get('ui5-menu-item:visible') .contains('Preferences') .click({ force: true }); @@ -96,7 +96,7 @@ context('Test app settings and preferences', () => { it('Shows hidden namespaces', () => { cy.get('[title="Profile"]').click(); - cy.get('ui5-menu-li:visible') + cy.get('ui5-menu-item:visible') .contains('Preferences') .click({ force: true }); From 6c25ea3da05e2c5e4ab495e1037fd9e56c5d3d5b Mon Sep 17 00:00:00 2001 From: Oliwia Gowor Date: Wed, 4 Dec 2024 11:44:18 +0100 Subject: [PATCH 06/20] chore: check chrome version --- .github/workflows/pull-integration-cluster-k3d.yml | 6 ------ .github/workflows/pull-integration-namespace-k3d.yml | 6 ------ 2 files changed, 12 deletions(-) diff --git a/.github/workflows/pull-integration-cluster-k3d.yml b/.github/workflows/pull-integration-cluster-k3d.yml index 4f0a815833..54535e08c4 100644 --- a/.github/workflows/pull-integration-cluster-k3d.yml +++ b/.github/workflows/pull-integration-cluster-k3d.yml @@ -14,12 +14,6 @@ jobs: run-cluster-test: runs-on: ubuntu-latest 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 index 08e74dbd50..7d944a5fbe 100644 --- a/.github/workflows/pull-integration-namespace-k3d.yml +++ b/.github/workflows/pull-integration-namespace-k3d.yml @@ -14,12 +14,6 @@ jobs: run-namespace-test: runs-on: ubuntu-latest 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 From 43c406a1871c7185e3bfeaca74f65ca5f63d9a3c Mon Sep 17 00:00:00 2001 From: Oliwia Gowor Date: Wed, 4 Dec 2024 13:08:02 +0100 Subject: [PATCH 07/20] fix: maximum update depth --- src/hooks/useAvailableNamespaces.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/hooks/useAvailableNamespaces.ts b/src/hooks/useAvailableNamespaces.ts index 56137fb337..eca0865cd1 100644 --- a/src/hooks/useAvailableNamespaces.ts +++ b/src/hooks/useAvailableNamespaces.ts @@ -27,7 +27,7 @@ export function useAvailableNamespaces() { }; useEffect(() => { - if (error) { + if (error && Array.isArray(namespaces) && namespaces.length !== 0) { setNamespaces([]); return; } From 0845cfee6535d5794c7ca77c39b18f1211754515 Mon Sep 17 00:00:00 2001 From: Oliwia Gowor Date: Wed, 4 Dec 2024 13:33:06 +0100 Subject: [PATCH 08/20] fix: adjust kyma tests --- tests/integration/tests/kyma-cluster/test-kyma-modules.spec.js | 3 ++- tests/integration/tests/kyma-namespace/a-run-before.spec.js | 3 +-- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/tests/integration/tests/kyma-cluster/test-kyma-modules.spec.js b/tests/integration/tests/kyma-cluster/test-kyma-modules.spec.js index 660dc26b65..8b80bfea76 100644 --- a/tests/integration/tests/kyma-cluster/test-kyma-modules.spec.js +++ b/tests/integration/tests/kyma-cluster/test-kyma-modules.spec.js @@ -33,7 +33,8 @@ context('Test Kyma Modules views', () => { it('Test adding Modules', () => { cy.get('ui5-table') - .find('ui5-illustrated-message[title-text="No modules"]') + .find('ui5-illustrated-message') + .find('ui5-title', 'No modules') .should('be.visible'); cy.get('div[data-component-name="DynamicPageHeader"]') diff --git a/tests/integration/tests/kyma-namespace/a-run-before.spec.js b/tests/integration/tests/kyma-namespace/a-run-before.spec.js index 0a299bf1b3..64ac992939 100644 --- a/tests/integration/tests/kyma-namespace/a-run-before.spec.js +++ b/tests/integration/tests/kyma-namespace/a-run-before.spec.js @@ -27,10 +27,9 @@ context('Create Namespace', () => { .find('ui5-icon[accessible-name="Select Options"]') .click(); - cy.get('ui5-static-area') + cy.get('ui5-responsive-popover') .find('ui5-li:visible') .contains('XL (limits: 9Gi, requests: 8.4Gi)') - .find('li[role="listitem"]') .click({ force: true }); cy.get('.create-form') From 8e4f423bd8435474b81df91345af22d35817a1b1 Mon Sep 17 00:00:00 2001 From: Oliwia Gowor Date: Wed, 4 Dec 2024 14:14:16 +0100 Subject: [PATCH 09/20] fix: modules test --- .../integration/tests/kyma-cluster/test-kyma-modules.spec.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/tests/integration/tests/kyma-cluster/test-kyma-modules.spec.js b/tests/integration/tests/kyma-cluster/test-kyma-modules.spec.js index 8b80bfea76..c5d63ab2d4 100644 --- a/tests/integration/tests/kyma-cluster/test-kyma-modules.spec.js +++ b/tests/integration/tests/kyma-cluster/test-kyma-modules.spec.js @@ -37,11 +37,11 @@ context('Test Kyma Modules views', () => { .find('ui5-title', 'No modules') .should('be.visible'); - cy.get('div[data-component-name="DynamicPageHeader"]') + cy.get('div[data-component-name="ObjectPageHeaderContainer"]') .contains('Release channel') .should('be.visible'); - cy.get('div[data-component-name="DynamicPageHeader"]') + cy.get('div[data-component-name="ObjectPageHeaderContainer"]') .contains('regular') .should('be.visible'); From 7ad557b814a880aa87a1c2328593046c79d37fbb Mon Sep 17 00:00:00 2001 From: Oliwia Gowor Date: Wed, 4 Dec 2024 14:31:04 +0100 Subject: [PATCH 10/20] fix: modules tests --- .../integration/tests/kyma-cluster/test-kyma-modules.spec.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/tests/integration/tests/kyma-cluster/test-kyma-modules.spec.js b/tests/integration/tests/kyma-cluster/test-kyma-modules.spec.js index c5d63ab2d4..d9005740bb 100644 --- a/tests/integration/tests/kyma-cluster/test-kyma-modules.spec.js +++ b/tests/integration/tests/kyma-cluster/test-kyma-modules.spec.js @@ -166,7 +166,7 @@ context('Test Kyma Modules views', () => { cy.wait(500); - cy.get('ui5-li:visible') + cy.get('ui5-option:visible') .contains(/^Fast .*/) .click(); @@ -211,7 +211,7 @@ context('Test Kyma Modules views', () => { .find('ui5-select') .click(); - cy.get('ui5-li:visible') + cy.get('ui5-option:visible') .contains(/Predefined .*/) .filter(':visible') .find('li') From a9399c6db49d485334d6295a6255f5fc91874af8 Mon Sep 17 00:00:00 2001 From: Oliwia Gowor Date: Thu, 5 Dec 2024 14:45:36 +0100 Subject: [PATCH 11/20] fix: fix create & nav --- .../tests/accessibility/test-acc-custom-resoureces.spec.js | 2 +- .../tests/cluster/test-custom-resources.spec.js | 2 +- .../tests/cluster/test-navigation-features.spec.js | 7 +++++-- .../tests/cluster/test-persistent-volumes.spec.js | 4 ++-- .../integration/tests/cluster/test-storage-classes.spec.js | 2 +- 5 files changed, 10 insertions(+), 7 deletions(-) diff --git a/tests/integration/tests/accessibility/test-acc-custom-resoureces.spec.js b/tests/integration/tests/accessibility/test-acc-custom-resoureces.spec.js index 3d440e60d8..9cc11c5225 100644 --- a/tests/integration/tests/accessibility/test-acc-custom-resoureces.spec.js +++ b/tests/integration/tests/accessibility/test-acc-custom-resoureces.spec.js @@ -15,7 +15,7 @@ context('Accessibility test Custom Resources', () => { cy.navigateTo('Configuration', 'Custom Resource Definitions'); - cy.openCreate().click(); + cy.openCreate(); cy.wrap(loadFile(FILE_NAME)).then(CRD_CONFIG => { const CRD = JSON.stringify(CRD_CONFIG); diff --git a/tests/integration/tests/cluster/test-custom-resources.spec.js b/tests/integration/tests/cluster/test-custom-resources.spec.js index e933556be7..774871fde4 100644 --- a/tests/integration/tests/cluster/test-custom-resources.spec.js +++ b/tests/integration/tests/cluster/test-custom-resources.spec.js @@ -19,7 +19,7 @@ context('Test Custom Resources', () => { cy.navigateTo('Configuration', 'Custom Resource Definitions'); - cy.openCreate().click(); + cy.openCreate(); cy.wrap(loadFile(FILE_NAME)).then(CRD_CONFIG => { const CRD = JSON.stringify(CRD_CONFIG); diff --git a/tests/integration/tests/cluster/test-navigation-features.spec.js b/tests/integration/tests/cluster/test-navigation-features.spec.js index a896601bb0..d7b1f988a5 100644 --- a/tests/integration/tests/cluster/test-navigation-features.spec.js +++ b/tests/integration/tests/cluster/test-navigation-features.spec.js @@ -42,8 +42,11 @@ context('Test navigation features', () => { cy.wait(1000); - cy.contains('div', 'cronjob-controller (SA)') - .find('ui5-link') // link itself + cy.contains('ui5-text', 'system:controller:cronjob-controller').click(); + + cy.getMidColumn() + .contains('ui5-Panel', 'Subjects') + .contains('ui5-link', 'cronjob-controller') .click(); cy.contains('disabled').should('exist'); diff --git a/tests/integration/tests/cluster/test-persistent-volumes.spec.js b/tests/integration/tests/cluster/test-persistent-volumes.spec.js index 53684e49d8..a872177be8 100644 --- a/tests/integration/tests/cluster/test-persistent-volumes.spec.js +++ b/tests/integration/tests/cluster/test-persistent-volumes.spec.js @@ -28,7 +28,7 @@ context('Test Persistent Volumes', () => { it('Create PV with NFS', () => { cy.navigateTo('Storage', 'Persistent Volumes'); - cy.openCreate().click(); + cy.openCreate(); cy.wrap(loadPV(PV_NFS_NAME, 'test-persistent-volume-NFS.yaml')).then( PV_CONFIG => { @@ -83,7 +83,7 @@ context('Test Persistent Volumes', () => { }); it('Create PV with CSI', () => { - cy.openCreate().click(); + cy.openCreate(); cy.wrap(loadPV(PV_CSI_NAME, 'test-persistent-volume-CSI.yaml')).then( PV_CONFIG => { diff --git a/tests/integration/tests/cluster/test-storage-classes.spec.js b/tests/integration/tests/cluster/test-storage-classes.spec.js index c341af0c0e..8db71fa929 100644 --- a/tests/integration/tests/cluster/test-storage-classes.spec.js +++ b/tests/integration/tests/cluster/test-storage-classes.spec.js @@ -20,7 +20,7 @@ context('Test Storage Classes', () => { it('Create Storage Class', () => { cy.navigateTo('Storage', 'Storage Classes'); - cy.openCreate().click(); + cy.openCreate(); cy.wrap(loadSC(Cypress.env('STORAGE_CLASS_NAME'))).then(SC_CONFIG => { const SC = JSON.stringify(SC_CONFIG); From 20d8ad77d92e1b9448e7163b8246c74af4c4a00d Mon Sep 17 00:00:00 2001 From: Oliwia Gowor Date: Fri, 6 Dec 2024 08:13:15 +0100 Subject: [PATCH 12/20] fix: try partial ObjectPage fix --- .../components/DynamicPageComponent/DynamicPageComponent.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/shared/components/DynamicPageComponent/DynamicPageComponent.js b/src/shared/components/DynamicPageComponent/DynamicPageComponent.js index ded9f98537..6cbca9dedf 100644 --- a/src/shared/components/DynamicPageComponent/DynamicPageComponent.js +++ b/src/shared/components/DynamicPageComponent/DynamicPageComponent.js @@ -352,7 +352,7 @@ export const DynamicPageComponent = ({ titleArea={headerTitle} headerArea={customHeaderContent ?? headerContent} selectedSectionId={selectedSectionIdState} - onBeforeNavigate={e => { + onSelectedSectionChange={e => { if (isFormOpen.formOpen) { e.preventDefault(); } @@ -363,14 +363,14 @@ export const DynamicPageComponent = ({ isFormOpen, setIsFormOpen, () => { - setSelectedSectionIdState(e.detail.sectionId); + setSelectedSectionIdState(e.detail.selectedSectionId); setIsResourceEdited({ isEdited: false, }); }, ); - if (e.detail.sectionId === 'edit') { + if (e.detail.selectedSectionId === 'edit') { setIsFormOpen({ formOpen: true }); } }} From 208ff591534f5135bed3a727dfbd8c7c3175d8f2 Mon Sep 17 00:00:00 2001 From: Oliwia Gowor Date: Fri, 6 Dec 2024 08:52:18 +0100 Subject: [PATCH 13/20] fix: remove [] for update depth error --- src/header/NamespaceChooser/NamespaceChooser.tsx | 2 +- src/header/NamespaceDropdown/NamespaceDropdown.tsx | 4 ++-- src/hooks/useAvailableNamespaces.ts | 4 ++-- .../components/DynamicPageComponent/DynamicPageComponent.js | 6 +++--- src/state/namespacesAtom.ts | 4 ++-- 5 files changed, 10 insertions(+), 10 deletions(-) diff --git a/src/header/NamespaceChooser/NamespaceChooser.tsx b/src/header/NamespaceChooser/NamespaceChooser.tsx index a4168a9e1f..7f9851dbc0 100644 --- a/src/header/NamespaceChooser/NamespaceChooser.tsx +++ b/src/header/NamespaceChooser/NamespaceChooser.tsx @@ -42,7 +42,7 @@ export function NamespaceChooser() { />, ]; - allNamespaces.map(ns => + allNamespaces?.map(ns => namespaces.push( 0) { + if (allNamespaces && allNamespaces.length > 0) { namespaces.push( + allNamespaces?.map(ns => namespaces.push(), ); diff --git a/src/hooks/useAvailableNamespaces.ts b/src/hooks/useAvailableNamespaces.ts index eca0865cd1..3b206827a8 100644 --- a/src/hooks/useAvailableNamespaces.ts +++ b/src/hooks/useAvailableNamespaces.ts @@ -27,8 +27,8 @@ export function useAvailableNamespaces() { }; useEffect(() => { - if (error && Array.isArray(namespaces) && namespaces.length !== 0) { - setNamespaces([]); + if (error) { + setNamespaces(null); return; } const filteredNamespaces = allNamespaces diff --git a/src/shared/components/DynamicPageComponent/DynamicPageComponent.js b/src/shared/components/DynamicPageComponent/DynamicPageComponent.js index 6cbca9dedf..ded9f98537 100644 --- a/src/shared/components/DynamicPageComponent/DynamicPageComponent.js +++ b/src/shared/components/DynamicPageComponent/DynamicPageComponent.js @@ -352,7 +352,7 @@ export const DynamicPageComponent = ({ titleArea={headerTitle} headerArea={customHeaderContent ?? headerContent} selectedSectionId={selectedSectionIdState} - onSelectedSectionChange={e => { + onBeforeNavigate={e => { if (isFormOpen.formOpen) { e.preventDefault(); } @@ -363,14 +363,14 @@ export const DynamicPageComponent = ({ isFormOpen, setIsFormOpen, () => { - setSelectedSectionIdState(e.detail.selectedSectionId); + setSelectedSectionIdState(e.detail.sectionId); setIsResourceEdited({ isEdited: false, }); }, ); - if (e.detail.selectedSectionId === 'edit') { + if (e.detail.sectionId === 'edit') { setIsFormOpen({ formOpen: true }); } }} diff --git a/src/state/namespacesAtom.ts b/src/state/namespacesAtom.ts index bf94bf69d3..c03fd3b363 100644 --- a/src/state/namespacesAtom.ts +++ b/src/state/namespacesAtom.ts @@ -1,8 +1,8 @@ import { atom, RecoilState } from 'recoil'; -export type NamespacesState = string[]; +export type NamespacesState = string[] | null; -const defaultValue: string[] = []; +const defaultValue = null; export const namespacesState: RecoilState = atom< NamespacesState From 48a4846ebac8fa48fd3f6f41bda8792af5d51d01 Mon Sep 17 00:00:00 2001 From: Oliwia Gowor Date: Fri, 13 Dec 2024 10:17:42 +0100 Subject: [PATCH 14/20] fix more tests --- tests/integration/support/commands.js | 1 + tests/integration/tests/cluster/test-command-palette.spec.js | 5 ++--- tests/integration/tests/namespace/test-settings.spec.js | 1 + 3 files changed, 4 insertions(+), 3 deletions(-) diff --git a/tests/integration/support/commands.js b/tests/integration/support/commands.js index cc1a72361f..68578fff0e 100644 --- a/tests/integration/support/commands.js +++ b/tests/integration/support/commands.js @@ -61,6 +61,7 @@ Cypress.Commands.add('filterWithNoValue', { prevSubject: true }, $elements => Cypress.Commands.add('goToNamespaceDetails', () => { // Go to the details of namespace cy.getLeftNav() + .find('ui5-side-navigation-item') .contains('Namespaces') .click(); diff --git a/tests/integration/tests/cluster/test-command-palette.spec.js b/tests/integration/tests/cluster/test-command-palette.spec.js index 9528687ccc..b0881dea1e 100644 --- a/tests/integration/tests/cluster/test-command-palette.spec.js +++ b/tests/integration/tests/cluster/test-command-palette.spec.js @@ -149,9 +149,8 @@ context('Test Command Palette navigation', () => { getQueryInput().type('pref'); // autocomplete - cy.get('body') - .tab() - .type('{enter}', { force: true }); + cy.get('body').tab(); + getQueryInput().type('{enter}', { force: true }); cy.contains('Cluster interaction').should('be.visible'); diff --git a/tests/integration/tests/namespace/test-settings.spec.js b/tests/integration/tests/namespace/test-settings.spec.js index 826e40e075..dda048aa31 100644 --- a/tests/integration/tests/namespace/test-settings.spec.js +++ b/tests/integration/tests/namespace/test-settings.spec.js @@ -123,6 +123,7 @@ context('Test app settings and preferences', () => { .click(); cy.getLeftNav() + .find('ui5-side-navigation-item') .contains('Namespaces') .click(); From 3e3b31d4f6ba7fe6a586479a58ad55e16307af32 Mon Sep 17 00:00:00 2001 From: Oliwia Gowor Date: Fri, 13 Dec 2024 15:32:00 +0100 Subject: [PATCH 15/20] fix: minor bugs & tests adjustments --- .../DynamicPageComponent.js | 176 ++++++++---------- .../components/GenericList/components.js | 2 + .../test-cluster-role-bindings.spec.js | 4 +- .../cluster/test-custom-resources.spec.js | 1 + .../kyma-cluster/test-kyma-modules.spec.js | 4 +- .../namespace/test-namespace-overview.spec.js | 4 +- 6 files changed, 87 insertions(+), 104 deletions(-) diff --git a/src/shared/components/DynamicPageComponent/DynamicPageComponent.js b/src/shared/components/DynamicPageComponent/DynamicPageComponent.js index ded9f98537..3328464404 100644 --- a/src/shared/components/DynamicPageComponent/DynamicPageComponent.js +++ b/src/shared/components/DynamicPageComponent/DynamicPageComponent.js @@ -1,22 +1,20 @@ import PropTypes from 'prop-types'; import { Button, - DynamicPage, FlexBox, - ObjectPage, - ObjectPageHeader, - ObjectPageSection, - ObjectPageTitle, + DynamicPage, DynamicPageHeader, DynamicPageTitle, Title, + TabContainer, + Tab, } from '@ui5/webcomponents-react'; import { Toolbar } from '@ui5/webcomponents-react-compat/dist/components/Toolbar/index.js'; import { ToolbarSpacer } from '@ui5/webcomponents-react-compat/dist/components/ToolbarSpacer/index.js'; import { ToolbarSeparator } from '@ui5/webcomponents-react-compat/dist/components/ToolbarSeparator/index.js'; import './DynamicPageComponent.scss'; -import { useEffect, useRef, useState } from 'react'; +import { useEffect, useState, useRef } from 'react'; import { useTranslation } from 'react-i18next'; import { useRecoilState } from 'recoil'; import { columnLayoutState } from 'state/columnLayoutAtom'; @@ -25,14 +23,21 @@ import { isResourceEditedState } from 'state/resourceEditedAtom'; import { isFormOpenState } from 'state/formOpenAtom'; import { handleActionIfFormOpen } from '../UnsavedMessageBox/helpers'; -const useGetHeaderHeight = dynamicPageRef => { +const useGetHeaderHeight = (dynamicPageRef, tabContainerRef) => { const [headerHeight, setHeaderHeight] = useState(undefined); + const [tabContainerHeight, setTabContainerHeight] = useState(undefined); + useEffect(() => { const headerObserver = new ResizeObserver(([header]) => { setHeaderHeight(header.contentRect.height); }); + + const tabContainerObserver = new ResizeObserver(([tabContainer]) => { + setTabContainerHeight(tabContainer.contentRect.height); + }); + if (dynamicPageRef.current) { - // wait for the custom element to be defined (adjust the tag-name if you're using the scoping feature) + // Wait for the custom element to be defined void customElements.whenDefined('ui5-dynamic-page').then(() => { const shadowRoot = dynamicPageRef.current?.shadowRoot; @@ -40,12 +45,13 @@ const useGetHeaderHeight = dynamicPageRef => { return; } - // wait for the shadowRoot to be populated + // Wait for the shadowRoot to be populated const shadowRootObserver = new MutationObserver(() => { const header = shadowRoot.querySelector('header'); + if (header) { - shadowRootObserver.disconnect(); headerObserver.observe(header); + shadowRootObserver.disconnect(); } }); @@ -53,21 +59,24 @@ const useGetHeaderHeight = dynamicPageRef => { const header = shadowRoot.querySelector('header'); if (header) { headerObserver.observe(header); - } else { - return; } } else if (shadowRoot instanceof Node) { shadowRootObserver.observe(shadowRoot, { childList: true }); - } else { - return; } }); } + + if (tabContainerRef.current) { + tabContainerObserver.observe(tabContainerRef.current); + } + return () => { headerObserver.disconnect(); + tabContainerObserver.disconnect(); }; - }, [dynamicPageRef]); - return headerHeight; + }, [dynamicPageRef, tabContainerRef]); + + return { headerHeight, tabContainerHeight }; }; const Column = ({ title, children, columnSpan, image, style = {} }) => { @@ -110,7 +119,11 @@ export const DynamicPageComponent = ({ const [selectedSectionIdState, setSelectedSectionIdState] = useState('view'); const dynamicPageRef = useRef(null); - const headerHeight = useGetHeaderHeight(dynamicPageRef); + const tabContainerRef = useRef(null); + const { headerHeight, tabContainerHeight } = useGetHeaderHeight( + dynamicPageRef, + tabContainerRef, + ); const handleColumnClose = () => { window.history.pushState( @@ -246,44 +259,13 @@ export const DynamicPageComponent = ({ ); - const headerTitle = inlineEditForm ? ( - - - {title} - - {protectedResource && ( - - {protectedResourceWarning} - - )} - {description && ( - - )} - - } - actionsBar={actionsBar} - /> - ) : ( + const headerTitle = ( - <section className={`column-wrapper ${columnWrapperClassName || ''}`}> - {children} - </section> - </ObjectPageHeader> - ) : ( - <DynamicPageHeader className="header-wrapper"> - <section className={`column-wrapper ${columnWrapperClassName || ''}`}> - {children} - </section> - </DynamicPageHeader> - ) + <DynamicPageHeader className="header-wrapper"> + <section className={`column-wrapper ${columnWrapperClassName || ''}`}> + {children} + </section> + </DynamicPageHeader> ) : null; - const [stickyHeaderHeight, setStickyHeaderHeight] = useState(0); + const handlePageRef = dynamicPage => { + if (dynamicPageRef) { + if (typeof dynamicPageRef === 'function') { + dynamicPageRef(dynamicPage); + } else if (dynamicPageRef.current !== undefined) { + dynamicPageRef.current = dynamicPage; + } + } - useEffect(() => { - setTimeout(() => { - setStickyHeaderHeight( - (document.querySelector('.page-header')?.querySelector('header') - ?.clientHeight ?? 0) + - (document - .querySelector('.page-header') - ?.querySelector('ui5-tabcontainer')?.clientHeight ?? 0), - ); - }); - }, []); + const button = dynamicPage?.shadowRoot?.querySelector( + 'ui5-dynamic-page-header-actions', + ); + if (button) { + button.style['display'] = 'none'; + } + }; if (inlineEditForm) { return ( - <ObjectPage + <DynamicPage mode="IconTabBar" className={`page-header ${className}`} headerPinned @@ -352,7 +329,7 @@ export const DynamicPageComponent = ({ titleArea={headerTitle} headerArea={customHeaderContent ?? headerContent} selectedSectionId={selectedSectionIdState} - onBeforeNavigate={e => { + onSelectedSectionChange={e => { if (isFormOpen.formOpen) { e.preventDefault(); } @@ -363,37 +340,40 @@ export const DynamicPageComponent = ({ isFormOpen, setIsFormOpen, () => { - setSelectedSectionIdState(e.detail.sectionId); + setSelectedSectionIdState(e.detail.selectedSectionId); setIsResourceEdited({ isEdited: false, }); }, ); - if (e.detail.sectionId === 'edit') { + if (e.detail.selectedSectionI === 'edit') { setIsFormOpen({ formOpen: true }); } }} + ref={dynamicPage => handlePageRef(dynamicPage)} > - <ObjectPageSection - aria-label="View" - hideTitleText - id="view" - titleText={t('common.tabs.view')} - > - {content} - </ObjectPageSection> - <ObjectPageSection - aria-label="Edit" - hideTitleText - id="edit" - titleText={ - showYamlTab ? t('common.tabs.yaml') : t('common.tabs.edit') - } + <TabContainer + className="tab-container" + style={{ top: `${headerHeight}px` }} + ref={tabContainerRef} + onTabSelect={event => { + const mode = event.detail.tab.getAttribute('data-mode'); + setSelectedSectionIdState(mode); + }} > - {inlineEditForm(stickyHeaderHeight)} - </ObjectPageSection> - </ObjectPage> + <Tab data-mode="view" text={t('common.tabs.view')}></Tab> + <Tab + data-mode="edit" + text={showYamlTab ? t('common.tabs.yaml') : t('common.tabs.edit')} + ></Tab> + </TabContainer> + + {selectedSectionIdState === 'view' && content} + + {selectedSectionIdState === 'edit' && + inlineEditForm(headerHeight + tabContainerHeight)} + </DynamicPage> ); } @@ -404,7 +384,7 @@ export const DynamicPageComponent = ({ titleArea={headerTitle} headerArea={headerContent} footerArea={footer} - ref={dynamicPageRef} + ref={dynamicPage => handlePageRef(dynamicPage)} > {typeof content === 'function' ? content(headerHeight) : content} </DynamicPage> diff --git a/src/shared/components/GenericList/components.js b/src/shared/components/GenericList/components.js index ee2710614e..200d53dbc3 100644 --- a/src/shared/components/GenericList/components.js +++ b/src/shared/components/GenericList/components.js @@ -45,6 +45,8 @@ export const HeaderRenderer = ({ <TableColumn slot={`${slot}-${index}`} key={typeof h === 'object' ? index : h} + popinDisplay="Block" + demandPopin={h === 'Popin' ? true : false} minWidth={ Array.isArray(noHideFields) && noHideFields.length !== 0 ? noHideFields.find(field => field === h) diff --git a/tests/integration/tests/cluster/test-cluster-role-bindings.spec.js b/tests/integration/tests/cluster/test-cluster-role-bindings.spec.js index 261125961d..eba67e4643 100644 --- a/tests/integration/tests/cluster/test-cluster-role-bindings.spec.js +++ b/tests/integration/tests/cluster/test-cluster-role-bindings.spec.js @@ -52,11 +52,11 @@ context('Test Cluster Role Bindings', () => { cy.clickGenericListLink(CRB_NAME); cy.getMidColumn() - .contains('User') + .contains('ui5-table-cell', 'User') .should('be.visible'); cy.getMidColumn() - .contains(USER_NAME) + .contains('ui5-table-cell', USER_NAME) .should('be.visible'); cy.getMidColumn() diff --git a/tests/integration/tests/cluster/test-custom-resources.spec.js b/tests/integration/tests/cluster/test-custom-resources.spec.js index 774871fde4..c47041385d 100644 --- a/tests/integration/tests/cluster/test-custom-resources.spec.js +++ b/tests/integration/tests/cluster/test-custom-resources.spec.js @@ -92,6 +92,7 @@ context('Test Custom Resources', () => { }); it('Test column layout and remove CRD', () => { + cy.reload(); cy.getLeftNav() .contains('Custom Resources') .click(); diff --git a/tests/integration/tests/kyma-cluster/test-kyma-modules.spec.js b/tests/integration/tests/kyma-cluster/test-kyma-modules.spec.js index d9005740bb..edeb91c4ef 100644 --- a/tests/integration/tests/kyma-cluster/test-kyma-modules.spec.js +++ b/tests/integration/tests/kyma-cluster/test-kyma-modules.spec.js @@ -37,11 +37,11 @@ context('Test Kyma Modules views', () => { .find('ui5-title', 'No modules') .should('be.visible'); - cy.get('div[data-component-name="ObjectPageHeaderContainer"]') + cy.get('div[data-component-name="DynamicPageHeaderContainer"]') .contains('Release channel') .should('be.visible'); - cy.get('div[data-component-name="ObjectPageHeaderContainer"]') + cy.get('div[data-component-name="DynamicPageHeaderContainer"]') .contains('regular') .should('be.visible'); diff --git a/tests/integration/tests/namespace/test-namespace-overview.spec.js b/tests/integration/tests/namespace/test-namespace-overview.spec.js index 2d2f1b4efe..7001aee1fb 100644 --- a/tests/integration/tests/namespace/test-namespace-overview.spec.js +++ b/tests/integration/tests/namespace/test-namespace-overview.spec.js @@ -15,13 +15,13 @@ context( }); it('Check sections of namespace details', () => { - cy.contains('span', LIMIT_NAME) + cy.contains('ui5-text', LIMIT_NAME) .scrollIntoView() .should('be.visible'); cy.contains('Container').should('be.visible'); - cy.contains('span', QUOTA_NAME) + cy.contains('ui5-text', QUOTA_NAME) .scrollIntoView() .should('be.visible'); From 1e467b4151beb495959f37d20af7da6ae79316ea Mon Sep 17 00:00:00 2001 From: Oliwia Gowor <oliwiagowor@gmail.com> Date: Mon, 16 Dec 2024 06:27:33 +0100 Subject: [PATCH 16/20] fix: modules tests --- .../integration/tests/kyma-cluster/test-kyma-modules.spec.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/tests/integration/tests/kyma-cluster/test-kyma-modules.spec.js b/tests/integration/tests/kyma-cluster/test-kyma-modules.spec.js index edeb91c4ef..d1d840bd12 100644 --- a/tests/integration/tests/kyma-cluster/test-kyma-modules.spec.js +++ b/tests/integration/tests/kyma-cluster/test-kyma-modules.spec.js @@ -37,11 +37,11 @@ context('Test Kyma Modules views', () => { .find('ui5-title', 'No modules') .should('be.visible'); - cy.get('div[data-component-name="DynamicPageHeaderContainer"]') + cy.get('ui5-dynamic-page-header') .contains('Release channel') .should('be.visible'); - cy.get('div[data-component-name="DynamicPageHeaderContainer"]') + cy.get('ui5-dynamic-page-header') .contains('regular') .should('be.visible'); From 012d9569b7ebca73b524503b9a3509854389f221 Mon Sep 17 00:00:00 2001 From: Oliwia Gowor <oliwiagowor@gmail.com> Date: Mon, 16 Dec 2024 07:23:15 +0100 Subject: [PATCH 17/20] fix: adjust more tests --- .../integration/tests/kyma-cluster/test-kyma-modules.spec.js | 2 +- tests/integration/tests/kyma-namespace/test-issuers.spec.js | 2 ++ tests/integration/tests/namespace/test-jobs.spec.js | 2 +- .../tests/namespace/test-protected-resources.spec.js | 4 ++-- .../namespace/test-reduced-permissions--configuration.spec.js | 1 + .../tests/namespace/test-reduced-permissions.spec.js | 2 +- 6 files changed, 8 insertions(+), 5 deletions(-) diff --git a/tests/integration/tests/kyma-cluster/test-kyma-modules.spec.js b/tests/integration/tests/kyma-cluster/test-kyma-modules.spec.js index d1d840bd12..cb33f074b9 100644 --- a/tests/integration/tests/kyma-cluster/test-kyma-modules.spec.js +++ b/tests/integration/tests/kyma-cluster/test-kyma-modules.spec.js @@ -261,7 +261,7 @@ context('Test Kyma Modules views', () => { .clear(); cy.get('ui5-table') - .find('ui5-illustrated-message[title-text="No modules"]') + .contains('ui5-illustrated-message', 'No modules') .should('be.visible'); }); }); diff --git a/tests/integration/tests/kyma-namespace/test-issuers.spec.js b/tests/integration/tests/kyma-namespace/test-issuers.spec.js index f73fff479f..6fad1c6be0 100644 --- a/tests/integration/tests/kyma-namespace/test-issuers.spec.js +++ b/tests/integration/tests/kyma-namespace/test-issuers.spec.js @@ -10,6 +10,8 @@ context('Test Issuers', () => { cy.loginAndSelectCluster(); cy.goToNamespaceDetails(); + cy.wait(1000); + cy.navigateTo('Configuration', 'Secrets'); cy.openCreate(); diff --git a/tests/integration/tests/namespace/test-jobs.spec.js b/tests/integration/tests/namespace/test-jobs.spec.js index 9af8d088a1..1f7a906a23 100644 --- a/tests/integration/tests/namespace/test-jobs.spec.js +++ b/tests/integration/tests/namespace/test-jobs.spec.js @@ -149,7 +149,7 @@ context('Test Jobs', () => { cy.contains('After a Job is created, the containers are read-only.'); cy.get('.edit-form') - .get('ui5-button[icon="add"][disabled="true"]') + .get('ui5-button[icon="add"][disabled]') .contains('Add Container') .should('be.visible'); diff --git a/tests/integration/tests/namespace/test-protected-resources.spec.js b/tests/integration/tests/namespace/test-protected-resources.spec.js index fa9e092f85..1b52013167 100644 --- a/tests/integration/tests/namespace/test-protected-resources.spec.js +++ b/tests/integration/tests/namespace/test-protected-resources.spec.js @@ -82,7 +82,7 @@ context('Test Protected Resources', () => { cy.clickGenericListLink(NAME); - cy.get('ui5-button[disabled="true"]') + cy.get('ui5-button[disabled]') .should('contain.text', 'Delete') .should('be.visible'); }); @@ -111,7 +111,7 @@ context('Test Protected Resources', () => { cy.getMidColumn() .contains('ui5-table-row', NAME) - .find('[accessible-name="Delete"][disabled="true"]') + .find('[accessible-name="Delete"][disabled]') .should('exist'); }); diff --git a/tests/integration/tests/namespace/test-reduced-permissions--configuration.spec.js b/tests/integration/tests/namespace/test-reduced-permissions--configuration.spec.js index 286c08186b..181772501b 100644 --- a/tests/integration/tests/namespace/test-reduced-permissions--configuration.spec.js +++ b/tests/integration/tests/namespace/test-reduced-permissions--configuration.spec.js @@ -106,6 +106,7 @@ context('Test reduced permissions 2', () => { .click(); cy.getLeftNav() + .find('ui5-side-navigation-item') .contains('Namespaces') .click(); diff --git a/tests/integration/tests/namespace/test-reduced-permissions.spec.js b/tests/integration/tests/namespace/test-reduced-permissions.spec.js index 3a077443b5..59e6499528 100644 --- a/tests/integration/tests/namespace/test-reduced-permissions.spec.js +++ b/tests/integration/tests/namespace/test-reduced-permissions.spec.js @@ -99,7 +99,7 @@ context('Test reduced permissions', () => { .get('ui5-select:visible') .click(); - cy.get('ui5-li:visible') + cy.get('ui5-option:visible') .contains('ServiceAccount') .find('li') .click({ force: true }); From c82bbf426c69d1dfbbfddcb6d8f6e1103a5f48e4 Mon Sep 17 00:00:00 2001 From: Oliwia Gowor <oliwiagowor@gmail.com> Date: Mon, 16 Dec 2024 10:26:25 +0100 Subject: [PATCH 18/20] fix: adjust issuer and ext tests --- .../tests/extensibility/ext-test-extensibility.spec.js | 1 + tests/integration/tests/kyma-namespace/test-issuers.spec.js | 2 ++ 2 files changed, 3 insertions(+) diff --git a/tests/integration/tests/extensibility/ext-test-extensibility.spec.js b/tests/integration/tests/extensibility/ext-test-extensibility.spec.js index 27e4ab057d..a79af225fd 100644 --- a/tests/integration/tests/extensibility/ext-test-extensibility.spec.js +++ b/tests/integration/tests/extensibility/ext-test-extensibility.spec.js @@ -140,6 +140,7 @@ context('Test Extensibility Create/Update', () => { cy.get('@form') .get('[data-testid="details-view"]') + .findMonaco(monacoCount) .scrollIntoView() .within(() => { cy.pasteToMonaco(input); diff --git a/tests/integration/tests/kyma-namespace/test-issuers.spec.js b/tests/integration/tests/kyma-namespace/test-issuers.spec.js index 6fad1c6be0..bbf5134702 100644 --- a/tests/integration/tests/kyma-namespace/test-issuers.spec.js +++ b/tests/integration/tests/kyma-namespace/test-issuers.spec.js @@ -87,6 +87,8 @@ context('Test Issuers', () => { .find('input') .type('other.server.com{enter}another.server.com', { force: true }); + cy.wait(2000); + cy.saveChanges('Edit'); cy.getMidColumn().inspectTab('View'); }); From 8ff5b9b12e6c0e5f455ce6b771286bfbdd6a5e5a Mon Sep 17 00:00:00 2001 From: Oliwia Gowor <oliwiagowor@gmail.com> Date: Mon, 16 Dec 2024 23:44:50 +0100 Subject: [PATCH 19/20] fix: check kubeconfigID test --- src/state/useAfterInitHook.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/state/useAfterInitHook.ts b/src/state/useAfterInitHook.ts index 96c657c145..275b22c783 100644 --- a/src/state/useAfterInitHook.ts +++ b/src/state/useAfterInitHook.ts @@ -48,7 +48,7 @@ export function useAfterInitHook(handledKubeconfigId: KubeconfigIdHandleState) { } // cluster not yet loaded - if (!cluster === undefined) { + if (cluster === undefined) { return; } From f390c0105dabe8cf33fbdde44ae6fb8a3a823626 Mon Sep 17 00:00:00 2001 From: Oliwia Gowor <oliwiagowor@gmail.com> Date: Fri, 20 Dec 2024 11:51:17 +0100 Subject: [PATCH 20/20] fix: fix more tests & lost with merge --- .../tests/extensibility/ext-test-extensibility.spec.js | 2 +- tests/integration/tests/kyma-namespace/a-run-before.spec.js | 6 +++--- tests/integration/tests/kyma-namespace/test-issuers.spec.js | 6 +++++- tests/integration/tests/namespace/test-jobs.spec.js | 2 +- .../tests/namespace/test-reduced-permissions.spec.js | 6 +----- .../tests/namespace/test-service-accounts.spec.js | 5 ----- 6 files changed, 11 insertions(+), 16 deletions(-) diff --git a/tests/integration/tests/extensibility/ext-test-extensibility.spec.js b/tests/integration/tests/extensibility/ext-test-extensibility.spec.js index a79af225fd..0b73e1aaab 100644 --- a/tests/integration/tests/extensibility/ext-test-extensibility.spec.js +++ b/tests/integration/tests/extensibility/ext-test-extensibility.spec.js @@ -140,7 +140,7 @@ context('Test Extensibility Create/Update', () => { cy.get('@form') .get('[data-testid="details-view"]') - .findMonaco(monacoCount) + .findMonaco() .scrollIntoView() .within(() => { cy.pasteToMonaco(input); diff --git a/tests/integration/tests/kyma-namespace/a-run-before.spec.js b/tests/integration/tests/kyma-namespace/a-run-before.spec.js index 64ac992939..abe952391a 100644 --- a/tests/integration/tests/kyma-namespace/a-run-before.spec.js +++ b/tests/integration/tests/kyma-namespace/a-run-before.spec.js @@ -27,9 +27,9 @@ context('Create Namespace', () => { .find('ui5-icon[accessible-name="Select Options"]') .click(); - cy.get('ui5-responsive-popover') - .find('ui5-li:visible') - .contains('XL (limits: 9Gi, requests: 8.4Gi)') + cy.get('ui5-responsive-popover:visible') + .contains('ui5-li:visible', 'XL (limits: 9Gi, requests: 8.4Gi)') + .find('li') .click({ force: true }); cy.get('.create-form') diff --git a/tests/integration/tests/kyma-namespace/test-issuers.spec.js b/tests/integration/tests/kyma-namespace/test-issuers.spec.js index bbf5134702..e1f8a21e68 100644 --- a/tests/integration/tests/kyma-namespace/test-issuers.spec.js +++ b/tests/integration/tests/kyma-namespace/test-issuers.spec.js @@ -85,7 +85,11 @@ context('Test Issuers', () => { cy.get('[placeholder^="Domain"]:visible') .find('input') - .type('other.server.com{enter}another.server.com', { force: true }); + .type('other.server.com', { force: true }); + + cy.get('[placeholder^="Domain"]:visible') + .find('input') + .type('another.server.com', { force: true }); cy.wait(2000); diff --git a/tests/integration/tests/namespace/test-jobs.spec.js b/tests/integration/tests/namespace/test-jobs.spec.js index 1f7a906a23..376bdaf2bf 100644 --- a/tests/integration/tests/namespace/test-jobs.spec.js +++ b/tests/integration/tests/namespace/test-jobs.spec.js @@ -181,6 +181,6 @@ context('Test Jobs', () => { .contains(/^Jobs/) .click(); - cy.contains('span', JOB_NAME).should('be.visible'); + cy.contains('ui5-text', JOB_NAME).should('be.visible'); }); }); diff --git a/tests/integration/tests/namespace/test-reduced-permissions.spec.js b/tests/integration/tests/namespace/test-reduced-permissions.spec.js index 59e6499528..5f737e358d 100644 --- a/tests/integration/tests/namespace/test-reduced-permissions.spec.js +++ b/tests/integration/tests/namespace/test-reduced-permissions.spec.js @@ -132,6 +132,7 @@ context('Test reduced permissions', () => { it('Download kubeconfig for Service Account', () => { cy.getLeftNav() + .find('ui5-side-navigation-item') .contains('Namespaces') .click(); @@ -144,11 +145,6 @@ context('Test reduced permissions', () => { cy.clickGenericListLink(SA_NAME); cy.getMidColumn() - .find('header') - .find('ui5-toggle-button:visible') - .click(); - - cy.get('[data-component-name="ToolbarOverflowPopoverContent"]') .find('ui5-button[accessible-name="enter-full-screen"]') .click(); diff --git a/tests/integration/tests/namespace/test-service-accounts.spec.js b/tests/integration/tests/namespace/test-service-accounts.spec.js index 16866d3ed1..989e9bcfc2 100644 --- a/tests/integration/tests/namespace/test-service-accounts.spec.js +++ b/tests/integration/tests/namespace/test-service-accounts.spec.js @@ -99,11 +99,6 @@ context('Test Service Accounts', () => { it('Generate TokenRequest', () => { cy.getMidColumn() - .find('header') - .find('ui5-toggle-button:visible') - .click(); - - cy.get('[data-component-name="ToolbarOverflowPopoverContent"]') .contains('ui5-button', 'Generate TokenRequest') .click();