fix(gravatar): broken proxy

Author: harlan-zw

package.json

@@ -145,6 +145,7 @@
     "@nuxt/test-utils": "catalog:",
     "@nuxtjs/partytown": "catalog:",
     "@paypal/paypal-js": "catalog:",
+    "@types/jest-image-snapshot": "^6.4.1",
     "@types/semver": "catalog:",
     "@types/youtube": "catalog:",
     "@typescript-eslint/typescript-estree": "catalog:",
@@ -153,6 +154,7 @@
     "eslint": "catalog:",
     "eslint-plugin-harlanzw": "catalog:",
     "happy-dom": "catalog:",
+    "jest-image-snapshot": "^6.5.2",
     "knitwork": "catalog:",
     "nuxt": "catalog:",
     "playwright-core": "catalog:",

pnpm-lock.yaml

@@ -25,15 +25,15 @@ catalog:
   consola: ^3.4.2
   defu: ^6.1.4
   eslint: ^10.0.3
-  eslint-plugin-harlanzw: ^0.6.0
+  eslint-plugin-harlanzw: ^0.6.1
   h3: ^1.15.8
   happy-dom: ^20.8.4
   knitwork: ^1.3.0
   magic-string: ^0.30.21
   nuxt: ^4.4.2
   ofetch: ^1.5.1
   ohash: ^2.0.11
-  oxc-parser: ^0.120.0
+  oxc-parser: ^0.121.0
   oxc-walker: ^0.7.0
   pathe: ^2.0.3
   pkg-types: ^2.3.0

pnpm-workspace.yaml

@@ -39,7 +39,6 @@ export default defineEventHandler(async (event) => {
   })
 
   const response = await $fetch.raw(gravatarUrl, {
-    responseType: 'arrayBuffer',
     headers: {
       'User-Agent': 'Nuxt Scripts Gravatar Proxy',
     },

src/runtime/server/gravatar-proxy.ts

@@ -178,7 +178,7 @@ describe('basic', () => {
     await page.waitForTimeout(500)
     // get content of #script-src
     const text = await page.$eval('#script-src', el => el.textContent)
-    expect(text).toMatchInlineSnapshot(`"/_scripts/assets/6bEy8slcRmYcRT4E2QbQZ1CMyWw9PpHA7L87BtvSs2U.js"`)
+    expect(text).toMatchInlineSnapshot(`"/_scripts/assets/PHzhM8DFXcXVSSJF110cyV3pjg9cp8oWv_f4Dk2ax1w.js"`)
   })
   it('partytown adds type attribute', async () => {
     const { page } = await createPage('/partytown')
@@ -234,6 +234,60 @@ describe('youtube', () => {
   })
 })
 
+describe('gravatar', () => {
+  async function expectImageSnapshot(buffer: Buffer, id: string) {
+    const { toMatchImageSnapshot } = await import('jest-image-snapshot')
+    expect.extend({ toMatchImageSnapshot })
+    ;(expect(buffer) as any).toMatchImageSnapshot({
+      customSnapshotIdentifier: id,
+      customSnapshotsDir: `${import.meta.dirname}/__image_snapshots__`,
+    })
+  }
+
+  it('proxy returns valid image for email lookup', {
+    timeout: 15000,
+  }, async () => {
+    const response = await fetch(url('/_scripts/proxy/gravatar?email=test@example.com&s=80&d=identicon&r=g'))
+    expect(response.status).toBe(200)
+    expect(response.headers.get('content-type')).toContain('image/')
+    expect(response.headers.get('cache-control')).toContain('public')
+
+    const buffer = Buffer.from(await response.arrayBuffer())
+    expect(buffer.length).toBeGreaterThan(100)
+    await expectImageSnapshot(buffer, 'gravatar-email-proxy')
+  })
+
+  it('proxy returns valid image for hash lookup', {
+    timeout: 15000,
+  }, async () => {
+    // SHA256 of "test@example.com"
+    const hash = '973dfe463ec85785f5f95af5ba3906eedb2d931c24e69824a89ea65dba4e813b'
+    const response = await fetch(url(`/_scripts/proxy/gravatar?hash=${hash}&s=80&d=identicon&r=g`))
+    expect(response.status).toBe(200)
+    expect(response.headers.get('content-type')).toContain('image/')
+
+    const buffer = Buffer.from(await response.arrayBuffer())
+    expect(buffer.length).toBeGreaterThan(100)
+    await expectImageSnapshot(buffer, 'gravatar-hash-proxy')
+  })
+
+  it('email and hash proxy return identical images', {
+    timeout: 15000,
+  }, async () => {
+    const hash = '973dfe463ec85785f5f95af5ba3906eedb2d931c24e69824a89ea65dba4e813b'
+    const [emailRes, hashRes] = await Promise.all([
+      fetch(url('/_scripts/proxy/gravatar?email=test@example.com&s=80&d=identicon&r=g')),
+      fetch(url(`/_scripts/proxy/gravatar?hash=${hash}&s=80&d=identicon&r=g`)),
+    ])
+
+    const emailBuffer = Buffer.from(await emailRes.arrayBuffer())
+    const hashBuffer = Buffer.from(await hashRes.arrayBuffer())
+
+    // Same email hashed server-side should produce identical image to pre-computed hash
+    expect(emailBuffer.equals(hashBuffer)).toBe(true)
+  })
+})
+
 describe('third-party-capital', () => {
   it('expect GA to collect data', {
     timeout: 10000,

test/e2e/__image_snapshots__/gravatar-email-proxy.png

@@ -9,6 +9,7 @@ export default defineNuxtConfig({
       xEmbed: true,
       instagramEmbed: true,
       blueskyEmbed: true,
+      gravatar: true,
     },
   },
   devtools: {