From 63aba38c419b7046b27235f24cc0a26cd705844a Mon Sep 17 00:00:00 2001 From: Lukas Harbarth Date: Thu, 10 Sep 2026 13:59:41 +0200 Subject: [PATCH 1/3] fix(cypress-commands): support Cypress v16 Updates Cypress everywhere else as well. --- cypress.config.ts | 5 +- cypress/support/commands.tsx | 38 +++++++++ examples/vite-ts/cypress.config.ts | 1 - examples/vite-ts/package-lock.json | 18 ++-- examples/vite-ts/package.json | 2 +- package.json | 2 +- packages/cypress-commands/package.json | 2 +- .../AnalyticalTable/AnalyticalTable.cy.tsx | 38 ++++----- .../components/ObjectPage/ObjectPage.cy.tsx | 26 +++--- templates/vite-ts/cypress.config.ts | 1 - templates/vite-ts/package-lock.json | 18 ++-- templates/vite-ts/package.json | 2 +- yarn.lock | 82 +++++++++++++------ 13 files changed, 154 insertions(+), 81 deletions(-) diff --git a/cypress.config.ts b/cypress.config.ts index c830b6718e3..464777f2e93 100644 --- a/cypress.config.ts +++ b/cypress.config.ts @@ -15,10 +15,13 @@ export default defineConfig({ excludeSpecPattern: ['**/e2e/**'], }, includeShadowDom: true, + retries: { + runMode: 1, + openMode: 0, + }, viewportWidth: 1920, viewportHeight: 1080, video: false, screenshotOnRunFailure: false, scrollBehavior: false, - allowCypressEnv: false, }); diff --git a/cypress/support/commands.tsx b/cypress/support/commands.tsx index db241357020..350ec2b2f23 100644 --- a/cypress/support/commands.tsx +++ b/cypress/support/commands.tsx @@ -130,3 +130,41 @@ Cypress.Commands.add('shouldNeverHaveAttribute', { prevSubject: 'element' }, (su }, observerTime); }); }); + +// Cypress 16 counts scrolled-out elements as visible, so `not.be.visible` no longer works here. +/** + * Asserts the subject is present but scrolled/clipped out of its scroll container (geometry only, no occlusion). + * + * @example + * cy.findByText('Off-screen section').should('be.scrolledOutOfView'); + */ +chai.Assertion.addProperty('scrolledOutOfView', function (this: Chai.AssertionStatic) { + const subject = this._obj as JQuery | HTMLElement; + const el = ((subject as JQuery).jquery ? (subject as JQuery)[0] : subject) as HTMLElement; + const win = el.ownerDocument.defaultView!; + + const rect = el.getBoundingClientRect(); + const clip = { top: 0, left: 0, bottom: win.innerHeight, right: win.innerWidth }; + + for (let node = el.parentElement; node; node = node.parentElement) { + const { overflowX, overflowY } = win.getComputedStyle(node); + if (/(auto|scroll|hidden|clip)/.test(`${overflowX} ${overflowY}`)) { + const r = node.getBoundingClientRect(); + clip.top = Math.max(clip.top, r.top); + clip.left = Math.max(clip.left, r.left); + clip.bottom = Math.min(clip.bottom, r.bottom); + clip.right = Math.min(clip.right, r.right); + } + } + + const outOfView = + rect.bottom <= clip.top || rect.top >= clip.bottom || rect.right <= clip.left || rect.left >= clip.right; + + this.assert( + outOfView, + 'expected #{this} to be scrolled/clipped out of its scroll container', + 'expected #{this} not to be scrolled/clipped out of its scroll container', + true, + outOfView, + ); +}); diff --git a/examples/vite-ts/cypress.config.ts b/examples/vite-ts/cypress.config.ts index 968e4d48cdb..26537482016 100644 --- a/examples/vite-ts/cypress.config.ts +++ b/examples/vite-ts/cypress.config.ts @@ -17,5 +17,4 @@ export default defineConfig({ // implement node event listeners here }, }, - allowCypressEnv: false, }); diff --git a/examples/vite-ts/package-lock.json b/examples/vite-ts/package-lock.json index abd15c06131..5bf850fc9c6 100644 --- a/examples/vite-ts/package-lock.json +++ b/examples/vite-ts/package-lock.json @@ -22,7 +22,7 @@ "@types/react-dom": "19.2.7", "@ui5/webcomponents-cypress-commands": "2.26.0", "@vitejs/plugin-react": "6.1.1", - "cypress": "15.21.1", + "cypress": "16.0.0", "eslint": "9.39.5", "eslint-plugin-react-hooks": "7.1.1", "eslint-plugin-react-refresh": "0.5.6", @@ -2168,9 +2168,9 @@ "license": "MIT" }, "node_modules/cypress": { - "version": "15.21.1", - "resolved": "https://registry.npmjs.org/cypress/-/cypress-15.21.1.tgz", - "integrity": "sha512-ogHpHMj0XNlZA5MGzjg8SWHf0eMw9lTwVQRKjpcT1GzNTxNUjwnHA8YCG6nOJ8ThU+XZaUxJgpMYZnJ//8aDaw==", + "version": "16.0.0", + "resolved": "https://registry.npmjs.org/cypress/-/cypress-16.0.0.tgz", + "integrity": "sha512-/H3zsayGwIGboFIiLWaXxy6ADmCdWy5QjjDBZgslCvjIgYAf1DkZerwAM7wXMPSpfpQ4w+lGjFlmwneRBpg27g==", "dev": true, "hasInstallScript": true, "license": "MIT", @@ -2191,7 +2191,7 @@ "cli-table3": "0.6.1", "commander": "^6.2.1", "common-tags": "^1.8.0", - "dayjs": "^1.10.4", + "dayjs": "^1.11.23", "debug": "^4.3.4", "eventemitter2": "6.4.7", "execa": "4.1.0", @@ -2219,7 +2219,7 @@ "cypress": "bin/cypress" }, "engines": { - "node": "^20.1.0 || ^22.0.0 || >=24.0.0" + "node": "^22.0.0 || ^24.0.0 || >=26.0.0" } }, "node_modules/dashdash": { @@ -2236,9 +2236,9 @@ } }, "node_modules/dayjs": { - "version": "1.11.21", - "resolved": "https://registry.npmjs.org/dayjs/-/dayjs-1.11.21.tgz", - "integrity": "sha512-98IT+HOahAisibz/yjKbzuOBwYcjJ7BCLPzARyHiyEBmRz4fatF+KPJszEHXsGYjUG234aH/cOjW1wwTbKUZlA==", + "version": "1.11.23", + "resolved": "https://registry.npmjs.org/dayjs/-/dayjs-1.11.23.tgz", + "integrity": "sha512-QDTCU0M0MxR3hQfnlDJfwekQiaanm1ubOD231u73WBckQ/fsamwRLiE2GBz6D3a/xF1NgfiDLJjXBa1hYOYTtQ==", "dev": true, "license": "MIT" }, diff --git a/examples/vite-ts/package.json b/examples/vite-ts/package.json index 7cb16ef57d0..b47301a175f 100644 --- a/examples/vite-ts/package.json +++ b/examples/vite-ts/package.json @@ -29,7 +29,7 @@ "@types/react-dom": "19.2.7", "@ui5/webcomponents-cypress-commands": "2.26.0", "@vitejs/plugin-react": "6.1.1", - "cypress": "15.21.1", + "cypress": "16.0.0", "eslint": "9.39.5", "eslint-plugin-react-hooks": "7.1.1", "eslint-plugin-react-refresh": "0.5.6", diff --git a/package.json b/package.json index 49de4d64385..c96a39bfc87 100644 --- a/package.json +++ b/package.json @@ -79,7 +79,7 @@ "@vitejs/plugin-react": "6.1.1", "chromatic": "17.8.0", "cssnano": "9.0.2", - "cypress": "15.18.1", + "cypress": "16.0.0", "cypress-real-events": "1.15.0", "dedent": "1.7.2", "documentation": "14.0.3", diff --git a/packages/cypress-commands/package.json b/packages/cypress-commands/package.json index 8f81f9229dd..7ac89ca2723 100644 --- a/packages/cypress-commands/package.json +++ b/packages/cypress-commands/package.json @@ -25,7 +25,7 @@ "peerDependencies": { "@ui5/webcomponents": "~2.26.0", "@ui5/webcomponents-base": "~2.26.0", - "cypress": "^12 || ^13 || ^14 || ^15" + "cypress": "^12 || ^13 || ^14 || ^15 || ^16" }, "peerDependenciesMeta": { "@ui5/webcomponents": { diff --git a/packages/main/src/components/AnalyticalTable/AnalyticalTable.cy.tsx b/packages/main/src/components/AnalyticalTable/AnalyticalTable.cy.tsx index a74f6f76700..a4d0bcc2306 100644 --- a/packages/main/src/components/AnalyticalTable/AnalyticalTable.cy.tsx +++ b/packages/main/src/components/AnalyticalTable/AnalyticalTable.cy.tsx @@ -296,8 +296,8 @@ describe('AnalyticalTable', () => { ); cy.findByRole('grid').should('have.attr', 'data-per-page', '3'); cy.findByText('X').should('be.visible'); - cy.findByText('C').should('not.be.visible'); - cy.get('[data-empty-row]').should('not.be.visible').should('have.length', 1); + cy.findByText('C').should('be.scrolledOutOfView'); + cy.get('[data-empty-row]').should('be.scrolledOutOfView').should('have.length', 1); }, ); [AnalyticalTableVisibleRowCountMode.Auto, AnalyticalTableVisibleRowCountMode.AutoWithEmptyRows].forEach( @@ -312,7 +312,7 @@ describe('AnalyticalTable', () => { ); cy.findByRole('grid').should('have.attr', 'data-per-page', '99'); //rows(99*44) + header(44) = 4400 cy.findByText('Name-98').should('be.visible'); - cy.findByText('Name-99').should('not.be.visible'); + cy.findByText('Name-99').should('be.scrolledOutOfView'); cy.get('[data-empty-row]').should('not.exist'); }, ); @@ -349,7 +349,7 @@ describe('AnalyticalTable', () => { ); cy.findByRole('grid').should('have.attr', 'data-per-page', '3'); cy.findByText('X').should('be.visible'); - cy.findByText('C').should('not.be.visible'); + cy.findByText('C').should('be.scrolledOutOfView'); }, ); @@ -363,7 +363,7 @@ describe('AnalyticalTable', () => { ); cy.findByRole('grid').should('have.attr', 'data-per-page', '15'); cy.findByText('Name-14').should('be.visible'); - cy.findByText('Name-15').should('not.be.visible'); + cy.findByText('Name-15').should('be.scrolledOutOfView'); cy.mount( { ); cy.findByRole('grid').should('have.attr', 'data-per-page', '20'); cy.findByText('Name-19').should('be.visible'); - cy.findByText('Name-20').should('not.be.visible'); + cy.findByText('Name-20').should('be.scrolledOutOfView'); cy.mount( { ); cy.findByRole('grid').should('have.attr', 'data-per-page', '10'); cy.findByText('Name-9').should('be.visible'); - cy.findByText('Name-10').should('not.be.visible'); + cy.findByText('Name-10').should('be.scrolledOutOfView'); cy.findByTitle('Drag to resize') .trigger('mousedown') .trigger('mousemove', { pageY: 742, force: true }) .trigger('mouseup', { pageY: 742 }); cy.findByRole('grid').should('have.attr', 'data-per-page', '15'); cy.findByText('Name-14').should('be.visible'); - cy.findByText('Name-15').should('not.be.visible'); + cy.findByText('Name-15').should('be.scrolledOutOfView'); cy.findByTitle('Drag to resize').realMouseDown(); cy.findByTitle('Drag to resize').realMouseMove(0, -540, { scrollBehavior: false }); cy.get('body').realMouseUp({ position: { x: 100, y: 200 } }); cy.findByRole('grid').should('have.attr', 'data-per-page', '3'); cy.findByText('Name-2').should('be.visible'); - cy.findByText('Name-3').should('not.be.visible'); + cy.findByText('Name-3').should('be.scrolledOutOfView'); }); it('Auto row count: no double vertical scrollbar when horizontally scrollable', () => { @@ -616,10 +616,10 @@ describe('AnalyticalTable', () => { cy.mount(); cy.findByText('A').should('be.visible'); - cy.findByText('28').should('not.be.visible'); + cy.findByText('28').should('be.scrolledOutOfView'); cy.findByText('Click').click(); cy.findByText('28').should('be.visible'); - cy.findByText('A').should('not.be.visible'); + cy.findByText('A').should('be.scrolledOutOfView'); cy.mount(); cy.findByText('Click').click(); @@ -749,7 +749,7 @@ describe('AnalyticalTable', () => { // column filter + select cy.findByText('Name').click(); - cy.get(`[ui5-input][show-clear-icon]`).typeIntoUi5Input('Flowers Mcfarland', { force: true }); + cy.get(`[ui5-input][show-clear-icon]`).typeIntoUi5Input('Flowers Mcfarland', { force: true, delay: 10 }); cy.get('@filter').should('have.callCount', 17); cy.get('@filter').should('have.been.calledWithMatch', { value: 'Flowers Mcfarland', @@ -1804,7 +1804,7 @@ describe('AnalyticalTable', () => { cy.get('[data-empty-row="true"]').should('not.exist'); cy.findByText('Data 10').click(); cy.findByText('Rows: 10').should('be.visible'); - cy.get('[data-empty-row="true"]').should('exist').should('not.be.visible'); + cy.get('[data-empty-row="true"]').should('exist').and('be.scrolledOutOfView'); cy.findByTestId('scrollInput').typeIntoUi5Input('11{enter}', { force: true }); cy.findByText('Rows: 60').should('be.visible'); }); @@ -2666,7 +2666,7 @@ describe('AnalyticalTable', () => { ); cy.wait(300); - cy.findByText('SubComponent 1').should('exist').and('not.be.visible'); + cy.findByText('SubComponent 1').should('exist').and('be.scrolledOutOfView'); cy.findByTitle('Expand Node').should('not.exist'); cy.findByTitle('Collapse Node').should('not.exist'); expectBoundedAndReset(); @@ -2701,15 +2701,15 @@ describe('AnalyticalTable', () => { ); cy.findByText('A').should('be.visible'); cy.findByText('X').should('be.visible'); - cy.findByText('C').should('not.be.visible'); + cy.findByText('C').should('be.scrolledOutOfView'); cy.get('[aria-rowindex="2"] > [aria-colindex="1"] > [title="Expand Node"] > [ui5-button]').click(); cy.findByText('A').should('be.visible'); cy.findByText('X').should('be.visible'); - cy.findByText('C').should('not.be.visible'); + cy.findByText('C').should('be.scrolledOutOfView'); cy.get('[aria-rowindex="3"] > [aria-colindex="1"] > [title="Expand Node"] > [ui5-button]').click(); cy.findByText('A').should('be.visible'); cy.findByText('X').should('be.visible'); - cy.findByText('C').should('not.be.visible'); + cy.findByText('C').should('be.scrolledOutOfView'); if (zoom === '1') { // Cypress' scrollTo('bottom') uses BCR-style coords and doesn't fire onLoadMore reliably under CSS zoom; verified at zoom=1 only cy.get('[data-component-name="AnalyticalTableBody"]').scrollTo('bottom'); @@ -4323,9 +4323,9 @@ describe('AnalyticalTable', () => { cy.mount(); cy.get('[data-empty-row]').should('not.exist'); cy.mount(); - cy.get('[data-empty-row]').should('exist').and('not.be.visible'); + cy.get('[data-empty-row]').should('exist').and('be.scrolledOutOfView'); cy.mount(); - cy.get('[data-empty-row]').should('exist').and('have.length', 5).and('not.be.visible'); + cy.get('[data-empty-row]').should('exist').and('have.length', 5).and('be.scrolledOutOfView'); cy.get('[data-component-name="AnalyticalTableBody"]').scrollTo('bottom'); cy.get('[data-empty-row]').should('exist').and('have.length', 5).and('be.visible'); }); diff --git a/packages/main/src/components/ObjectPage/ObjectPage.cy.tsx b/packages/main/src/components/ObjectPage/ObjectPage.cy.tsx index 9da49b51ece..4b5dee51a4e 100644 --- a/packages/main/src/components/ObjectPage/ObjectPage.cy.tsx +++ b/packages/main/src/components/ObjectPage/ObjectPage.cy.tsx @@ -374,7 +374,7 @@ describe('ObjectPage', () => { ); cy.wait(200); - cy.findByText('Employment').should('not.be.visible'); + cy.findByText('Employment').should('be.scrolledOutOfView'); cy.findByText('Test').should('be.visible'); cy.get('[ui5-tabcontainer]').findUi5TabByText('Employment').realClick(); @@ -420,7 +420,7 @@ describe('ObjectPage', () => { ); cy.wait(100); - cy.findByText('Employment').should('not.be.visible'); + cy.findByText('Employment').should('be.scrolledOutOfView'); cy.findByText('Test').should('be.visible'); cy.findByTestId('footer').should('be.visible'); @@ -631,7 +631,7 @@ describe('ObjectPage', () => { cy.realPress('Enter'); cy.wait(500); cy.findByText('Job Relationship').should('be.visible'); - cy.findByText('Job Information').should('not.be.visible'); + cy.findByText('Job Information').should('be.scrolledOutOfView'); cy.mount( { cy.wait(500); cy.get('[ui5-tabcontainer]').contains('Job Relationship').click({ force: true }); - cy.findByText('Job Information').should('not.be.visible'); + cy.findByText('Job Information').should('be.scrolledOutOfView'); cy.findByText('Job Relationship').should('be.visible'); cy.findByTestId('footer').should('be.visible'); }); @@ -1258,7 +1258,7 @@ describe('ObjectPage', () => { if (mode === ObjectPageMode.IconTabBar) { cy.findByText('Content1').should('not.exist'); } else { - cy.findByText('Content1').should('not.be.visible'); + cy.findByText('Content1').should('be.scrolledOutOfView'); } cy.findByText('Content2').should('be.visible'); cy.get('[ui5-tabcontainer]').findUi5TabByText('test2').should('have.attr', 'aria-selected', 'true'); @@ -1338,7 +1338,7 @@ describe('ObjectPage', () => { ); cy.findByText('employment-job-relationship-content').should('be.visible'); - cy.findByText('Job Information').should('not.be.visible'); + cy.findByText('Job Information').should('be.scrolledOutOfView'); cy.get('[ui5-tabcontainer]').findUi5TabByText('Employment').should('have.attr', 'aria-selected', 'true'); cy.mount( @@ -1349,7 +1349,7 @@ describe('ObjectPage', () => { if (mode === 'IconTabBar') { cy.findByText('test-content').should('not.exist'); } else { - cy.findByText('test-content').should('not.be.visible'); + cy.findByText('test-content').should('be.scrolledOutOfView'); } cy.get('[ui5-tabcontainer]').findUi5TabByText('Personal').should('have.attr', 'aria-selected', 'true'); @@ -1363,7 +1363,7 @@ describe('ObjectPage', () => { if (mode === 'IconTabBar') { cy.findByText('personal-connect-content').should('not.exist'); } else { - cy.findByText('personal-connect-content').should('not.be.visible'); + cy.findByText('personal-connect-content').should('be.scrolledOutOfView'); } cy.get('[ui5-tabcontainer]').findUi5TabByText('Goals').should('have.attr', 'aria-selected', 'true'); @@ -1371,7 +1371,7 @@ describe('ObjectPage', () => { if (mode === 'IconTabBar') { cy.findByText('test-content').should('not.exist'); } else { - cy.findByText('test-content').should('not.be.visible'); + cy.findByText('test-content').should('be.scrolledOutOfView'); } cy.findByText('personal-connect-content').should('be.visible'); cy.get('[ui5-tabcontainer]').findUi5TabByText('Personal').should('have.attr', 'aria-selected', 'true'); @@ -1384,7 +1384,7 @@ describe('ObjectPage', () => { if (mode === 'IconTabBar') { cy.findByText('personal-connect-content').should('not.exist'); } else { - cy.findByText('personal-connect-content').should('not.be.visible'); + cy.findByText('personal-connect-content').should('be.scrolledOutOfView'); } cy.findByText('goals-content').should('be.visible'); cy.get('[ui5-tabcontainer]').findUi5TabByText('Goals').should('have.attr', 'aria-selected', 'true'); @@ -1400,7 +1400,7 @@ describe('ObjectPage', () => { cy.findByText('Select Payment Information').click(); cy.findByText('personal-payment-information-content').should('be.visible'); - cy.findByText('personal-connect-content').should('not.be.visible'); + cy.findByText('personal-connect-content').should('be.scrolledOutOfView'); cy.get('[ui5-tabcontainer]').findUi5TabByText('Personal').should('have.attr', 'aria-selected', 'true'); if (mode !== 'IconTabBar') { cy.get('@change').should('have.callCount', callCount); @@ -1917,7 +1917,7 @@ describe('ObjectPage', () => { cy.findByText('Personal').should('be.visible').parent().should('have.css', 'position', 'static'); cy.findByText('Connect').should('be.visible').parent().should('have.css', 'position', 'sticky'); cy.findByTestId('op').scrollTo(0, 2500); - cy.findByText('Goals').should('not.be.visible'); + cy.findByText('Goals').should('be.scrolledOutOfView'); cy.findByText('Payment Information').should('be.visible'); cy.get('[ui5-tabcontainer]').findUi5TabByText('Custom Header Section One').click(); cy.findByText('Custom Header Section One').should('be.visible').parent().should('have.css', 'position', 'sticky'); @@ -1928,7 +1928,7 @@ describe('ObjectPage', () => { cy.findByText('Custom Header Section Two').should('be.visible').parent().should('have.css', 'position', 'static'); cy.findByText('Subsection1').should('be.visible').parent().should('have.css', 'position', 'sticky'); cy.findByTestId('op').scrollTo(0, 4000); - cy.findByText('Custom Header Section Two').should('not.be.visible'); + cy.findByText('Custom Header Section Two').should('be.scrolledOutOfView'); cy.findByText('Subsection1').should('be.visible'); }); diff --git a/templates/vite-ts/cypress.config.ts b/templates/vite-ts/cypress.config.ts index c8bc0df3cbd..0512f3e395f 100644 --- a/templates/vite-ts/cypress.config.ts +++ b/templates/vite-ts/cypress.config.ts @@ -7,5 +7,4 @@ export default defineConfig({ bundler: 'vite', }, }, - allowCypressEnv: false, }); diff --git a/templates/vite-ts/package-lock.json b/templates/vite-ts/package-lock.json index 77e949d7ad0..30d41da3afa 100644 --- a/templates/vite-ts/package-lock.json +++ b/templates/vite-ts/package-lock.json @@ -21,7 +21,7 @@ "@types/react-dom": "19.2.7", "@ui5/webcomponents-cypress-commands": "2.26.0", "@vitejs/plugin-react": "6.1.1", - "cypress": "15.21.1", + "cypress": "16.0.0", "eslint": "9.39.5", "eslint-plugin-react-hooks": "7.1.1", "eslint-plugin-react-refresh": "0.5.6", @@ -2162,9 +2162,9 @@ "license": "MIT" }, "node_modules/cypress": { - "version": "15.21.1", - "resolved": "https://registry.npmjs.org/cypress/-/cypress-15.21.1.tgz", - "integrity": "sha512-ogHpHMj0XNlZA5MGzjg8SWHf0eMw9lTwVQRKjpcT1GzNTxNUjwnHA8YCG6nOJ8ThU+XZaUxJgpMYZnJ//8aDaw==", + "version": "16.0.0", + "resolved": "https://registry.npmjs.org/cypress/-/cypress-16.0.0.tgz", + "integrity": "sha512-/H3zsayGwIGboFIiLWaXxy6ADmCdWy5QjjDBZgslCvjIgYAf1DkZerwAM7wXMPSpfpQ4w+lGjFlmwneRBpg27g==", "dev": true, "hasInstallScript": true, "license": "MIT", @@ -2185,7 +2185,7 @@ "cli-table3": "0.6.1", "commander": "^6.2.1", "common-tags": "^1.8.0", - "dayjs": "^1.10.4", + "dayjs": "^1.11.23", "debug": "^4.3.4", "eventemitter2": "6.4.7", "execa": "4.1.0", @@ -2213,7 +2213,7 @@ "cypress": "bin/cypress" }, "engines": { - "node": "^20.1.0 || ^22.0.0 || >=24.0.0" + "node": "^22.0.0 || ^24.0.0 || >=26.0.0" } }, "node_modules/dashdash": { @@ -2230,9 +2230,9 @@ } }, "node_modules/dayjs": { - "version": "1.11.21", - "resolved": "https://registry.npmjs.org/dayjs/-/dayjs-1.11.21.tgz", - "integrity": "sha512-98IT+HOahAisibz/yjKbzuOBwYcjJ7BCLPzARyHiyEBmRz4fatF+KPJszEHXsGYjUG234aH/cOjW1wwTbKUZlA==", + "version": "1.11.23", + "resolved": "https://registry.npmjs.org/dayjs/-/dayjs-1.11.23.tgz", + "integrity": "sha512-QDTCU0M0MxR3hQfnlDJfwekQiaanm1ubOD231u73WBckQ/fsamwRLiE2GBz6D3a/xF1NgfiDLJjXBa1hYOYTtQ==", "dev": true, "license": "MIT" }, diff --git a/templates/vite-ts/package.json b/templates/vite-ts/package.json index 083d2e6133a..007e639f3e7 100644 --- a/templates/vite-ts/package.json +++ b/templates/vite-ts/package.json @@ -25,7 +25,7 @@ "@types/react-dom": "19.2.7", "@vitejs/plugin-react": "6.1.1", "@ui5/webcomponents-cypress-commands": "2.26.0", - "cypress": "15.21.1", + "cypress": "16.0.0", "eslint": "9.39.5", "eslint-plugin-react-hooks": "7.1.1", "eslint-plugin-react-refresh": "0.5.6", diff --git a/yarn.lock b/yarn.lock index 75a4b3eef4b..bea158b5af9 100644 --- a/yarn.lock +++ b/yarn.lock @@ -5624,7 +5624,7 @@ __metadata: peerDependencies: "@ui5/webcomponents": ~2.26.0 "@ui5/webcomponents-base": ~2.26.0 - cypress: ^12 || ^13 || ^14 || ^15 + cypress: ^12 || ^13 || ^14 || ^15 || ^16 peerDependenciesMeta: "@ui5/webcomponents": optional: true @@ -6790,10 +6790,10 @@ __metadata: languageName: node linkType: hard -"arch@npm:^2.2.0": - version: 2.2.0 - resolution: "arch@npm:2.2.0" - checksum: 10c0/4ceaf8d8207817c216ebc4469742052cb0a097bc45d9b7fcd60b7507220da545a28562ab5bdd4dfe87921bb56371a0805da4e10d704e01f93a15f83240f1284c +"arch@npm:^3.0.0": + version: 3.0.0 + resolution: "arch@npm:3.0.0" + checksum: 10c0/abefcc6738a29632a2b48e7f5910f42fb26d2e2f9c6954cac80b6bdfc4048685c604ef8eb3fd862a7c0884785b20a66a1b44e2ba4b628fd34b80a0cc6a5a0493 languageName: node linkType: hard @@ -7974,6 +7974,18 @@ __metadata: languageName: node linkType: hard +"chrome-remote-interface@npm:0.33.3": + version: 0.33.3 + resolution: "chrome-remote-interface@npm:0.33.3" + dependencies: + commander: "npm:2.11.x" + ws: "npm:^7.2.0" + bin: + chrome-remote-interface: bin/client.js + checksum: 10c0/fcc32714a9d20b21a62417341116e79e7838800e8545ce968b360486ccfa88873f631702a5b549c70801ed6358c32213bcd8657d6fab8eceb8c55ac0c43ceaf7 + languageName: node + linkType: hard + "chunkd@npm:^2.0.1": version: 2.0.1 resolution: "chunkd@npm:2.0.1" @@ -8290,6 +8302,13 @@ __metadata: languageName: node linkType: hard +"commander@npm:2.11.x": + version: 2.11.0 + resolution: "commander@npm:2.11.0" + checksum: 10c0/19eaec3099eba7cc24617fd2bddf6430d62f9e91f0dbfc4abcc5a025f9a6c657526fea5f09243f90c99f87b0df29c29ab4aa4f250888987f658eda617238e55c + languageName: node + linkType: hard + "commander@npm:^11.1.0": version: 11.1.0 resolution: "commander@npm:11.1.0" @@ -8856,26 +8875,27 @@ __metadata: languageName: node linkType: hard -"cypress@npm:15.18.1": - version: 15.18.1 - resolution: "cypress@npm:15.18.1" +"cypress@npm:16.0.0": + version: 16.0.0 + resolution: "cypress@npm:16.0.0" dependencies: "@cypress/request": "npm:^4.0.0" "@cypress/xvfb": "npm:^1.2.4" "@types/sinonjs__fake-timers": "npm:8.1.1" "@types/sizzle": "npm:^2.3.2" "@types/tmp": "npm:^0.2.3" - arch: "npm:^2.2.0" + arch: "npm:^3.0.0" blob-util: "npm:^2.0.2" bluebird: "npm:^3.7.2" buffer: "npm:^5.7.1" cachedir: "npm:^2.4.0" chalk: "npm:^4.1.0" + chrome-remote-interface: "npm:0.33.3" ci-info: "npm:^4.1.0" cli-table3: "npm:0.6.1" commander: "npm:^6.2.1" common-tags: "npm:^1.8.0" - dayjs: "npm:^1.10.4" + dayjs: "npm:^1.11.23" debug: "npm:^4.3.4" eventemitter2: "npm:6.4.7" execa: "npm:4.1.0" @@ -8896,12 +8916,11 @@ __metadata: systeminformation: "npm:^5.31.1" tmp: "npm:~0.2.4" tree-kill: "npm:1.2.2" - tslib: "npm:1.14.1" untildify: "npm:^4.0.0" yauzl: "npm:^3.3.1" bin: cypress: bin/cypress - checksum: 10c0/18543d1ef8b802d48eb30864279aa3ac6ac33c23d03a7d411e0447846bfac06c960f0419a7bdc3d7be54d599cab888197ea6b55640d0d4156f754406e54bf7e6 + checksum: 10c0/c506208f683f9e003686fa14597a2e5d97c8d9e8a71a7a7ea0fc6979da8375d0d2d401a9b1895535bb0ad7e54619e3f79c6cbf0fbce23715939095b8933e5ba8 languageName: node linkType: hard @@ -9056,10 +9075,10 @@ __metadata: languageName: node linkType: hard -"dayjs@npm:^1.10.4": - version: 1.11.21 - resolution: "dayjs@npm:1.11.21" - checksum: 10c0/bd97dfdc4bfea3c66268635690313828b386faa040fbc1f829ff42a2bd748b72c9d9b3c8f9616ce9e61fcb78923f1461a462c969c54b1084458ae1b715898fb0 +"dayjs@npm:^1.11.23": + version: 1.11.23 + resolution: "dayjs@npm:1.11.23" + checksum: 10c0/69ab04bf19c676e44ab50cc2fca223d265f3dafd107151ef3b0f3ad74d360c37caa602abe62f87cb25d90bd9f6bee003698af47df5b0dbf10a998b7b5f3bb3f1 languageName: node linkType: hard @@ -20771,13 +20790,6 @@ __metadata: languageName: node linkType: hard -"tslib@npm:1.14.1, tslib@npm:^1.8.1": - version: 1.14.1 - resolution: "tslib@npm:1.14.1" - checksum: 10c0/69ae09c49eea644bc5ebe1bca4fa4cc2c82b7b3e02f43b84bd891504edf66dbc6b2ec0eef31a957042de2269139e4acff911e6d186a258fb14069cd7f6febce2 - languageName: node - linkType: hard - "tslib@npm:2.8.1, tslib@npm:^2.0.1, tslib@npm:^2.1.0, tslib@npm:^2.3.0, tslib@npm:^2.4.0": version: 2.8.1 resolution: "tslib@npm:2.8.1" @@ -20785,6 +20797,13 @@ __metadata: languageName: node linkType: hard +"tslib@npm:^1.8.1": + version: 1.14.1 + resolution: "tslib@npm:1.14.1" + checksum: 10c0/69ae09c49eea644bc5ebe1bca4fa4cc2c82b7b3e02f43b84bd891504edf66dbc6b2ec0eef31a957042de2269139e4acff911e6d186a258fb14069cd7f6febce2 + languageName: node + linkType: hard + "tsutils@npm:^3.21.0": version: 3.21.0 resolution: "tsutils@npm:3.21.0" @@ -21091,7 +21110,7 @@ __metadata: "@vitejs/plugin-react": "npm:6.1.1" chromatic: "npm:17.8.0" cssnano: "npm:9.0.2" - cypress: "npm:15.18.1" + cypress: "npm:16.0.0" cypress-real-events: "npm:1.15.0" dedent: "npm:1.7.2" documentation: "npm:14.0.3" @@ -22278,6 +22297,21 @@ __metadata: languageName: node linkType: hard +"ws@npm:^7.2.0": + version: 7.5.13 + resolution: "ws@npm:7.5.13" + peerDependencies: + bufferutil: ^4.0.1 + utf-8-validate: ^5.0.2 + peerDependenciesMeta: + bufferutil: + optional: true + utf-8-validate: + optional: true + checksum: 10c0/e223726bbda5768ed58ec9252d04eda7018ef380ea122bb94e595a4d7a02b5baeb423933936576fddb8fa51b642375f7ae814bf0f6f5d9a3ce290566578a8c5a + languageName: node + linkType: hard + "ws@npm:^8.21.1": version: 8.21.1 resolution: "ws@npm:8.21.1" From 830157e8b58a393b0bbac4714e9a6a991ef35c0d Mon Sep 17 00:00:00 2001 From: Lukas Harbarth Date: Thu, 10 Sep 2026 14:11:07 +0200 Subject: [PATCH 2/3] revert: downgrade Cypress to 15.21.1 in examples/templates The published @ui5/webcomponents-cypress-commands@2.26.0 still declares a peer of cypress@"^12 || ^13 || ^14 || ^15", so bumping the standalone examples/vite-ts and templates/vite-ts to cypress@16 breaks their `npm ci` with ERESOLVE. Revert those two projects to 15.21.1 (and restore allowCypressEnv: false) until a cypress-commands release with a ^16 peer is published. The peer-range fix in packages/cypress-commands/package.json is intentionally kept. --- examples/vite-ts/cypress.config.ts | 1 + examples/vite-ts/package-lock.json | 18 +++++++++--------- examples/vite-ts/package.json | 2 +- templates/vite-ts/cypress.config.ts | 1 + templates/vite-ts/package-lock.json | 18 +++++++++--------- templates/vite-ts/package.json | 2 +- 6 files changed, 22 insertions(+), 20 deletions(-) diff --git a/examples/vite-ts/cypress.config.ts b/examples/vite-ts/cypress.config.ts index 26537482016..968e4d48cdb 100644 --- a/examples/vite-ts/cypress.config.ts +++ b/examples/vite-ts/cypress.config.ts @@ -17,4 +17,5 @@ export default defineConfig({ // implement node event listeners here }, }, + allowCypressEnv: false, }); diff --git a/examples/vite-ts/package-lock.json b/examples/vite-ts/package-lock.json index 5bf850fc9c6..abd15c06131 100644 --- a/examples/vite-ts/package-lock.json +++ b/examples/vite-ts/package-lock.json @@ -22,7 +22,7 @@ "@types/react-dom": "19.2.7", "@ui5/webcomponents-cypress-commands": "2.26.0", "@vitejs/plugin-react": "6.1.1", - "cypress": "16.0.0", + "cypress": "15.21.1", "eslint": "9.39.5", "eslint-plugin-react-hooks": "7.1.1", "eslint-plugin-react-refresh": "0.5.6", @@ -2168,9 +2168,9 @@ "license": "MIT" }, "node_modules/cypress": { - "version": "16.0.0", - "resolved": "https://registry.npmjs.org/cypress/-/cypress-16.0.0.tgz", - "integrity": "sha512-/H3zsayGwIGboFIiLWaXxy6ADmCdWy5QjjDBZgslCvjIgYAf1DkZerwAM7wXMPSpfpQ4w+lGjFlmwneRBpg27g==", + "version": "15.21.1", + "resolved": "https://registry.npmjs.org/cypress/-/cypress-15.21.1.tgz", + "integrity": "sha512-ogHpHMj0XNlZA5MGzjg8SWHf0eMw9lTwVQRKjpcT1GzNTxNUjwnHA8YCG6nOJ8ThU+XZaUxJgpMYZnJ//8aDaw==", "dev": true, "hasInstallScript": true, "license": "MIT", @@ -2191,7 +2191,7 @@ "cli-table3": "0.6.1", "commander": "^6.2.1", "common-tags": "^1.8.0", - "dayjs": "^1.11.23", + "dayjs": "^1.10.4", "debug": "^4.3.4", "eventemitter2": "6.4.7", "execa": "4.1.0", @@ -2219,7 +2219,7 @@ "cypress": "bin/cypress" }, "engines": { - "node": "^22.0.0 || ^24.0.0 || >=26.0.0" + "node": "^20.1.0 || ^22.0.0 || >=24.0.0" } }, "node_modules/dashdash": { @@ -2236,9 +2236,9 @@ } }, "node_modules/dayjs": { - "version": "1.11.23", - "resolved": "https://registry.npmjs.org/dayjs/-/dayjs-1.11.23.tgz", - "integrity": "sha512-QDTCU0M0MxR3hQfnlDJfwekQiaanm1ubOD231u73WBckQ/fsamwRLiE2GBz6D3a/xF1NgfiDLJjXBa1hYOYTtQ==", + "version": "1.11.21", + "resolved": "https://registry.npmjs.org/dayjs/-/dayjs-1.11.21.tgz", + "integrity": "sha512-98IT+HOahAisibz/yjKbzuOBwYcjJ7BCLPzARyHiyEBmRz4fatF+KPJszEHXsGYjUG234aH/cOjW1wwTbKUZlA==", "dev": true, "license": "MIT" }, diff --git a/examples/vite-ts/package.json b/examples/vite-ts/package.json index b47301a175f..7cb16ef57d0 100644 --- a/examples/vite-ts/package.json +++ b/examples/vite-ts/package.json @@ -29,7 +29,7 @@ "@types/react-dom": "19.2.7", "@ui5/webcomponents-cypress-commands": "2.26.0", "@vitejs/plugin-react": "6.1.1", - "cypress": "16.0.0", + "cypress": "15.21.1", "eslint": "9.39.5", "eslint-plugin-react-hooks": "7.1.1", "eslint-plugin-react-refresh": "0.5.6", diff --git a/templates/vite-ts/cypress.config.ts b/templates/vite-ts/cypress.config.ts index 0512f3e395f..c8bc0df3cbd 100644 --- a/templates/vite-ts/cypress.config.ts +++ b/templates/vite-ts/cypress.config.ts @@ -7,4 +7,5 @@ export default defineConfig({ bundler: 'vite', }, }, + allowCypressEnv: false, }); diff --git a/templates/vite-ts/package-lock.json b/templates/vite-ts/package-lock.json index 30d41da3afa..77e949d7ad0 100644 --- a/templates/vite-ts/package-lock.json +++ b/templates/vite-ts/package-lock.json @@ -21,7 +21,7 @@ "@types/react-dom": "19.2.7", "@ui5/webcomponents-cypress-commands": "2.26.0", "@vitejs/plugin-react": "6.1.1", - "cypress": "16.0.0", + "cypress": "15.21.1", "eslint": "9.39.5", "eslint-plugin-react-hooks": "7.1.1", "eslint-plugin-react-refresh": "0.5.6", @@ -2162,9 +2162,9 @@ "license": "MIT" }, "node_modules/cypress": { - "version": "16.0.0", - "resolved": "https://registry.npmjs.org/cypress/-/cypress-16.0.0.tgz", - "integrity": "sha512-/H3zsayGwIGboFIiLWaXxy6ADmCdWy5QjjDBZgslCvjIgYAf1DkZerwAM7wXMPSpfpQ4w+lGjFlmwneRBpg27g==", + "version": "15.21.1", + "resolved": "https://registry.npmjs.org/cypress/-/cypress-15.21.1.tgz", + "integrity": "sha512-ogHpHMj0XNlZA5MGzjg8SWHf0eMw9lTwVQRKjpcT1GzNTxNUjwnHA8YCG6nOJ8ThU+XZaUxJgpMYZnJ//8aDaw==", "dev": true, "hasInstallScript": true, "license": "MIT", @@ -2185,7 +2185,7 @@ "cli-table3": "0.6.1", "commander": "^6.2.1", "common-tags": "^1.8.0", - "dayjs": "^1.11.23", + "dayjs": "^1.10.4", "debug": "^4.3.4", "eventemitter2": "6.4.7", "execa": "4.1.0", @@ -2213,7 +2213,7 @@ "cypress": "bin/cypress" }, "engines": { - "node": "^22.0.0 || ^24.0.0 || >=26.0.0" + "node": "^20.1.0 || ^22.0.0 || >=24.0.0" } }, "node_modules/dashdash": { @@ -2230,9 +2230,9 @@ } }, "node_modules/dayjs": { - "version": "1.11.23", - "resolved": "https://registry.npmjs.org/dayjs/-/dayjs-1.11.23.tgz", - "integrity": "sha512-QDTCU0M0MxR3hQfnlDJfwekQiaanm1ubOD231u73WBckQ/fsamwRLiE2GBz6D3a/xF1NgfiDLJjXBa1hYOYTtQ==", + "version": "1.11.21", + "resolved": "https://registry.npmjs.org/dayjs/-/dayjs-1.11.21.tgz", + "integrity": "sha512-98IT+HOahAisibz/yjKbzuOBwYcjJ7BCLPzARyHiyEBmRz4fatF+KPJszEHXsGYjUG234aH/cOjW1wwTbKUZlA==", "dev": true, "license": "MIT" }, diff --git a/templates/vite-ts/package.json b/templates/vite-ts/package.json index 007e639f3e7..083d2e6133a 100644 --- a/templates/vite-ts/package.json +++ b/templates/vite-ts/package.json @@ -25,7 +25,7 @@ "@types/react-dom": "19.2.7", "@vitejs/plugin-react": "6.1.1", "@ui5/webcomponents-cypress-commands": "2.26.0", - "cypress": "16.0.0", + "cypress": "15.21.1", "eslint": "9.39.5", "eslint-plugin-react-hooks": "7.1.1", "eslint-plugin-react-refresh": "0.5.6", From 30f5702abaf35e26a39388c78dcef7544cd3e500 Mon Sep 17 00:00:00 2001 From: Lukas Harbarth Date: Thu, 10 Sep 2026 14:42:21 +0200 Subject: [PATCH 3/3] test(AnalyticalTable): fix React 18 initial scroll-to under Cypress 16 The React-18-only 'initial scroll-to' test still used should('not.be.visible') for cells scrolled out of the table container. Cypress 16's modern visibility algorithm counts scrolled-out-but-laid-out elements as visible, so those assertions failed only on the React 18 CI job (the test is skipped on React 19, where the earlier conversions were validated). Convert the four sites to should('be.scrolledOutOfView'), matching the rest of the spec. --- .../src/components/AnalyticalTable/AnalyticalTable.cy.tsx | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/packages/main/src/components/AnalyticalTable/AnalyticalTable.cy.tsx b/packages/main/src/components/AnalyticalTable/AnalyticalTable.cy.tsx index a4d0bcc2306..cf3f47ce2bd 100644 --- a/packages/main/src/components/AnalyticalTable/AnalyticalTable.cy.tsx +++ b/packages/main/src/components/AnalyticalTable/AnalyticalTable.cy.tsx @@ -4269,7 +4269,7 @@ describe('AnalyticalTable', () => { }; cy.mount(); cy.get('[data-component-name="AnalyticalTableContainer"]').findByText('Name-12').should('be.visible'); - cy.get('[data-component-name="AnalyticalTableContainer"]').findByText('Name-11').should('not.be.visible'); + cy.get('[data-component-name="AnalyticalTableContainer"]').findByText('Name-11').should('be.scrolledOutOfView'); const ScrollToItem = () => { const tableRef = useRef(null); @@ -4280,7 +4280,7 @@ describe('AnalyticalTable', () => { }; cy.mount(); cy.get('[data-component-name="AnalyticalTableContainer"]').findByText('Name-12').should('be.visible'); - cy.get('[data-component-name="AnalyticalTableContainer"]').findByText('Name-11').should('not.be.visible'); + cy.get('[data-component-name="AnalyticalTableContainer"]').findByText('Name-11').should('be.scrolledOutOfView'); const cols = [ ...columns, @@ -4298,7 +4298,7 @@ describe('AnalyticalTable', () => { }; cy.mount(); cy.get('[data-component-name="AnalyticalTableContainer"]').findByText('13').should('be.visible'); - cy.get('[data-component-name="AnalyticalTableContainer"]').findByText('12').should('not.be.visible'); + cy.get('[data-component-name="AnalyticalTableContainer"]').findByText('12').should('be.scrolledOutOfView'); const ScrollToItemHorizontal = () => { const tableRef = useRef(null); @@ -4315,7 +4315,7 @@ describe('AnalyticalTable', () => { }; cy.mount(); cy.get('[data-component-name="AnalyticalTableContainer"]').findByText('13').should('be.visible'); - cy.get('[data-component-name="AnalyticalTableContainer"]').findByText('12').should('not.be.visible'); + cy.get('[data-component-name="AnalyticalTableContainer"]').findByText('12').should('be.scrolledOutOfView'); }); }