rsnext/test/e2e/app-dir/app-esm-js/index.test.ts
Jiachi Liu e0399ca6dc
Support next/og usage in ESM nextjs app (#60818)
### What 

Follow up for #59852 , now you can use `next/og` if your nextjs app is
marked as ESM with `"type": "module"` in package.json.

### How

It's a bug in external handling, we shouldn't ESM import error for local
requests. Previously you'll see the below error but the
og import shouldn't be errored as it's not external package

```
Module not found: ESM packages (/.../app/opengraph-image.js) need to be imported. Use 'import' to reference the package instead
 https://nextjs.org/docs/messages/import-esm-externals
```


Closes NEXT-2147
2024-01-18 13:44:50 +01:00

45 lines
1.4 KiB
TypeScript

import { createNextDescribe } from 'e2e-utils'
createNextDescribe(
'app-dir - esm js extension',
{
files: __dirname,
},
({ next }) => {
it('should be able to render nextjs api in app router', async () => {
const $ = await next.render$('/app')
async function validateDomNodes(selector: string) {
expect(await $(`${selector} .img`).prop('tagName')).toBe('IMG')
expect(await $(`${selector} .link`).prop('tagName')).toBe('A')
expect(await $(`${selector} .typeof-getImageProps`).text()).toContain(
'function'
)
}
await validateDomNodes('#with-ext')
await validateDomNodes('#without-ext')
expect($('head link[href="/test-ext.js"]').length).toBe(1)
expect($('head link[href="/test.js"]').length).toBe(1)
})
it('should be able to use nextjs api in pages router', async () => {
const $ = await next.render$('/pages')
expect(await $('meta[name="head-value-1"]').attr('content')).toBe(
'with-ext'
)
expect(await $('meta[name="head-value-2"]').attr('content')).toBe(
'without-ext'
)
expect(await $('.root').text()).toContain('pages')
})
it('should support next/og image', async () => {
const res = await next.fetch('/opengraph-image')
expect(res.status).toBe(200)
expect(res.headers.get('content-type')).toBe('image/png')
})
}
)