[Document / feature request] 422 Unprocessable Entity / TypeError [ERR_HTTP_INVALID_HEADER_VALUE]: Invalid value "undefined" for header "Location"

[silverham]

Package containing the bug

next-drupal (NPM package)

Describe the bug

Leaving here for documentation purposes / suggest adding extra logging (instead of 422 error but no logging even if debug is enabled)

If you have updated Acquia's drupal/acquia_cms_headless to 1.4.0+ then the drupal/next module is required to be v2.

So then for your next npm package should be v2+ as well.

Document in issue queue
Otherwise, if you use v1 next npm and v2 drupal/next togther you receive an error 422 Unprocessable Entity on API preview route.

Suggest to add extra logging to v1 next-drupal version like in v2 / Why - for those interested:

If you recompile next-drupal to change line (1104 in async preview()) in file : next-drupal/packages/next-drupal/src/client.ts

} catch (error) {
  return response.status(422).end()
}

to this, (like v2 logging)

} catch (error) {
  this._debug(`Preview failed: ${error.message}`);
  if (error instanceof Error) {
    this._debug(error.message);
    this._debug(error.stack);
  }
  return response.status(422).end()
}

You will get this error:

[next-drupal][debug]: TypeError [ERR_HTTP_INVALID_HEADER_VALUE]: Invalid value "undefined" for header "Location"
    at ServerResponse.setHeader (node:_http_outgoing:662:3)
    at _res.setHeader (/app/nextjs/node_modules/next/dist/server/base-server.js:499:24)
    at setHeadersFromObject (/app/nextjs/node_modules/next/dist/compiled/compression/index.js:998:20)
    at ServerResponse.setWriteHeadHeaders (/app/nextjs/node_modules/next/dist/compiled/compression/index.js:1016:11)
    at ServerResponse.writeHead (/app/nextjs/node_modules/next/dist/compiled/compression/index.js:965:39)
    at eval (webpack-internal:///(api)/../git-ignored/next-drupal/packages/next-drupal/dist/index.js:1831:24)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
    at async handler (webpack-internal:///(api)/./pages/api/preview.tsx:12:5)
    at async K (/app/nextjs/node_modules/next/dist/compiled/next-server/pages-api.runtime.dev.js:1099:17)
    at async U.render (/app/nextjs/node_modules/next/dist/compiled/next-server/pages-api.runtime.dev.js:1130:9)
    at async DevServer.runApi (/app/nextjs/node_modules/next/dist/server/next-server.js:615:9)
    at async NextNodeServer.handleCatchallRenderRequest (/app/nextjs/node_modules/next/dist/server/next-server.js:269:37)
    at async DevServer.handleRequestImpl (/app/nextjs/node_modules/next/dist/server/base-server.js:813:17)
    at async /app/nextjs/node_modules/next/dist/server/dev/next-dev-server.js:339:20
    at async Span.traceAsyncFn (/app/nextjs/node_modules/next/dist/trace/trace.js:154:20)
 GET /api/preview?path=/my/path&timestamp=1731381663&secret=myserect&plugin=simple_oauth&locale=en&defaultLocale=en&resourceVersion=rel%3Alatest-version 422 in 1159ms

Which is created by the below code in preview() in next-drupal/packages/next-drupal/dist/index.js
where slug is undefined but it now path in drupal next module v2.

response.writeHead(307, {
  Location: slug
});

This is because the drupal nextjs module uses path instead of slug in v2.

[silverham]

For those wondering how i got it to compile next / drupal in docker in lando with image mcr.microsoft.com/appsvc/node:20-lts_20240819.2.tuxprod (it might not be the best way)
(though couldn't get it fully running, i get fallback-build-manifest.json missing so i copy and paste the code to the project to test it)

# How to compile next-drupal and run inside exiting project
lando ssh -s nextjs -u root
apt-get install yarn
apt-get install git
cd /app/git-ignored/
git clone https://github.com/chapter-three/next-drupal.git
cd /app/git-ignored/next-drupal/
git checkout v1.6
yarn add vips -W
yarn install
mv /app/nextjs/node_modules/next-drupal /app/nextjs/node_modules/next-drupal.bak
ln -s /app/git-ignored/next-drupal/node_modules/next-drupal /app/nextjs/node_modules/next-drupal
# compile
npm run prepare

# How to compile next (must use a clone of an exiting project due to `pnpm` messing up node_modules`)
lando ssh -s nextjs -u root
apt-get install yarn
apt-get install git
npm install -g [email protected]
pnpm install

# (should have types error in build)
pnpm build 

mv /app/nextjs/node_modules/next /app/nextjs/node_modules/next.bak
rm /app/nextjs/node_modules/next -rf
pnpm next-with-deps /app/nextjs/
# Then cancel.

# (should not have types error in build now)
pnpm build

# Then copy and paste compile *.js files to your original project for debugging.