test fixture

[markacianfrani]

Brief Description

Lots of file changes because I had to rename our snapshot files and regenerate them.

We want to have VRTs for light theme in addition to dark theme. Currently, our light theme tests require us to duplicate our dark theme tests:

    test('has no visual regression @vrt @dark', async ({ page }) => {
        await page.goto(`/src/components/rux-accordion/test/basic/index.html`)
        await expect(page).toHaveScreenshot()
    })

    test('has no visual regression @vrt @light', async ({ page }) => {
        await page.goto(`/src/components/rux-accordion/test/basic/index.html`)
        await page.evaluate(() => {
            document.body.classList.add('light-theme')
        })
        await expect(page).toHaveScreenshot()
 }

this worked fine for simple basic tests, however, once we start adding more tests for things like hover and focus state, it will get out of hand quickly having to duplicate those as well.

this PR creates a new fixture that will automatically run all the of VRTs twice, one for dark, one for light, off one single test and reduces the above to:

    test.use({ component: 'rux-accordion' })

    test('has no visual regression @vrt', async ({ astroVRTPage }) => {
        await expect(astroVRTPage).toHaveScreenshot()
    })

General Notes

It works by using Playwright's Parameters. I've split our project into three: 1 for regular e2e, 1 for dark theme, 1 for light theme. The project config in playwright.config.ts is responsible for changing the theme parameter for each. The fixture is responsible for checking if the theme is light, and then appends the light-theme body class.

Issues and Limitations

If we go beyond simple, basic test folder structure, we'll need to add another param for that.

Types of changes

• [ ] Bug fix
• [x] New feature
• [ ] Breaking change

Checklist

• [ ] This PR adds or removes a Storybook story.
• [ ] I have added tests to cover my changes.
• [ ] Regressions are passing and/or failures are documented
• [ ] Changes have been checked in evergreen browsers

[changeset-bot[bot]]

⚠️ No Changeset found

Latest commit: bad455831b23ab5e821ead921579602a55c078b4

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

[netlify[bot]]

✅ Deploy Preview for astro-stencil ready!

Name	Link
🔨 Latest commit	bad455831b23ab5e821ead921579602a55c078b4
🔍 Latest deploy log	https://app.netlify.com/sites/astro-stencil/deploys/63cef728f178ab0008d78411
😎 Deploy Preview	https://deploy-preview-1026--astro-stencil.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site settings.

[netlify[bot]]

✅ Deploy Preview for astro-preview ready!

Name	Link
🔨 Latest commit	bad455831b23ab5e821ead921579602a55c078b4
🔍 Latest deploy log	https://app.netlify.com/sites/astro-preview/deploys/63cef728a46f4100088d072c
😎 Deploy Preview	https://deploy-preview-1026--astro-preview.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site settings.