test: update og image test (but skip it for now)

Author: danielroe

nuxt.config.ts

@@ -90,7 +90,6 @@ export default defineNuxtConfig({
   ogImage: {
     defaults: {
       component: 'Default',
-
     },
   },
 

package.json

@@ -22,7 +22,7 @@
     "test:nuxt": "vitest --project nuxt",
     "test:browser": "playwright test",
     "test:browser:ui": "playwright test --ui",
-    "test:browser:update": "docker run --rm --network host -v $(pwd):/work/ -v /tmp/playwright-node-modules:/work/node_modules -w /work/ -it mcr.microsoft.com/playwright:v1.55.0-noble bash -c 'corepack enable && pnpm i && pnpm playwright test test/browser --update-snapshots'"
+    "test:browser:update": "playwright test --update-snapshots"
   },
   "dependencies": {
     "@nuxt/eslint": "^1.12.1",

playwright.config.ts

@@ -9,6 +9,7 @@ export default defineConfig<ConfigOptions>({
   retries: process.env.CI ? 2 : 0,
   workers: process.env.CI ? 1 : undefined,
   reporter: 'html',
+  timeout: 120_000,
   use: {
     trace: 'on-first-retry',
     nuxt: {

tests/index.spec.ts

@@ -0,0 +1,23 @@
+import { expect, test } from '@nuxt/test-utils/playwright'
+
+const paths = ['/', '/package/nuxt/v/3.20.2']
+for (const path of paths) {
+  test.describe(path, () => {
+    test.skip(`og image for ${path}`, async ({ page, goto, baseURL }) => {
+      await goto(path, { waitUntil: 'domcontentloaded' })
+
+      const ogImageUrl = await page.locator('meta[property="og:image"]').getAttribute('content')
+      expect(ogImageUrl).toBeTruthy()
+
+      const ogImagePath = new URL(ogImageUrl!).pathname
+      const localUrl = baseURL?.endsWith('/') ? `${baseURL}${ogImagePath.slice(1)}` : `${baseURL}${ogImagePath}`
+      const response = await page.request.get(localUrl)
+
+      expect(response.status()).toBe(200)
+      expect(response.headers()['content-type']).toContain('image/png')
+
+      const imageBuffer = await response.body()
+      expect(imageBuffer).toMatchSnapshot({ name: `og-image-for-${path.replace(/\//g, '-')}.png` })
+    })
+  })
+}