@dargmuesli/nuxt-vio-testing 20.6.2 → 20.6.4

package/e2e/fixtures/vioTest.ts

@@ -0,0 +1,64 @@
+import { type Page, test, expect } from '@playwright/test'
+
+const createDefaultPage = (page: Page) => {
+  return {
+    page,
+    goto: async (
+      url: string,
+      options?: {
+        cookieControl?: boolean
+        isLoading?: boolean
+      },
+    ) => {
+      await page.goto(url)
+
+      // if (!options || options.cookieControl !== false) {
+      //   await expect(
+      //     page.getByRole('button', { name: 'Cookie control' }),
+      //   ).toBeVisible()
+      // }
+
+      if (!options || options.isLoading !== false) {
+        await expect(page.getByTestId('is-loading')).toHaveAttribute(
+          'data-is-loading',
+          'false',
+        )
+      }
+    },
+  }
+}
+
+export const vioTest = test.extend<{
+  defaultPage: ReturnType<typeof createDefaultPage>
+  _autoSnapshotSuffix: unknown
+}>({
+  defaultPage: async ({ page, context }, use) => {
+    await context.addCookies([
+      {
+        domain: 'localhost',
+        name: 'vio_is-testing',
+        path: '/',
+        value: 'true',
+      },
+      {
+        domain: 'localhost',
+        name: 'vio_tz',
+        path: '/',
+        value: 'Europe/Berlin',
+      },
+      {
+        domain: 'localhost',
+        name: 'ncc_c',
+        path: '/',
+        value: 'ctga',
+      },
+    ])
+
+    const defaultPage = createDefaultPage(page)
+
+    await use(defaultPage)
+
+    // After use a cleanup function could be run for data that has been created for the test
+    // await cleanup()
+  },
+})

package/e2e/utils/constants.ts

@@ -1,7 +1,6 @@
 import { expect } from '@playwright/test'
 import type { Page } from 'playwright-core'
 
-export const COOKIE_CONTROL_CONSENT_COOKIE_DEFAULT = 'ctga'
 export const TIMEOUT = 60000
 export const PAGE_READY = async ({
   page,

package/e2e/utils/tests.ts

@@ -1,7 +1,35 @@
+import AxeBuilder from '@axe-core/playwright'
 import { expect, type Page } from '@playwright/test'
 import { joinURL, withoutTrailingSlash } from 'ufo'
 
-import { SITE_URL } from '#tests/e2e/utils/constants'
+// the following imports cannot use the #tests alias because downstream consumers of this package typically cannot resolve that alias
+import { vioTest } from '../fixtures/vioTest'
+import { SITE_URL, TIMEOUT } from '../utils/constants'
+
+export const testA11y = (url: string) =>
+  vioTest.describe('a11y', () => {
+    vioTest(
+      'should not have any automatically detectable accessibility issues',
+      async ({ defaultPage }) => {
+        await defaultPage.goto(url)
+
+        const accessibilityScanResults = await new AxeBuilder({
+          page: defaultPage.page,
+        }).analyze()
+
+        expect(
+          accessibilityScanResults.violations
+            .map(
+              (x) =>
+                `${x.id}\n${x.nodes.map(
+                  (y) => `${y.failureSummary}\n(${y.html}\n(${y.target})`,
+                )}`,
+            )
+            .join('\n'),
+        ).toEqual('')
+      },
+    )
+  })
 
 export const testMetadata = async ({
   page,
@@ -512,3 +540,45 @@ export const testMetadata = async ({
   //   ).toMatchSnapshot(`content-security-policy.txt`)
   // }
 }
+
+export const testOgImage = (url: string) =>
+  vioTest.describe('visual regression', () => {
+    vioTest('generates the open graph image', async ({ page }) => {
+      await page.goto(
+        joinURL(
+          `/__og-image__/${process.env.VIO_SERVER === 'static' ? 'static' : 'image'}${url}/og.png`,
+        ),
+      )
+      await expect(page).toHaveScreenshot()
+
+      await page.goto(
+        joinURL(
+          `/__og-image__/${process.env.VIO_SERVER === 'static' ? 'static' : 'image'}/de${url}/og.png`,
+        ),
+      )
+      await expect(page).toHaveScreenshot()
+    })
+  })
+
+export const testPageLoad = (url: string, status = 200) =>
+  vioTest.describe('page load', () => {
+    vioTest('loads the page successfully', async ({ request }) => {
+      const resp = await request.get(url, {
+        headers: {
+          Cookie: 'vio_is-testing=true',
+        },
+      })
+      expect(resp.status()).toBe(status)
+    })
+  })
+
+export const testVisualRegression = (url: string, plain?: boolean) =>
+  vioTest.describe('visual regression', () => {
+    vioTest('looks as before', async ({ defaultPage, page }) => {
+      await (plain ? page : defaultPage).goto(url)
+
+      await expect(plain ? page : defaultPage.page).toHaveScreenshot({
+        timeout: TIMEOUT,
+      })
+    })
+  })

package/package.json

@@ -3,7 +3,7 @@
     "@axe-core/playwright": "4.11.1",
     "@eslint/js": "9.39.2",
     "@playwright/test": "1.58.2",
-    "@types/node": "24.10.11",
+    "@types/node": "24.10.12",
     "cross-env": "10.1.0",
     "eslint": "9.39.2",
     "eslint-config-prettier": "10.1.8",
@@ -54,5 +54,5 @@
     "test:e2e:server:static": "cross-env NODE_ENV=production PORT=3002 NUXT_PUBLIC_SITE_URL=https://localhost:3002 VIO_SERVER=static pnpm run test:e2e"
   },
   "type": "module",
-  "version": "20.6.2"
+  "version": "20.6.4"
 }

package/playwright.config.ts

@@ -1,7 +1,6 @@
 import { defineConfig, devices } from '@playwright/test'
 
-import { SITE_URL } from '#src/node/static'
-import { TIMEOUT } from '#tests/e2e/utils/constants'
+import { SITE_URL, TIMEOUT } from '#tests/e2e/utils/constants' // importing from `src` does not work with the test module release
 
 /**
  * Read environment variables from file.

package/tsconfig.json

@@ -3,8 +3,6 @@
     "module": "ESNext",
     "moduleResolution": "Bundler",
     "paths": {
-      "~/*": ["../src/*"],
-      "#src/*": ["../src/*"],
       "#tests/*": ["./*"]
     },
     "target": "ESNext",