From 699eb1e85f9897a8c046a4c439885981372c6c79 Mon Sep 17 00:00:00 2001 From: Atharv Chandratre Date: Wed, 25 Oct 2023 16:18:06 -0500 Subject: [PATCH 1/5] chore(demo-playwright): test for `table-bars-service` (#9) chore(demo-playwright): test for table-bars-service --- .../addon-mobile/mobile-calendar/mobile-calendar.spec.ts | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/projects/demo-playwright/tests/addon-mobile/mobile-calendar/mobile-calendar.spec.ts b/projects/demo-playwright/tests/addon-mobile/mobile-calendar/mobile-calendar.spec.ts index a1cb1933bd88..935fdd7d0ccf 100644 --- a/projects/demo-playwright/tests/addon-mobile/mobile-calendar/mobile-calendar.spec.ts +++ b/projects/demo-playwright/tests/addon-mobile/mobile-calendar/mobile-calendar.spec.ts @@ -21,6 +21,8 @@ test.describe(`MobileCalendar`, () => { await tuiGoto(page, `components/mobile-calendar/API?max$=1`); const {apiPageExample} = new TuiDocumentationPagePO(page); + + await expect(apiPageExample).toHaveScreenshot(`02-mobile-calendar-disabled.png`); }); @@ -28,6 +30,8 @@ test.describe(`MobileCalendar`, () => { await tuiGoto(page, `components/mobile-calendar/API?max$=0`); const {apiPageExample} = new TuiDocumentationPagePO(page); + + await expect(apiPageExample).toHaveScreenshot(`03-mobile-calendar-enabled.png`); }); }); From 92ee880c5afac0f6c82dd46e79b1c866e3266a78 Mon Sep 17 00:00:00 2001 From: Atharv Chandratre Date: Sun, 19 Nov 2023 17:23:30 -0600 Subject: [PATCH 2/5] chore(demo-playwright): mobile-calendar.spec.ts --- .../addon-mobile/mobile-calendar/mobile-calendar.spec.ts | 4 ---- 1 file changed, 4 deletions(-) diff --git a/projects/demo-playwright/tests/addon-mobile/mobile-calendar/mobile-calendar.spec.ts b/projects/demo-playwright/tests/addon-mobile/mobile-calendar/mobile-calendar.spec.ts index 935fdd7d0ccf..a1cb1933bd88 100644 --- a/projects/demo-playwright/tests/addon-mobile/mobile-calendar/mobile-calendar.spec.ts +++ b/projects/demo-playwright/tests/addon-mobile/mobile-calendar/mobile-calendar.spec.ts @@ -21,8 +21,6 @@ test.describe(`MobileCalendar`, () => { await tuiGoto(page, `components/mobile-calendar/API?max$=1`); const {apiPageExample} = new TuiDocumentationPagePO(page); - - await expect(apiPageExample).toHaveScreenshot(`02-mobile-calendar-disabled.png`); }); @@ -30,8 +28,6 @@ test.describe(`MobileCalendar`, () => { await tuiGoto(page, `components/mobile-calendar/API?max$=0`); const {apiPageExample} = new TuiDocumentationPagePO(page); - - await expect(apiPageExample).toHaveScreenshot(`03-mobile-calendar-enabled.png`); }); }); From cfa012c87b87fa6eeb83ad185353ac8b58ec9ce3 Mon Sep 17 00:00:00 2001 From: Atharv Chandratre Date: Sun, 19 Nov 2023 17:30:36 -0600 Subject: [PATCH 3/5] Playwright button (#15) chore(demo-playwright): button.spec.ts --- .../cypress/tests/core/button/button.cy.ts | 16 -------------- .../tests/core/button/button.spec.ts | 21 +++++++++++++++++++ 2 files changed, 21 insertions(+), 16 deletions(-) delete mode 100644 projects/demo-cypress/cypress/tests/core/button/button.cy.ts create mode 100644 projects/demo-playwright/tests/core/button/button.spec.ts diff --git a/projects/demo-cypress/cypress/tests/core/button/button.cy.ts b/projects/demo-cypress/cypress/tests/core/button/button.cy.ts deleted file mode 100644 index 9295ea899c1a..000000000000 --- a/projects/demo-cypress/cypress/tests/core/button/button.cy.ts +++ /dev/null @@ -1,16 +0,0 @@ -describe(`Button`, () => { - it(`tuiMode=OnDark + appearance=icon + hovered state`, () => { - cy.tuiVisit( - `/components/button/API?tuiMode=onDark&appearance=icon&icon=tuiIconEyeOff`, - ); - - cy.get(`#demo-content`) - .should(`be.visible`) - .find(`[tuiButton]`) - .trigger(`mouseenter`) - .tuiWaitBeforeScreenshot() - .matchImageSnapshot( - `01-[tuiMode=onDark]-[appearance=icon]-[data-state=hovered]`, - ); - }); -}); diff --git a/projects/demo-playwright/tests/core/button/button.spec.ts b/projects/demo-playwright/tests/core/button/button.spec.ts new file mode 100644 index 000000000000..50916dc4d8e8 --- /dev/null +++ b/projects/demo-playwright/tests/core/button/button.spec.ts @@ -0,0 +1,21 @@ +import {TuiDocumentationPagePO, tuiGoto} from '@demo-playwright/utils'; +import {expect, test} from '@playwright/test'; + +test.describe(`Button`, () => { + test(`tuiMode=OnDark + appearance=icon + hovered state`, async ({page}) => { + await tuiGoto( + page, + `/components/button/API?tuiMode=onDark&appearance=icon&icon=tuiIconEyeOff`, + ); + const {apiPageExample} = new TuiDocumentationPagePO(page); + + await apiPageExample.waitFor({state: `visible`}); + const button = apiPageExample.locator(`[tuiButton]`); + + await button.hover(); + + await expect(button).toHaveScreenshot( + `01-[tuiMode=onDark]-[appearance=icon]-[data-state=hovered].png`, + ); + }); +}); From d801711acd90b7ce14d755103f52ee592dfbf57b Mon Sep 17 00:00:00 2001 From: Atharv Chandratre Date: Mon, 20 Nov 2023 12:03:26 -0600 Subject: [PATCH 4/5] chore(demo-playwright): button.spec.ts --- projects/demo-playwright/tests/core/button/button.spec.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/projects/demo-playwright/tests/core/button/button.spec.ts b/projects/demo-playwright/tests/core/button/button.spec.ts index 50916dc4d8e8..bbf4b9c1367e 100644 --- a/projects/demo-playwright/tests/core/button/button.spec.ts +++ b/projects/demo-playwright/tests/core/button/button.spec.ts @@ -9,7 +9,7 @@ test.describe(`Button`, () => { ); const {apiPageExample} = new TuiDocumentationPagePO(page); - await apiPageExample.waitFor({state: `visible`}); + await expect(apiPageExample).toBeVisible(); const button = apiPageExample.locator(`[tuiButton]`); await button.hover(); From eeb524e9f2dc35de47e9736e73e4fbfd475fbd57 Mon Sep 17 00:00:00 2001 From: Atharv Chandratre Date: Wed, 29 Nov 2023 22:51:34 -0600 Subject: [PATCH 5/5] chore(demo-playwright): field-error.spec.ts --- .../tests/kit/field-error/field-error.cy.ts | 15 ---------- .../tests/kit/field-error/field-error.spec.ts | 28 +++++++++++++++++++ 2 files changed, 28 insertions(+), 15 deletions(-) delete mode 100644 projects/demo-cypress/cypress/tests/kit/field-error/field-error.cy.ts create mode 100644 projects/demo-playwright/tests/kit/field-error/field-error.spec.ts diff --git a/projects/demo-cypress/cypress/tests/kit/field-error/field-error.cy.ts b/projects/demo-cypress/cypress/tests/kit/field-error/field-error.cy.ts deleted file mode 100644 index 56005da473e2..000000000000 --- a/projects/demo-cypress/cypress/tests/kit/field-error/field-error.cy.ts +++ /dev/null @@ -1,15 +0,0 @@ -describe(`TuiFieldError`, () => { - it(`Errors of invalid control are shown correctly`, () => { - cy.tuiVisit(`/pipes/field-error`); - - cy.get(`tui-field-error-pipe-example-1 input`) - .first() - .focus() - .wait(50) - .blur() - .tuiGetByExampleId() - .first() - .wait(300) - .matchImageSnapshot(`shows-error-under-field`); - }); -}); diff --git a/projects/demo-playwright/tests/kit/field-error/field-error.spec.ts b/projects/demo-playwright/tests/kit/field-error/field-error.spec.ts new file mode 100644 index 000000000000..c9cdbe886834 --- /dev/null +++ b/projects/demo-playwright/tests/kit/field-error/field-error.spec.ts @@ -0,0 +1,28 @@ +import {tuiGoto} from '@demo-playwright/utils'; +import {expect, test} from '@playwright/test'; + +const {describe} = test; + +describe(`TuiFieldError`, () => { + test(`Errors of invalid control are shown correctly`, async ({page}) => { + await tuiGoto(page, `/pipes/field-error`); + + const errorPipeInput = page + .locator(`tui-field-error-pipe-example-1 input`) + .first(); + + await errorPipeInput.focus(); + + await page.waitForTimeout(50); + + await errorPipeInput.blur(); + + const example = page + .locator(`tui-doc-example [automation-id="tui-doc-example"]`) + .first(); + + await expect(example).toHaveScreenshot(`shows-error-under-field.png`, { + animations: `allow`, + }); + }); +});