vercel / vercel/next.js

`window` is injected as an `object` in webworker scripts instead of `undefined`

Open
#62,256 2 comments 1 reaction 0 assignees View on GitHub

Nobody has claimed this yet.

bug SWC
Dominant language
JavaScript
Stars
142k
Forks
32.4k
Avg merge
2d 14h
Merged PRs (30d)
351

Description

Link to the code that reproduces this issue

https://codesandbox.io/p/devbox/boring-hill-2w8x38?file=%2Fapp%2Fworker.ts%3A5%2C44

To Reproduce
  1. Start the application in dev
  2. Click the "Send to worker" button
  3. Inspect the console
Current vs. Expected behavior

Until next@14.0.5-canary.20, typeof window returned undefined inside a webworker as expected. However since next@14.0.5-canary.20, typeof window returns object but this object cannot be accessed. Therefore, as it stands, third party libraries making use of window via an undefined test cannot work anymore in webworkers in Nextjs.

The most notable example if Three.js which includes this snippet at the end of the library -

if ( typeof window !== 'undefined' ) {

	if ( window.__THREE__ ) {

		console.warn( 'WARNING: Multiple instances of Three.js being imported.' );

	} else {

		window.__THREE__ = REVISION;

	}

}
Provide environment information
All
Which area(s) are affected? (Select all that apply)

SWC transpilation

Which stage(s) are affected? (Select all that apply)

next dev (local), next build (local), next start (local), Other (Deployed)

Additional context

This bug was first introduced in next@14.0.5-canary.20

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with the linked CodeSandbox reproduction in app/worker.ts and verify the behavior in the listed development and production stages. Then trace the SWC transpilation involved in webworker scripts. Done means typeof window is undefined again, allowing the shown Three.js guard to work without accessing the injected object.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript, next.js
Domain
build-system, compilers
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
42/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.