[appDir edge runtime] edgeFunctionEntry.wasm entries have incorrect filePath

[brkalow]

Verify canary release

• I verified that the issue exists in the latest Next.js canary release

Provide environment information

Operating System:
  Platform: darwin
  Arch: x64
  Version: Darwin Kernel Version 20.6.0: Mon Aug 29 04:31:06 PDT 2022; root:xnu-7195.141.39~2/RELEASE_X86_64
Binaries:
  Node: 14.17.6
  npm: 8.15.1
  Yarn: 1.22.17
  pnpm: 6.24.0
Relevant packages:
  next: 12.3.2-canary.33
  eslint-config-next: N/A
  react: 0.0.0-experimental-0c11baa6a-20221022
  react-dom: 0.0.0-experimental-0c11baa6a-20221022

What browser are you using? (if relevant)

No response

How are you deploying your application? (if relevant)

Vercel

Describe the Bug

When importing .wasm files using the edge runtime, Next's production build fails in this call to getRuntimeContext():

next.js/packages/next/build/utils.ts

Lines 1259 to 1266 in 9c7e8b6

	const runtime = await getRuntimeContext({
	paths: edgeInfo.files.map((file: string) => path.join(distDir, file)),
	env: edgeInfo.env,
	edgeFunctionEntry: edgeInfo,
	name: edgeInfo.name,
	useCache: true,
	distDir,
	})

It appears that in the the call to loadWasm(), the filePath in the manifest does not include the distDir:

next.js/packages/next/server/web/sandbox/context.ts

Lines 57 to 62 in 9c7e8b6

	wasm.map(async (binding) => {
	const module = await WebAssembly.compile(
	await fs.readFile(binding.filePath)
	)
	modules[binding.name] = module
	})

If I patch this and prepend distDir, the build succeeds and the file is loaded correctly at runtime. It looks like that at runtime, distDir is added via the getEdgeFunctionInfo() method in next-server before calling loadWasm():

next.js/packages/next/server/next-server.ts

Lines 1646 to 1649 in 9c7e8b6

	wasm: (pageInfo.wasm ?? []).map((binding) => ({
	...binding,
	filePath: join(this.distDir, binding.filePath),
	})),

Expected Behavior

I would expect the build to succeed when using wasm files with the edge runtime. This change in next/build/utils.ts seems to fix it, but I'm not sure if it's the root cause or just masking something else.

diff --git a/node_modules/next/dist/build/utils.js b/node_modules/next/dist/build/utils.js
index 14de2ed..a81c70a 100644
--- a/node_modules/next/dist/build/utils.js
+++ b/node_modules/next/dist/build/utils.js
@@ -811,7 +811,13 @@ async function isPageStatic({ page , distDir , configFileName , runtimeEnvConfig
             const runtime = await (0, _sandbox).getRuntimeContext({
                 paths: edgeInfo.files.map((file)=>_path.default.join(distDir, file)),
                 env: edgeInfo.env,
-                edgeFunctionEntry: edgeInfo,
+                edgeFunctionEntry: {
+                    ...edgeInfo,
+                    wasm: (edgeInfo.wasm ?? []).map(binding => ({
+                        ...binding,
+                        filePath: _path.default.join(distDir, binding.filePath)
+                    }))
+                },
                 name: edgeInfo.name,
                 useCache: true,
                 distDir

Link to reproduction

https://github.com/BRKalow/next-app-dir-edge-wasm

To Reproduce

Run:

npm install
npx next build

Observe the error.

[brkalow]

Opened a PR with the mentioned patch here: #41689

[balazsorban44]

App directory is being actively worked on. We don't expect issue reports yet, but we will soon give an update on the status. Thanks!

[github-actions]

This closed issue has been automatically locked because it had no new activity for a month. If you are running into a similar issue, please create a new issue with the steps to reproduce. Thank you.