From e3453de9cbcdea1398fa72ff0a3c318ed898ddec Mon Sep 17 00:00:00 2001 From: Max Skanvik <179694889+max-umain@users.noreply.github.com> Date: Tue, 17 Dec 2024 10:46:49 +0100 Subject: [PATCH] test(stepper): add darkmode screenshot test and refactor folder structure --- .../darkmode/index.html | 39 ++++++++++++++++++ .../{ => darkmode}/stepper.e2e.ts | 5 ++- ...tal-with-text-below---darkmode-1-linux.png | Bin 0 -> 13648 bytes .../{ => lightmode}/index.html | 5 ++- .../lightmode/stepper.e2e.ts | 13 ++++++ ...l-with-text-below---lightmode-1-linux.png} | Bin 6 files changed, 58 insertions(+), 4 deletions(-) create mode 100644 packages/core/src/components/stepper/test/large-horizontal-text-below/darkmode/index.html rename packages/core/src/components/stepper/test/large-horizontal-text-below/{ => darkmode}/stepper.e2e.ts (66%) create mode 100644 packages/core/src/components/stepper/test/large-horizontal-text-below/darkmode/stepper.e2e.ts-snapshots/Stepper---Large-horizontal-with-text-below---darkmode-1-linux.png rename packages/core/src/components/stepper/test/large-horizontal-text-below/{ => lightmode}/index.html (85%) create mode 100644 packages/core/src/components/stepper/test/large-horizontal-text-below/lightmode/stepper.e2e.ts rename packages/core/src/components/stepper/test/large-horizontal-text-below/{stepper.e2e.ts-snapshots/Stepper---Large-horizontal-with-text-below-1-linux.png => lightmode/stepper.e2e.ts-snapshots/Stepper---Large-horizontal-with-text-below---lightmode-1-linux.png} (100%) diff --git a/packages/core/src/components/stepper/test/large-horizontal-text-below/darkmode/index.html b/packages/core/src/components/stepper/test/large-horizontal-text-below/darkmode/index.html new file mode 100644 index 000000000..5b15e48e3 --- /dev/null +++ b/packages/core/src/components/stepper/test/large-horizontal-text-below/darkmode/index.html @@ -0,0 +1,39 @@ + + + + + + + Stepper - Large horizontal text below + + + + + + + +
Success step
+ + +
Error step
+ + +
Current step
+ + +
Upcoming step
+ + + + diff --git a/packages/core/src/components/stepper/test/large-horizontal-text-below/stepper.e2e.ts b/packages/core/src/components/stepper/test/large-horizontal-text-below/darkmode/stepper.e2e.ts similarity index 66% rename from packages/core/src/components/stepper/test/large-horizontal-text-below/stepper.e2e.ts rename to packages/core/src/components/stepper/test/large-horizontal-text-below/darkmode/stepper.e2e.ts index cb934fbd8..83e508ee3 100644 --- a/packages/core/src/components/stepper/test/large-horizontal-text-below/stepper.e2e.ts +++ b/packages/core/src/components/stepper/test/large-horizontal-text-below/darkmode/stepper.e2e.ts @@ -1,10 +1,11 @@ import { test } from 'stencil-playwright'; import { expect } from '@playwright/test'; -const componentTestPath = 'src/components/stepper/test/large-horizontal-text-below/index.html'; +const componentTestPath = + 'src/components/stepper/test/large-horizontal-text-below/darkmode/index.html'; //Test if component renders and take a screenshot of the component -test('Stepper - Large horizontal with text below', async ({ page }) => { +test('Stepper - Large horizontal with text below - darkmode', async ({ page }) => { await page.goto(componentTestPath); const stepper = page.locator('[data-testid="tds-stepper-testid"]'); await stepper.waitFor({ state: 'visible' }); diff --git a/packages/core/src/components/stepper/test/large-horizontal-text-below/darkmode/stepper.e2e.ts-snapshots/Stepper---Large-horizontal-with-text-below---darkmode-1-linux.png b/packages/core/src/components/stepper/test/large-horizontal-text-below/darkmode/stepper.e2e.ts-snapshots/Stepper---Large-horizontal-with-text-below---darkmode-1-linux.png new file mode 100644 index 0000000000000000000000000000000000000000..a7a70cb4c0f2da28df0966c479f9fca84a25e798 GIT binary patch literal 13648 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 Stepper - Large horizontal text below - + + { + await page.goto(componentTestPath); + const stepper = page.locator('[data-testid="tds-stepper-testid"]'); + await stepper.waitFor({ state: 'visible' }); + await expect(page).toHaveScreenshot({ maxDiffPixels: 0 }); +}); diff --git a/packages/core/src/components/stepper/test/large-horizontal-text-below/stepper.e2e.ts-snapshots/Stepper---Large-horizontal-with-text-below-1-linux.png b/packages/core/src/components/stepper/test/large-horizontal-text-below/lightmode/stepper.e2e.ts-snapshots/Stepper---Large-horizontal-with-text-below---lightmode-1-linux.png similarity index 100% rename from packages/core/src/components/stepper/test/large-horizontal-text-below/stepper.e2e.ts-snapshots/Stepper---Large-horizontal-with-text-below-1-linux.png rename to packages/core/src/components/stepper/test/large-horizontal-text-below/lightmode/stepper.e2e.ts-snapshots/Stepper---Large-horizontal-with-text-below---lightmode-1-linux.png