From 65446035411bb9f5148f73702c70d743b7d70a05 Mon Sep 17 00:00:00 2001 From: Stoyan Date: Mon, 16 Jun 2025 10:31:19 +0300 Subject: [PATCH 1/5] test(ui5-time-picker): migrate tests to cypress --- packages/main/cypress/specs/TimePicker.cy.tsx | 390 ++++++++++++++++++ packages/main/cypress/support/commands.ts | 6 + .../support/commands/TimePicker.commands.ts | 88 ++++ packages/main/test/specs/TimePicker.spec.js | 262 ------------ 4 files changed, 484 insertions(+), 262 deletions(-) create mode 100644 packages/main/cypress/specs/TimePicker.cy.tsx create mode 100644 packages/main/cypress/support/commands/TimePicker.commands.ts delete mode 100644 packages/main/test/specs/TimePicker.spec.js diff --git a/packages/main/cypress/specs/TimePicker.cy.tsx b/packages/main/cypress/specs/TimePicker.cy.tsx new file mode 100644 index 000000000000..f1e7a22de9d3 --- /dev/null +++ b/packages/main/cypress/specs/TimePicker.cy.tsx @@ -0,0 +1,390 @@ +import "../../src/Assets.js"; +import { setLanguage } from "@ui5/webcomponents-base/dist/config/Language.js"; +import TimePicker from "../../src/TimePicker.js"; +import Label from "../../src/Label.js"; + +describe("TimePicker Tests", () => { + it("input receives value in format pattern depending on the set language", () => { + cy.wrap({ setLanguage }) + .invoke("setLanguage", "bg"); + + cy.mount(); + + cy.get("[ui5-time-picker]") + .as("timePicker"); + + cy.get("@timePicker") + .ui5TimePickerGetInnerInput() + .should("have.value", "3:16:16 ч."); + + cy.wrap({ setLanguage }) + .invoke("setLanguage", "en"); + }); + + it("tests clocks value", () => { + cy.mount(); + + cy.get("[ui5-time-picker]") + .as("timePicker") + .ui5TimePickerValueHelpIconPress(); + + cy.get("@timePicker") + .ui5TimePickerGetClock("hours") + .should("have.prop", "selectedValue", 11); + + cy.get("@timePicker") + .ui5TimePickerGetClock("minutes") + .should("have.prop", "selectedValue", 12); + + cy.get("@timePicker") + .ui5TimePickerGetClock("seconds") + .should("have.prop", "selectedValue", 13); + }); + + it("tests clocks submit value", () => { + cy.mount(); + + function pressKeyNTimes(key: "ArrowDown" | "ArrowUp" | "Space" | "Tab" | "Enter", n: number) { + for (let i = 0; i < n; i++) { + cy.realPress(key); + } + } + + cy.get("[ui5-time-picker]") + .as("timePicker") + .ui5TimePickerValueHelpIconPress(); + + cy.get("@timePicker") + .ui5TimePickerGetClock("hours") + .realClick(); + + pressKeyNTimes("ArrowDown", 10); + cy.realPress("Space"); + + cy.get("@timePicker") + .ui5TimePickerGetClock("minutes"); + + pressKeyNTimes("ArrowDown", 22); + pressKeyNTimes("ArrowUp", 2); + + cy.realPress("Space"); + + cy.get("@timePicker") + .ui5TimePickerGetClock("seconds"); + + pressKeyNTimes("ArrowUp", 4); + + cy.realPress("Tab"); + cy.realPress("Enter"); + + cy.get("@timePicker") + .should("have.value", "02:40:05"); + }); + + it("tests submit wrong value", () => { + cy.mount(); + + cy.get("[ui5-time-picker]") + .as("timePicker") + .ui5TimePickerGetInnerInput() + .realClick() + .should("be.focused") + .realType("123123123") + .realPress("Enter"); + + cy.get("@timePicker") + .shadow() + .find("ui5-datetime-input") + .should("have.attr", "value-state", "Negative"); + }); + + it("tests change event", () => { + cy.mount(); + + const changeStub = cy.stub().as("changeStub"); + + cy.get("[ui5-time-picker]") + .as("timePicker") + .then($el => { + $el[0].addEventListener("ui5-change", changeStub); + }); + + // Open picker and submit without changes + cy.get("@timePicker") + .ui5TimePickerValueHelpIconPress(); + + cy.get("@timePicker") + .ui5TimePickerGetSubmitButton() + .realClick(); + + // Assert no change event was fired + cy.get("@changeStub").should("not.have.been.called"); + + // Open picker, change time and submit + cy.get("@timePicker") + .ui5TimePickerValueHelpIconPress(); + + cy.get("@timePicker") + .ui5TimePickerGetClock("hours") + .realClick() + .realPress("PageDown") // select 11 + .realPress("ArrowDown") + .realPress("ArrowDown") + .realPress("ArrowDown") + .realPress("ArrowDown") + .realPress("ArrowDown") + .realPress("ArrowDown") + .realPress("ArrowDown") + .realPress("ArrowDown") + .realPress("ArrowDown") + .realPress("ArrowDown") + .realPress("Space"); + + cy.get("@timePicker") + .ui5TimePickerGetSubmitButton() + .realClick(); + + // Assert change event was fired once + cy.get("@changeStub").should("have.been.calledOnce"); + + // Open picker and submit without changes + cy.get("@timePicker") + .ui5TimePickerValueHelpIconPress(); + + cy.get("@timePicker") + .ui5TimePickerGetSubmitButton() + .realClick(); + + // Assert change event was not fired again + cy.get("@changeStub").should("have.been.calledOnce"); + + // Open picker, change time and submit + cy.get("@timePicker") + .ui5TimePickerValueHelpIconPress(); + + cy.get("@timePicker") + .ui5TimePickerGetClock("hours") + .realClick() + .realPress("ArrowDown") // select 00 + .realPress("Space"); + + cy.get("@timePicker") + .ui5TimePickerGetSubmitButton() + .realClick(); + + // Assert change event was fired again + cy.get("@changeStub").should("have.been.calledTwice"); + + // Test direct input change + cy.get("@timePicker") + .ui5TimePickerGetInnerInput() + .realClick() + .should("be.focused") + .realPress("Backspace") + .realType("7") + .realPress("Enter"); + + // Assert change event was fired again + cy.get("@changeStub").should("have.been.calledThrice"); + }); + + it("tests value state", () => { + cy.mount(); + + cy.get("[ui5-time-picker]") + .as("timePicker") + .ui5TimePickerGetInnerInput() + .realClick(); + + // Clear the input + cy.get("@timePicker") + .ui5TimePickerGetInnerInput() + .clear(); + + cy.get("body").realClick(); // Click outside to trigger blur + + cy.get("@timePicker") + .shadow() + .find("ui5-datetime-input") + .should("have.attr", "value-state", "None"); + }); + + it("tests input keyboard handling", () => { + cy.mount(); + + cy.get("[ui5-time-picker]") + .as("timePicker") + .ui5TimePickerGetInnerInput() + .realClick() + .should("be.focused") + .realPress(["Shift", "PageUp"]); + + cy.get("@timePicker") + .ui5TimePickerGetInnerInput() + .should("have.value", "02:41:05"); + + cy.get("@timePicker") + .ui5TimePickerGetInnerInput() + .realClick() + .should("be.focused") + .realPress(["Shift", "PageDown"]); + + cy.get("@timePicker") + .ui5TimePickerGetInnerInput() + .should("have.value", "02:40:05"); + + cy.get("@timePicker") + .ui5TimePickerGetInnerInput() + .realClick() + .should("be.focused") + .realPress("PageUp"); + + cy.get("@timePicker") + .ui5TimePickerGetInnerInput() + .should("have.value", "03:40:05"); + + cy.get("@timePicker") + .ui5TimePickerGetInnerInput() + .realClick() + .should("be.focused") + .realPress("PageDown"); + + cy.get("@timePicker") + .ui5TimePickerGetInnerInput() + .should("have.value", "02:40:05"); + + cy.get("@timePicker") + .ui5TimePickerGetInnerInput() + .realClick() + .should("be.focused") + .realPress(["Shift", "Control", "PageUp"]); + + cy.get("@timePicker") + .ui5TimePickerGetInnerInput() + .should("have.value", "02:40:06"); + + cy.get("@timePicker") + .ui5TimePickerGetInnerInput() + .realClick() + .should("be.focused") + .realPress(["Shift", "Control", "PageDown"]); + + cy.get("@timePicker") + .ui5TimePickerGetInnerInput() + .should("have.value", "02:40:05"); + }); + + it("test closing the picker with the keyboard", () => { + cy.mount(); + + cy.get("[ui5-time-picker]") + .as("timePicker") + .ui5TimePickerValueHelpIconPress(); + + cy.realPress(["Alt", "ArrowUp"]); + + cy.get("@timePicker") + .should("not.have.attr", "open"); + }); + + it("the value 'now' returns the current time, instead of the string 'now'", () => { + cy.mount(); + + cy.get("[ui5-time-picker]") + .as("timePicker") + .ui5TimePickerGetInnerInput() + .realClick() + .should("be.focused") + .realType("now") + .realPress("Enter"); + + cy.get("@timePicker") + .ui5TimePickerGetInnerInput() + .should("not.have.value", "now"); + }); + + it("opening time picker's value-help, sets the 'open' property to true", () => { + cy.mount(); + + cy.get("[ui5-time-picker]") + .as("timePicker") + .ui5TimePickerValueHelpIconPress(); + + cy.get("@timePicker") + .should("have.attr", "open"); + + cy.get("@timePicker") + .shadow() + .find("ui5-responsive-popover") + .should("have.attr", "open"); + }); + + it("setting time picker's open property to true, opens the value-help", () => { + cy.mount(); + + cy.get("[ui5-time-picker]") + .as("timePicker"); + + cy.get("@timePicker") + .then($el => { + $el.prop("open", true); + }); + + cy.get("@timePicker") + .shadow() + .find("ui5-responsive-popover") + .should("have.attr", "open"); + }); + + it("picker popover should have accessible name", () => { + cy.mount(); + + cy.get("[ui5-time-picker]") + .as("timePicker") + .ui5TimePickerGetInnerInput() + .realClick() + .should("be.focused") + .realPress("F4"); + + cy.get("@timePicker") + .shadow() + .find("ui5-responsive-popover") + .should("have.attr", "accessible-name", "Choose Time"); + }); + + it("input should have accessible name", () => { + cy.mount( + <> + + + + ); + + cy.get("[ui5-time-picker]") + .ui5TimePickerGetInnerInput() + .should("have.attr", "aria-label", "Pick a time"); + }); + + it("should apply aria-label from the accessibleName property", () => { + cy.mount(); + + cy.get("[ui5-time-picker]") + .ui5TimePickerGetInnerInput() + .should("have.attr", "aria-label", "Pick a time"); + }); + + it("displays value state message header in popover when value state is set", () => { + cy.mount(); + + cy.get("[ui5-time-picker]") + .as("timePicker") + .ui5TimePickerValueHelpIconPress(); + + cy.get("@timePicker") + .shadow() + .find("ui5-responsive-popover") + .find(".ui5-valuestatemessage-header") + .should("exist") + .and("have.class", "ui5-valuestatemessage--error"); + }); +}); \ No newline at end of file diff --git a/packages/main/cypress/support/commands.ts b/packages/main/cypress/support/commands.ts index 42403623d161..fcedfcc70e5f 100644 --- a/packages/main/cypress/support/commands.ts +++ b/packages/main/cypress/support/commands.ts @@ -53,6 +53,7 @@ import "./commands/Menu.commands.js"; import "./commands/SegmentedButton.commands.js"; import "./commands/TimeSelectionClocks.commands.js"; import "./commands/ToggleButton.commands.js"; +import "./commands/TimePicker.commands.js"; type SimulationDevices = "phone" @@ -85,6 +86,11 @@ declare global { ui5DatePickerGetMonthButton(): Chainable> ui5DatePickerGetYearButton(): Chainable> ui5DatePickerValueHelpIconPress(): Chainable + ui5TimePickerGetInnerInput(): Chainable> + ui5TimePickerValueHelpIconPress(): Chainable + ui5TimePickerGetPopover(): Chainable> + ui5TimePickerGetClock(clockType: string): Chainable> + ui5TimePickerGetSubmitButton(): Chainable> ui5SegmentedButtonItemToggleSelect(deselect?: boolean): Chainable ui5SegmentedButtonFocusFirstItem(): Chainable ui5TimeSelectionClocksInnerButton(name: string, index: number): Chainable> diff --git a/packages/main/cypress/support/commands/TimePicker.commands.ts b/packages/main/cypress/support/commands/TimePicker.commands.ts new file mode 100644 index 000000000000..2bd0aa50ce8a --- /dev/null +++ b/packages/main/cypress/support/commands/TimePicker.commands.ts @@ -0,0 +1,88 @@ +Cypress.Commands.add("ui5TimePickerGetInnerInput", { prevSubject: true }, subject => { + cy.wrap(subject) + .as("timePicker"); + + cy.get("@timePicker") + .shadow() + .find("ui5-datetime-input") + .shadow() + .find("input") + .as("innerInput"); + + return cy.get("@innerInput"); +}); + +Cypress.Commands.add("ui5TimePickerValueHelpIconPress", { prevSubject: true }, subject => { + cy.wrap(subject) + .as("timePicker"); + + cy.get("@timePicker") + .shadow() + .find("ui5-datetime-input") + .find(".ui5-time-picker-input-icon-button") + .realClick(); +}); + +Cypress.Commands.add("ui5TimePickerGetPopover", { prevSubject: true }, subject => { + cy.wrap(subject) + .as("timePicker"); + + cy.get("@timePicker") + .should("have.attr", "open"); + + return cy.get("@timePicker") + .shadow() + .find("ui5-responsive-popover") + .should("be.visible"); +}); + +Cypress.Commands.add("ui5TimePickerGetClock", { prevSubject: true }, (subject, clockType) => { + cy.wrap(subject) + .as("timePicker"); + + cy.get("@timePicker") + .should("have.attr", "open"); + + return cy.get("@timePicker") + .shadow() + .find("ui5-responsive-popover") + .find("ui5-time-selection-clocks") + .shadow() + .find(`ui5-time-picker-clock[data-ui5-clock="${clockType}"]`); +}); + +Cypress.Commands.add("ui5TimePickerGetSubmitButton", { prevSubject: true }, subject => { + cy.wrap(subject) + .as("timePicker"); + + cy.get("@timePicker") + .should("have.attr", "open"); + + return cy.get("@timePicker") + .shadow() + .find("ui5-responsive-popover") + .find("#submit"); +}); + +declare global { + namespace Cypress { + interface Chainable { + ui5TimePickerGetInnerInput( + this: Chainable> + ): Chainable>; + ui5TimePickerValueHelpIconPress( + this: Chainable> + ): Chainable; + ui5TimePickerGetPopover( + this: Chainable> + ): Chainable>; + ui5TimePickerGetClock( + this: Chainable>, + clockType: string + ): Chainable>; + ui5TimePickerGetSubmitButton( + this: Chainable> + ): Chainable>; + } + } +} \ No newline at end of file diff --git a/packages/main/test/specs/TimePicker.spec.js b/packages/main/test/specs/TimePicker.spec.js deleted file mode 100644 index 7e9c7bafd2cc..000000000000 --- a/packages/main/test/specs/TimePicker.spec.js +++ /dev/null @@ -1,262 +0,0 @@ -import { assert } from "chai"; - -describe("TimePicker general interaction", () => { - before(async () => { - await browser.url(`test/pages/TimePicker.html?sap-ui-language=bg`); - }); - - it("input receives value in format pattern depending on the set language", async () => { - const timepicker = await browser.$("#timepickerSetTime"); - const setTimeButton = await browser.$("#setTimeButton"); - - await setTimeButton.click(); - - assert.equal(await timepicker.shadow$("ui5-datetime-input").getValue(), "3:16:16 ч."); - }); - - it("tests clocks value", async () => { - const timepicker = await browser.$("#timepicker"); - const timepickerPopover = await timepicker.shadow$("ui5-responsive-popover"); - - // act - await timepicker.setProperty("value", "11:12:13"); - await timepicker.shadow$("ui5-datetime-input").$(".ui5-time-picker-input-icon-button").click(); - - const hoursClockValue = await timepickerPopover.$("ui5-time-selection-clocks").shadow$(`ui5-time-picker-clock[data-ui5-clock="hours"]`).getProperty("selectedValue"); - const minutesClockValue = await timepickerPopover.$("ui5-time-selection-clocks").shadow$(`ui5-time-picker-clock[data-ui5-clock="minutes"]`).getProperty("selectedValue"); - const secondsClockValue = await timepickerPopover.$("ui5-time-selection-clocks").shadow$(`ui5-time-picker-clock[data-ui5-clock="seconds"]`).getProperty("selectedValue"); - - // assert - assert.strictEqual(hoursClockValue, 11, "Hours are equal"); - assert.strictEqual(minutesClockValue, 12, "Minutes are equal"); - assert.strictEqual(secondsClockValue, 13, "Seconds are equal"); - }); - - it("tests clocks submit value", async () => { - const timepicker = await browser.$("#timepicker5"); - const picker = await timepicker.shadow$("ui5-responsive-popover"); - - // act - await timepicker.shadow$("ui5-datetime-input").$(".ui5-time-picker-input-icon-button").click(); - await browser.keys("Escape"); - await timepicker.shadow$("ui5-datetime-input").$(".ui5-time-picker-input-icon-button").click(); - - // hours clock is displayed - for (let i=1; i<= 10; i++) await browser.keys("ArrowDown"); // Select 02 - - // switch to minutes clock - await browser.keys("Space"); - for (let i=1; i<= 20; i++) await browser.keys("ArrowDown"); // Select 40 - - // switch to seconds clock - await browser.keys("Space"); - for (let i=1; i<= 4; i++) await browser.keys("ArrowUp"); // Select 5 - - await browser.keys("Tab"); // Move to submit - await browser.keys("Enter"); // Enter on submit - - const textValue = await timepicker.shadow$("ui5-datetime-input").getValue(); - assert.strictEqual(textValue.substring(0,2), "02", "Hours are equal"); - assert.strictEqual(textValue.substring(3,5), "40", "Minutes are equal"); - assert.strictEqual(textValue.substring(6,8), "05", "Seconds are equal"); - }); - - it("tests submit wrong value", async () => { - const timepicker = await browser.$("#timepicker"); - - await timepicker.click(); - await browser.keys("123123123"); - await browser.keys("Enter"); - - assert.strictEqual(await timepicker.shadow$("ui5-datetime-input").getProperty("valueState"), "Negative", "The value state is on error"); - }); - - it("tests change event", async () => { - const timepicker = await browser.$("#timepickerChange"); - const input = await timepicker.shadow$("ui5-datetime-input"); - const icon = await input.$("ui5-icon"); - const changeResult = await browser.$("#changeResult"); - - // act - submit the same time - await icon.click(); - const timepickerPopover = await timepicker.shadow$("ui5-responsive-popover"); - await timepickerPopover.$("#submit").click(); - - // assert - assert.strictEqual(await changeResult.getProperty("value"), "0", "Change not fired as expected"); - - // act - submit value after changing time - await icon.click(); - - await browser.keys("PageDown"); // select 11 - for (let i=1; i<= 10; i++) await browser.keys("ArrowDown"); // Select 1 - - await timepickerPopover.$("#submit").click(); - - // assert - assert.strictEqual(await changeResult.getProperty("value"), "1", "Change fired as expected"); - - // act - submit the same time - await icon.click(); - await timepickerPopover.$("#submit").click(); - - // assert - assert.strictEqual(await changeResult.getProperty("value"), "1", "Change not fired as expected"); - - // act - submit value after changing time - await icon.click(); - await browser.keys("ArrowDown"); // select 00 - - await timepickerPopover.$("#submit").click(); // click submit (the other test tests Enter, this one tests click) - - // assert - assert.strictEqual(await changeResult.getProperty("value"), "2", "Change fired as expected"); - - //act - await input.click(); - await browser.keys("Backspace"); - await browser.keys("7"); - await browser.keys("Enter"); - - // assert - assert.strictEqual(await changeResult.getProperty("value"), "3", "Change fired as expected"); - }); - - it("tests value state", async () => { - const timepicker = await browser.$("#timepickerEmptyValue"); - const button = await browser.$("#testBtn"); - - // act - await timepicker.click(); - while(await timepicker.shadow$("ui5-datetime-input").getProperty("value") !== ""){ - await browser.keys("Backspace"); - } - await button.click(); - - // assert - assert.strictEqual(await timepicker.shadow$("ui5-datetime-input").getProperty("valueState"), "None", "The value state is None"); - }); - - it("tests input keyboard handling", async () => { - const timepicker = await browser.$("#timepicker5"); - - // act - await timepicker.click(); - await browser.keys(['Shift', 'PageUp']); - await browser.keys('Shift'); - - // assert - assert.strictEqual(await timepicker.shadow$("ui5-datetime-input").getProperty("value"), "02:41:05", "The value of minutes is +1"); - // act - await timepicker.click(); - await browser.keys(['Shift', 'PageDown']); - await browser.keys('Shift'); - - // assert - assert.strictEqual(await timepicker.shadow$("ui5-datetime-input").getProperty("value"), "02:40:05", "The value of minutes is -1"); - - // act - await timepicker.click(); - await browser.keys('PageUp'); - - // assert - assert.strictEqual(await timepicker.shadow$("ui5-datetime-input").getProperty("value"), "03:40:05", "The value of hours is +1"); - // act - await timepicker.click(); - await browser.keys('PageDown'); - - // assert - assert.strictEqual(await timepicker.shadow$("ui5-datetime-input").getProperty("value"), "02:40:05", "The value of hours is -1"); - - // act - await timepicker.click(); - await browser.keys(['Shift', 'Control', 'PageUp']); - await browser.keys('Shift'); - await browser.keys('Control'); - - // assert - assert.strictEqual(await timepicker.shadow$("ui5-datetime-input").getProperty("value"), "02:40:06", "The value of seconds is +1"); - // act - await timepicker.click(); - await browser.keys(['Shift', 'Control', 'PageDown']); - await browser.keys('Shift'); - await browser.keys('Control'); - - // assert - assert.strictEqual(await timepicker.shadow$("ui5-datetime-input").getProperty("value"), "02:40:05", "The value of seconds is -1"); - }); - - it("test closing the picker with the keyboard", async () => { - const timepicker = await browser.$("#timepicker3"); - - // act - await timepicker.shadow$("ui5-datetime-input").$(".ui5-time-picker-input-icon-button").click(); - await browser.keys(["Alt", "ArrowUp"]); - - const timepickerPopover = await timepicker.shadow$("ui5-responsive-popover"); - - // assert - assert.notOk(await timepickerPopover.isDisplayed(), "the picker should be collapsed"); - }); - - it("the value 'now' returns the current time, instead of the string 'now'", async () => { - await browser.url(`test/pages/TimePicker.html`); - - const timepicker = await browser.$("#timepicker"); - - // act - await timepicker.click(); - await browser.keys("now"); - await browser.keys("Enter"); - - // assert that the value in the input is different than the string 'now' - assert.notStrictEqual(await timepicker.shadow$("ui5-datetime-input").getProperty("value"), "now", "the value is not 'now'"); - }); - - it("opening time picker's value-help, sets the 'open' property to true", async () => { - const timepicker = await browser.$("#timepicker"); - const timepickerPopover = await timepicker.shadow$("ui5-responsive-popover"); - - // act - await timepicker.shadow$("ui5-datetime-input").$(".ui5-time-picker-input-icon-button").click(); - - assert.strictEqual(await timepicker.getProperty("open"), true, "The timepicker's open property is set to true"); - assert.strictEqual(await timepickerPopover.getProperty("open"), true, "The popover is opened"); - }) - - it("setting time picker's open property to true, opens the value-help", async () => { - const timepicker = await browser.$("#timepicker"); - const timepickerPopover = await timepicker.shadow$("ui5-responsive-popover"); - - // act - await timepicker.setProperty("open", true); - - assert.strictEqual(await timepickerPopover.getProperty("open"), true, "The popover is opened"); - }) - - it("picker popover should have accessible name", async () => { - const timepicker = await browser.$("#timepicker"); - await timepicker.click(); - await browser.keys("F4"); - - const popover = await timepicker.shadow$("ui5-responsive-popover"); - - assert.strictEqual(await popover.getAttribute("accessible-name"), "Choose Time", "Picker popover has an accessible name"); - - await browser.keys("Escape"); - }); - - it("input should have accessible name", async () => { - const timepicker = await browser.$("#timepickerAccessibleNameRef"); - const innerInput = await timepicker.shadow$("ui5-datetime-input").shadow$("input"); - - assert.strictEqual(await innerInput.getAttribute("aria-label"), "Pick a time", "Input aria-label attribute is correct."); - }); - - it("should apply aria-label from the accessibleNameRef property", async () => { - const timepicker = await browser.$("#timepickerAccessibleName"); - const innerInput = await timepicker.shadow$("ui5-datetime-input").shadow$("input"); - - assert.strictEqual(await innerInput.getAttribute("aria-label"), "Pick a time", "Input aria-label attribute is correct."); - }); -}); From 10b77989f4341fb41650192e26f8f587a06a1230 Mon Sep 17 00:00:00 2001 From: Stoyan Date: Mon, 16 Jun 2025 14:04:15 +0300 Subject: [PATCH 2/5] chore: address comments --- packages/main/cypress/specs/TimePicker.cy.tsx | 67 +++++++++---------- .../support/commands/TimePicker.commands.ts | 2 +- 2 files changed, 32 insertions(+), 37 deletions(-) diff --git a/packages/main/cypress/specs/TimePicker.cy.tsx b/packages/main/cypress/specs/TimePicker.cy.tsx index f1e7a22de9d3..76896cfe5ca5 100644 --- a/packages/main/cypress/specs/TimePicker.cy.tsx +++ b/packages/main/cypress/specs/TimePicker.cy.tsx @@ -3,10 +3,18 @@ import { setLanguage } from "@ui5/webcomponents-base/dist/config/Language.js"; import TimePicker from "../../src/TimePicker.js"; import Label from "../../src/Label.js"; +function pressKeyNTimes(key: "ArrowDown" | "ArrowUp" | "Space" | "Tab" | "Enter", n: number) { + for (let i = 0; i < n; i++) { + cy.realPress(key); + } +} + describe("TimePicker Tests", () => { it("input receives value in format pattern depending on the set language", () => { cy.wrap({ setLanguage }) - .invoke("setLanguage", "bg"); + .then(api => { + return api.setLanguage("bg") + }) cy.mount(); @@ -30,33 +38,29 @@ describe("TimePicker Tests", () => { cy.get("@timePicker") .ui5TimePickerGetClock("hours") - .should("have.prop", "selectedValue", 11); + .should("have.prop", "valueNow", 11); cy.get("@timePicker") .ui5TimePickerGetClock("minutes") - .should("have.prop", "selectedValue", 12); + .should("have.prop", "valueNow", 12); cy.get("@timePicker") .ui5TimePickerGetClock("seconds") - .should("have.prop", "selectedValue", 13); + .should("have.prop", "valueNow", 13); }); it("tests clocks submit value", () => { cy.mount(); - function pressKeyNTimes(key: "ArrowDown" | "ArrowUp" | "Space" | "Tab" | "Enter", n: number) { - for (let i = 0; i < n; i++) { - cy.realPress(key); - } - } - cy.get("[ui5-time-picker]") .as("timePicker") .ui5TimePickerValueHelpIconPress(); cy.get("@timePicker") .ui5TimePickerGetClock("hours") - .realClick(); + .realClick() + .should("be.focused") + pressKeyNTimes("ArrowDown", 10); cy.realPress("Space"); @@ -88,26 +92,22 @@ describe("TimePicker Tests", () => { .as("timePicker") .ui5TimePickerGetInnerInput() .realClick() - .should("be.focused") - .realType("123123123") - .realPress("Enter"); + .should("be.focused"); + + cy.realType("123123123"); + cy.realPress("Enter"); cy.get("@timePicker") .shadow() - .find("ui5-datetime-input") + .find("[ui5-datetime-input]") .should("have.attr", "value-state", "Negative"); }); it("tests change event", () => { - cy.mount(); - - const changeStub = cy.stub().as("changeStub"); + cy.mount(); cy.get("[ui5-time-picker]") - .as("timePicker") - .then($el => { - $el[0].addEventListener("ui5-change", changeStub); - }); + .as("timePicker"); // Open picker and submit without changes cy.get("@timePicker") @@ -127,18 +127,11 @@ describe("TimePicker Tests", () => { cy.get("@timePicker") .ui5TimePickerGetClock("hours") .realClick() - .realPress("PageDown") // select 11 - .realPress("ArrowDown") - .realPress("ArrowDown") - .realPress("ArrowDown") - .realPress("ArrowDown") - .realPress("ArrowDown") - .realPress("ArrowDown") - .realPress("ArrowDown") - .realPress("ArrowDown") - .realPress("ArrowDown") - .realPress("ArrowDown") - .realPress("Space"); + .should("be.focused") + .realPress("PageDown"); // select 11 + + pressKeyNTimes("ArrowDown", 10); + cy.realPress("Space"); cy.get("@timePicker") .ui5TimePickerGetSubmitButton() @@ -165,6 +158,7 @@ describe("TimePicker Tests", () => { cy.get("@timePicker") .ui5TimePickerGetClock("hours") .realClick() + .should("be.focused") .realPress("ArrowDown") // select 00 .realPress("Space"); @@ -199,13 +193,14 @@ describe("TimePicker Tests", () => { // Clear the input cy.get("@timePicker") .ui5TimePickerGetInnerInput() - .clear(); + .realClick({ clickCount: 2 }) + .realPress("Backspace"); cy.get("body").realClick(); // Click outside to trigger blur cy.get("@timePicker") .shadow() - .find("ui5-datetime-input") + .find("[ui5-datetime-input]") .should("have.attr", "value-state", "None"); }); diff --git a/packages/main/cypress/support/commands/TimePicker.commands.ts b/packages/main/cypress/support/commands/TimePicker.commands.ts index 2bd0aa50ce8a..bcd5aef85a41 100644 --- a/packages/main/cypress/support/commands/TimePicker.commands.ts +++ b/packages/main/cypress/support/commands/TimePicker.commands.ts @@ -48,7 +48,7 @@ Cypress.Commands.add("ui5TimePickerGetClock", { prevSubject: true }, (subject, c .find("ui5-responsive-popover") .find("ui5-time-selection-clocks") .shadow() - .find(`ui5-time-picker-clock[data-ui5-clock="${clockType}"]`); + .find(`ui5-toggle-spin-button[data-ui5-clock="${clockType}"]`); }); Cypress.Commands.add("ui5TimePickerGetSubmitButton", { prevSubject: true }, subject => { From 184a99b579a07a177748f7155088feca7217a98b Mon Sep 17 00:00:00 2001 From: Stoyan Date: Tue, 17 Jun 2025 10:04:15 +0300 Subject: [PATCH 3/5] test: address comments --- packages/main/cypress/specs/TimePicker.cy.tsx | 31 +++++++++---------- packages/main/cypress/support/commands.ts | 5 --- .../support/commands/TimePicker.commands.ts | 12 +++---- 3 files changed, 20 insertions(+), 28 deletions(-) diff --git a/packages/main/cypress/specs/TimePicker.cy.tsx b/packages/main/cypress/specs/TimePicker.cy.tsx index 76896cfe5ca5..08935617321b 100644 --- a/packages/main/cypress/specs/TimePicker.cy.tsx +++ b/packages/main/cypress/specs/TimePicker.cy.tsx @@ -26,7 +26,9 @@ describe("TimePicker Tests", () => { .should("have.value", "3:16:16 ч."); cy.wrap({ setLanguage }) - .invoke("setLanguage", "en"); + .then(api => { + return api.setLanguage("en"); + }); }); it("tests clocks value", () => { @@ -62,13 +64,13 @@ describe("TimePicker Tests", () => { .should("be.focused") - pressKeyNTimes("ArrowDown", 10); + pressKeyNTimes("ArrowDown", 2); cy.realPress("Space"); cy.get("@timePicker") .ui5TimePickerGetClock("minutes"); - pressKeyNTimes("ArrowDown", 22); + pressKeyNTimes("ArrowDown", 5); pressKeyNTimes("ArrowUp", 2); cy.realPress("Space"); @@ -82,7 +84,7 @@ describe("TimePicker Tests", () => { cy.realPress("Enter"); cy.get("@timePicker") - .should("have.value", "02:40:05"); + .should("have.value", "10:57:05"); }); it("tests submit wrong value", () => { @@ -128,9 +130,10 @@ describe("TimePicker Tests", () => { .ui5TimePickerGetClock("hours") .realClick() .should("be.focused") - .realPress("PageDown"); // select 11 - pressKeyNTimes("ArrowDown", 10); + cy.realPress("PageDown"); + + pressKeyNTimes("ArrowDown", 2); cy.realPress("Space"); cy.get("@timePicker") @@ -309,8 +312,7 @@ describe("TimePicker Tests", () => { .should("have.attr", "open"); cy.get("@timePicker") - .shadow() - .find("ui5-responsive-popover") + .ui5TimePickerGetPopover() .should("have.attr", "open"); }); @@ -321,13 +323,10 @@ describe("TimePicker Tests", () => { .as("timePicker"); cy.get("@timePicker") - .then($el => { - $el.prop("open", true); - }); + .invoke("prop", "open", true); cy.get("@timePicker") - .shadow() - .find("ui5-responsive-popover") + .ui5TimePickerGetPopover() .should("have.attr", "open"); }); @@ -342,8 +341,7 @@ describe("TimePicker Tests", () => { .realPress("F4"); cy.get("@timePicker") - .shadow() - .find("ui5-responsive-popover") + .ui5TimePickerGetPopover() .should("have.attr", "accessible-name", "Choose Time"); }); @@ -376,8 +374,7 @@ describe("TimePicker Tests", () => { .ui5TimePickerValueHelpIconPress(); cy.get("@timePicker") - .shadow() - .find("ui5-responsive-popover") + .ui5TimePickerGetPopover() .find(".ui5-valuestatemessage-header") .should("exist") .and("have.class", "ui5-valuestatemessage--error"); diff --git a/packages/main/cypress/support/commands.ts b/packages/main/cypress/support/commands.ts index fcedfcc70e5f..b9b314a626d6 100644 --- a/packages/main/cypress/support/commands.ts +++ b/packages/main/cypress/support/commands.ts @@ -86,11 +86,6 @@ declare global { ui5DatePickerGetMonthButton(): Chainable> ui5DatePickerGetYearButton(): Chainable> ui5DatePickerValueHelpIconPress(): Chainable - ui5TimePickerGetInnerInput(): Chainable> - ui5TimePickerValueHelpIconPress(): Chainable - ui5TimePickerGetPopover(): Chainable> - ui5TimePickerGetClock(clockType: string): Chainable> - ui5TimePickerGetSubmitButton(): Chainable> ui5SegmentedButtonItemToggleSelect(deselect?: boolean): Chainable ui5SegmentedButtonFocusFirstItem(): Chainable ui5TimeSelectionClocksInnerButton(name: string, index: number): Chainable> diff --git a/packages/main/cypress/support/commands/TimePicker.commands.ts b/packages/main/cypress/support/commands/TimePicker.commands.ts index bcd5aef85a41..56cc9e65465a 100644 --- a/packages/main/cypress/support/commands/TimePicker.commands.ts +++ b/packages/main/cypress/support/commands/TimePicker.commands.ts @@ -4,7 +4,7 @@ Cypress.Commands.add("ui5TimePickerGetInnerInput", { prevSubject: true }, subjec cy.get("@timePicker") .shadow() - .find("ui5-datetime-input") + .find("[ui5-datetime-input]") .shadow() .find("input") .as("innerInput"); @@ -18,7 +18,7 @@ Cypress.Commands.add("ui5TimePickerValueHelpIconPress", { prevSubject: true }, s cy.get("@timePicker") .shadow() - .find("ui5-datetime-input") + .find("[ui5-datetime-input]") .find(".ui5-time-picker-input-icon-button") .realClick(); }); @@ -32,7 +32,7 @@ Cypress.Commands.add("ui5TimePickerGetPopover", { prevSubject: true }, subject = return cy.get("@timePicker") .shadow() - .find("ui5-responsive-popover") + .find("[ui5-responsive-popover]") .should("be.visible"); }); @@ -45,8 +45,8 @@ Cypress.Commands.add("ui5TimePickerGetClock", { prevSubject: true }, (subject, c return cy.get("@timePicker") .shadow() - .find("ui5-responsive-popover") - .find("ui5-time-selection-clocks") + .find("[ui5-responsive-popover]") + .find("[ui5-time-selection-clocks]") .shadow() .find(`ui5-toggle-spin-button[data-ui5-clock="${clockType}"]`); }); @@ -60,7 +60,7 @@ Cypress.Commands.add("ui5TimePickerGetSubmitButton", { prevSubject: true }, subj return cy.get("@timePicker") .shadow() - .find("ui5-responsive-popover") + .find("[ui5-responsive-popover]") .find("#submit"); }); From 8bf38e6c4387f5f9fdabfe8ecd2ec41d0b1c36ff Mon Sep 17 00:00:00 2001 From: Stoyan Date: Tue, 17 Jun 2025 11:41:06 +0300 Subject: [PATCH 4/5] chore: correct test types --- packages/main/cypress/specs/TimePicker.cy.tsx | 62 +++++++++---------- .../support/commands/TimePicker.commands.ts | 22 ++++--- 2 files changed, 45 insertions(+), 39 deletions(-) diff --git a/packages/main/cypress/specs/TimePicker.cy.tsx b/packages/main/cypress/specs/TimePicker.cy.tsx index 08935617321b..983746356fb7 100644 --- a/packages/main/cypress/specs/TimePicker.cy.tsx +++ b/packages/main/cypress/specs/TimePicker.cy.tsx @@ -18,7 +18,7 @@ describe("TimePicker Tests", () => { cy.mount(); - cy.get("[ui5-time-picker]") + cy.get("[ui5-time-picker]") .as("timePicker"); cy.get("@timePicker") @@ -34,7 +34,7 @@ describe("TimePicker Tests", () => { it("tests clocks value", () => { cy.mount(); - cy.get("[ui5-time-picker]") + cy.get("[ui5-time-picker]") .as("timePicker") .ui5TimePickerValueHelpIconPress(); @@ -54,11 +54,11 @@ describe("TimePicker Tests", () => { it("tests clocks submit value", () => { cy.mount(); - cy.get("[ui5-time-picker]") + cy.get("[ui5-time-picker]") .as("timePicker") .ui5TimePickerValueHelpIconPress(); - cy.get("@timePicker") + cy.get("@timePicker") .ui5TimePickerGetClock("hours") .realClick() .should("be.focused") @@ -67,7 +67,7 @@ describe("TimePicker Tests", () => { pressKeyNTimes("ArrowDown", 2); cy.realPress("Space"); - cy.get("@timePicker") + cy.get("@timePicker") .ui5TimePickerGetClock("minutes"); pressKeyNTimes("ArrowDown", 5); @@ -75,7 +75,7 @@ describe("TimePicker Tests", () => { cy.realPress("Space"); - cy.get("@timePicker") + cy.get("@timePicker") .ui5TimePickerGetClock("seconds"); pressKeyNTimes("ArrowUp", 4); @@ -83,14 +83,14 @@ describe("TimePicker Tests", () => { cy.realPress("Tab"); cy.realPress("Enter"); - cy.get("@timePicker") + cy.get("@timePicker") .should("have.value", "10:57:05"); }); it("tests submit wrong value", () => { cy.mount(); - cy.get("[ui5-time-picker]") + cy.get("[ui5-time-picker]") .as("timePicker") .ui5TimePickerGetInnerInput() .realClick() @@ -108,14 +108,14 @@ describe("TimePicker Tests", () => { it("tests change event", () => { cy.mount(); - cy.get("[ui5-time-picker]") + cy.get("[ui5-time-picker]") .as("timePicker"); // Open picker and submit without changes - cy.get("@timePicker") + cy.get("@timePicker") .ui5TimePickerValueHelpIconPress(); - cy.get("@timePicker") + cy.get("@timePicker") .ui5TimePickerGetSubmitButton() .realClick(); @@ -123,10 +123,10 @@ describe("TimePicker Tests", () => { cy.get("@changeStub").should("not.have.been.called"); // Open picker, change time and submit - cy.get("@timePicker") + cy.get("@timePicker") .ui5TimePickerValueHelpIconPress(); - cy.get("@timePicker") + cy.get("@timePicker") .ui5TimePickerGetClock("hours") .realClick() .should("be.focused") @@ -136,7 +136,7 @@ describe("TimePicker Tests", () => { pressKeyNTimes("ArrowDown", 2); cy.realPress("Space"); - cy.get("@timePicker") + cy.get("@timePicker") .ui5TimePickerGetSubmitButton() .realClick(); @@ -144,10 +144,10 @@ describe("TimePicker Tests", () => { cy.get("@changeStub").should("have.been.calledOnce"); // Open picker and submit without changes - cy.get("@timePicker") + cy.get("@timePicker") .ui5TimePickerValueHelpIconPress(); - cy.get("@timePicker") + cy.get("@timePicker") .ui5TimePickerGetSubmitButton() .realClick(); @@ -155,17 +155,17 @@ describe("TimePicker Tests", () => { cy.get("@changeStub").should("have.been.calledOnce"); // Open picker, change time and submit - cy.get("@timePicker") + cy.get("@timePicker") .ui5TimePickerValueHelpIconPress(); - cy.get("@timePicker") + cy.get("@timePicker") .ui5TimePickerGetClock("hours") .realClick() .should("be.focused") .realPress("ArrowDown") // select 00 .realPress("Space"); - cy.get("@timePicker") + cy.get("@timePicker") .ui5TimePickerGetSubmitButton() .realClick(); @@ -173,7 +173,7 @@ describe("TimePicker Tests", () => { cy.get("@changeStub").should("have.been.calledTwice"); // Test direct input change - cy.get("@timePicker") + cy.get("@timePicker") .ui5TimePickerGetInnerInput() .realClick() .should("be.focused") @@ -188,7 +188,7 @@ describe("TimePicker Tests", () => { it("tests value state", () => { cy.mount(); - cy.get("[ui5-time-picker]") + cy.get("[ui5-time-picker]") .as("timePicker") .ui5TimePickerGetInnerInput() .realClick(); @@ -210,7 +210,7 @@ describe("TimePicker Tests", () => { it("tests input keyboard handling", () => { cy.mount(); - cy.get("[ui5-time-picker]") + cy.get("[ui5-time-picker]") .as("timePicker") .ui5TimePickerGetInnerInput() .realClick() @@ -275,7 +275,7 @@ describe("TimePicker Tests", () => { it("test closing the picker with the keyboard", () => { cy.mount(); - cy.get("[ui5-time-picker]") + cy.get("[ui5-time-picker]") .as("timePicker") .ui5TimePickerValueHelpIconPress(); @@ -288,7 +288,7 @@ describe("TimePicker Tests", () => { it("the value 'now' returns the current time, instead of the string 'now'", () => { cy.mount(); - cy.get("[ui5-time-picker]") + cy.get("[ui5-time-picker]") .as("timePicker") .ui5TimePickerGetInnerInput() .realClick() @@ -304,7 +304,7 @@ describe("TimePicker Tests", () => { it("opening time picker's value-help, sets the 'open' property to true", () => { cy.mount(); - cy.get("[ui5-time-picker]") + cy.get("[ui5-time-picker]") .as("timePicker") .ui5TimePickerValueHelpIconPress(); @@ -319,7 +319,7 @@ describe("TimePicker Tests", () => { it("setting time picker's open property to true, opens the value-help", () => { cy.mount(); - cy.get("[ui5-time-picker]") + cy.get("[ui5-time-picker]") .as("timePicker"); cy.get("@timePicker") @@ -333,7 +333,7 @@ describe("TimePicker Tests", () => { it("picker popover should have accessible name", () => { cy.mount(); - cy.get("[ui5-time-picker]") + cy.get("[ui5-time-picker]") .as("timePicker") .ui5TimePickerGetInnerInput() .realClick() @@ -353,7 +353,7 @@ describe("TimePicker Tests", () => { ); - cy.get("[ui5-time-picker]") + cy.get("[ui5-time-picker]") .ui5TimePickerGetInnerInput() .should("have.attr", "aria-label", "Pick a time"); }); @@ -361,7 +361,7 @@ describe("TimePicker Tests", () => { it("should apply aria-label from the accessibleName property", () => { cy.mount(); - cy.get("[ui5-time-picker]") + cy.get("[ui5-time-picker]") .ui5TimePickerGetInnerInput() .should("have.attr", "aria-label", "Pick a time"); }); @@ -369,11 +369,11 @@ describe("TimePicker Tests", () => { it("displays value state message header in popover when value state is set", () => { cy.mount(); - cy.get("[ui5-time-picker]") + cy.get("[ui5-time-picker]") .as("timePicker") .ui5TimePickerValueHelpIconPress(); - cy.get("@timePicker") + cy.get("@timePicker") .ui5TimePickerGetPopover() .find(".ui5-valuestatemessage-header") .should("exist") diff --git a/packages/main/cypress/support/commands/TimePicker.commands.ts b/packages/main/cypress/support/commands/TimePicker.commands.ts index 56cc9e65465a..23519781fa3a 100644 --- a/packages/main/cypress/support/commands/TimePicker.commands.ts +++ b/packages/main/cypress/support/commands/TimePicker.commands.ts @@ -1,3 +1,6 @@ +import Button from "../../../src/Button.js"; +import TimePicker from "../../../src/TimePicker.js"; + Cypress.Commands.add("ui5TimePickerGetInnerInput", { prevSubject: true }, subject => { cy.wrap(subject) .as("timePicker"); @@ -21,6 +24,9 @@ Cypress.Commands.add("ui5TimePickerValueHelpIconPress", { prevSubject: true }, s .find("[ui5-datetime-input]") .find(".ui5-time-picker-input-icon-button") .realClick(); + + cy.get("@timePicker") + .ui5TimePickerGetPopover(); }); Cypress.Commands.add("ui5TimePickerGetPopover", { prevSubject: true }, subject => { @@ -68,21 +74,21 @@ declare global { namespace Cypress { interface Chainable { ui5TimePickerGetInnerInput( - this: Chainable> - ): Chainable>; + this: Chainable> + ): Chainable>; ui5TimePickerValueHelpIconPress( - this: Chainable> + this: Chainable> ): Chainable; ui5TimePickerGetPopover( - this: Chainable> + this: Chainable> ): Chainable>; ui5TimePickerGetClock( - this: Chainable>, + this: Chainable>, clockType: string - ): Chainable>; + ): Chainable>; ui5TimePickerGetSubmitButton( - this: Chainable> - ): Chainable>; + this: Chainable> + ): Chainable>; } } } \ No newline at end of file From c68cdf3a021a5a8f547d99cbe7c6cb6aae90ebda Mon Sep 17 00:00:00 2001 From: Stoyan Date: Wed, 18 Jun 2025 16:24:47 +0300 Subject: [PATCH 5/5] test: address comments --- packages/main/cypress/specs/TimePicker.cy.tsx | 26 +++++++++++++------ .../support/commands/TimePicker.commands.ts | 19 -------------- 2 files changed, 18 insertions(+), 27 deletions(-) diff --git a/packages/main/cypress/specs/TimePicker.cy.tsx b/packages/main/cypress/specs/TimePicker.cy.tsx index 983746356fb7..c213f7d8c17c 100644 --- a/packages/main/cypress/specs/TimePicker.cy.tsx +++ b/packages/main/cypress/specs/TimePicker.cy.tsx @@ -2,6 +2,7 @@ import "../../src/Assets.js"; import { setLanguage } from "@ui5/webcomponents-base/dist/config/Language.js"; import TimePicker from "../../src/TimePicker.js"; import Label from "../../src/Label.js"; +import ResponsivePopover from "../../src/ResponsivePopover.js"; function pressKeyNTimes(key: "ArrowDown" | "ArrowUp" | "Space" | "Tab" | "Enter", n: number) { for (let i = 0; i < n; i++) { @@ -310,10 +311,6 @@ describe("TimePicker Tests", () => { cy.get("@timePicker") .should("have.attr", "open"); - - cy.get("@timePicker") - .ui5TimePickerGetPopover() - .should("have.attr", "open"); }); it("setting time picker's open property to true, opens the value-help", () => { @@ -326,8 +323,9 @@ describe("TimePicker Tests", () => { .invoke("prop", "open", true); cy.get("@timePicker") - .ui5TimePickerGetPopover() - .should("have.attr", "open"); + .shadow() + .find("[ui5-responsive-popover]") + .ui5ResponsivePopoverOpened() }); it("picker popover should have accessible name", () => { @@ -341,7 +339,13 @@ describe("TimePicker Tests", () => { .realPress("F4"); cy.get("@timePicker") - .ui5TimePickerGetPopover() + .shadow() + .find("[ui5-responsive-popover]") + .ui5ResponsivePopoverOpened(); + + cy.get("@timePicker") + .shadow() + .find("[ui5-responsive-popover]") .should("have.attr", "accessible-name", "Choose Time"); }); @@ -374,7 +378,13 @@ describe("TimePicker Tests", () => { .ui5TimePickerValueHelpIconPress(); cy.get("@timePicker") - .ui5TimePickerGetPopover() + .shadow() + .find("[ui5-responsive-popover]") + .ui5ResponsivePopoverOpened(); + + cy.get("@timePicker") + .shadow() + .find("[ui5-responsive-popover]") .find(".ui5-valuestatemessage-header") .should("exist") .and("have.class", "ui5-valuestatemessage--error"); diff --git a/packages/main/cypress/support/commands/TimePicker.commands.ts b/packages/main/cypress/support/commands/TimePicker.commands.ts index 23519781fa3a..fb341547115b 100644 --- a/packages/main/cypress/support/commands/TimePicker.commands.ts +++ b/packages/main/cypress/support/commands/TimePicker.commands.ts @@ -24,22 +24,6 @@ Cypress.Commands.add("ui5TimePickerValueHelpIconPress", { prevSubject: true }, s .find("[ui5-datetime-input]") .find(".ui5-time-picker-input-icon-button") .realClick(); - - cy.get("@timePicker") - .ui5TimePickerGetPopover(); -}); - -Cypress.Commands.add("ui5TimePickerGetPopover", { prevSubject: true }, subject => { - cy.wrap(subject) - .as("timePicker"); - - cy.get("@timePicker") - .should("have.attr", "open"); - - return cy.get("@timePicker") - .shadow() - .find("[ui5-responsive-popover]") - .should("be.visible"); }); Cypress.Commands.add("ui5TimePickerGetClock", { prevSubject: true }, (subject, clockType) => { @@ -79,9 +63,6 @@ declare global { ui5TimePickerValueHelpIconPress( this: Chainable> ): Chainable; - ui5TimePickerGetPopover( - this: Chainable> - ): Chainable>; ui5TimePickerGetClock( this: Chainable>, clockType: string