Add E2E test for @vercel/og API route (#42258)

This ensures we don't have a fatal error when not necessary and ensures
`@vercel/og` is working as expected.

x-ref: [slack
thread](https://vercel.slack.com/archives/CGU8HUTUH/p1667239940322769?thread_ts=1667238747.240989&cid=CGU8HUTUH)

## Bug

- [ ] Related issues linked using `fixes #number`
- [x] Integration tests added
- [ ] Errors have a helpful link attached, see `contributing.md`

## Feature

- [ ] Implements an existing feature request or RFC. Make sure the
feature request has been accepted for implementation before opening a
PR.
- [ ] Related issues linked using `fixes #number`
- [ ] Integration tests added
- [ ] Documentation added
- [ ] Telemetry added. In case of a feature if it's used or not.
- [ ] Errors have a helpful link attached, see `contributing.md`

## Documentation / Examples

- [ ] Make sure the linting passes by running `pnpm build && pnpm lint`
- [ ] The "examples guidelines" are followed from [our contributing
doc](https://github.com/vercel/next.js/blob/canary/contributing/examples/adding-examples.md)

packages/next/build/utils.ts

@@ -1658,7 +1658,9 @@ export async function copyTracedFiles(
       `${normalizePagePath(page)}.js`
     )
     const pageTraceFile = `${pageFile}.nft.json`
-    await handleTraceFiles(pageTraceFile)
+    await handleTraceFiles(pageTraceFile).catch((err) => {
+      Log.warn(`Failed to copy traced files for ${pageFile}`, err)
+    })
   }
   await handleTraceFiles(path.join(distDir, 'next-server.js.nft.json'))
   const serverOutputPath = path.join(

test/e2e/og-api/app/next.config.js

@@ -0,0 +1,4 @@
+/** @type {import('next').NextConfig} */
+module.exports = {
+  output: 'standalone',
+}

test/e2e/og-api/app/pages/api/og.js

@@ -0,0 +1,26 @@
+// /pages/api/og.jsx
+import { ImageResponse } from '@vercel/og'
+
+export const config = {
+  runtime: 'experimental-edge',
+}
+
+export default function () {
+  return new ImageResponse(
+    (
+      <div
+        style={{
+          width: '100%',
+          height: '100%',
+          display: 'flex',
+          alignItems: 'center',
+          justifyContent: 'center',
+          fontSize: 128,
+          background: 'lavender',
+        }}
+      >
+        Hello!
+      </div>
+    )
+  )
+}

test/e2e/og-api/app/pages/index.js

@@ -0,0 +1,3 @@
+export default function Page() {
+  return <p>hello world</p>
+}

test/e2e/og-api/index.test.ts

@@ -0,0 +1,30 @@
+import { createNext, FileRef } from 'e2e-utils'
+import { NextInstance } from 'test/lib/next-modes/base'
+import { fetchViaHTTP, renderViaHTTP } from 'next-test-utils'
+import { join } from 'path'
+
+describe('og-api', () => {
+  let next: NextInstance
+
+  beforeAll(async () => {
+    next = await createNext({
+      files: new FileRef(join(__dirname, 'app')),
+      dependencies: {
+        '@vercel/og': 'latest',
+      },
+    })
+  })
+  afterAll(() => next.destroy())
+
+  it('should respond from index', async () => {
+    const html = await renderViaHTTP(next.url, '/')
+    expect(html).toContain('hello world')
+  })
+
+  it('should work', async () => {
+    const res = await fetchViaHTTP(next.url, '/api/og')
+    expect(res.status).toBe(200)
+    const body = await res.blob()
+    expect(body.size).toBeGreaterThan(0)
+  })
+})