_gatsbyScript.PartytownContext is undefined

[saadfrhan]

Preliminary Checks

• This issue is not a duplicate. Before opening a new issue, please search existing issues: https://github.com/gatsbyjs/gatsby/issues
• This issue is not a question, feature request, RFC, or anything other than a bug report directly related to Gatsby. Please post those things in GitHub Discussions: https://github.com/gatsbyjs/gatsby/discussions

Description

Using netlify with gatsby.
My netlify.toml file:

[dev]
  command = "npm start"
  targetPort = 8000
  autoLaunch = false

[build]
  command = "gatsby build"
  publish = "public/" 
  functions = "functions/"

[[plugins]]
  package = "@netlify/plugin-functions-install-core"

[[headers]]
  for = "/*"
    [headers.values]
    Access-Control-Allow-Origin = "*"

When I run npx netlify dev command:

D:\serverless-graphql-faunadb-todoapp>npx netlify dev
(node:21628) ExperimentalWarning: The Fetch API is an experimental feature. This feature could change at any time       
(Use `node --trace-warnings ...` to show where the warning was created)
wasm streaming compile failed: TypeError: fetch failed
falling back to ArrayBuffer instantiation
still waiting on run dependencies:
dependency: wasm-instantiate
(end of list)
◈ Netlify Dev ◈
◈ Ignored general context env var: LANG 
(defined in process)
◈ Loaded function graphql http://localhost:8888/.netlify/functions/graphql.     
◈ Functions server is listening on 63879◈ Setting up local development server

────────────────────────────────────────────────────────────────
  Netlify Build

────────────────────────────────────────────────────────────────

❯ Version
  @netlify/build 27.16.0

❯ Flags
  {}

❯ Current directory
  D:\serverless-graphql-faunadb-todoapp 

❯ Config file
  D:\serverless-graphql-faunadb-todoapp\netlify.toml

❯ Context
  dev

────────────────────────────────────────────────────────────────
  1. Run command for local development  

────────────────────────────────────────────────────────────────

◈ Starting Netlify Dev with custom config

> gatsby-starter-ts@1.0.0 start
> gatsby develop -p 3000

warn It is highly recommended to set `predictableActionArguments` to `true` when using `createMachine`. https://xstate.js.org/docs/guides/actions.html

success compile gatsby files - 16.535s  

success load gatsby config - 0.028s     

success load plugins - 1.943s

success onPreInit - 0.002s

success initialize cache - 0.514s       

success copy gatsby files - 3.147s      

success Compiling Gatsby Functions - 2.659s

success onPreBootstrap - 2.999s

success createSchemaCustomization - 0.002s

success Checking for changed pages - 0.002s

success source and transform nodes - 0.632s

success building schema - 1.153s
success createPages - 0.014s

success createPagesStatefully - 0.373s  

info Total nodes: 24, SitePage nodes: 4 
(use --verbose for breakdown)

success Checking for changed pages - 0.004s

success write out redirect data - 0.011s
success onPostBootstrap - 0.002s

info bootstrap finished - 67.242s       

success onPreExtractQueries - 0.001s    

success extract queries from components 
- 3.856s

success write out requires - 0.210s     

success run page queries - 0.151s - 1/1 
6.64/s

⠀

You can now view gatsby-starter-ts in the browser.

⠀

  http://localhost:3000/

⠀

View GraphiQL, an in-browser IDE, to explore your site's data and schema        

⠀

  http://localhost:3000/___graphql      

⠀

Note that the development build is not optimized.

To create a production build, use gatsby build

⠀

success Building development bundle - 21.734s

success Writing page-data.json files to 
public directory - 1.777s - 3/4 2.25/s  

⠏ Waiting for framework port 3000. This 
can be configured using the 'targetPort' property in the netlify.toml
× Waiting for framework port 8000. This can be configured using the 'targetPort' property in the netlify.toml
◈ Netlify Dev could not connect to localhost:8000.
◈ Please make sure your framework server is running on port 8000

The netlify server didn't run and when I checked localhost:8000, the screen is blank and the console shows the following errors:

Reproduction Link

https://githubbox.com/SaadFarhanIdress/serverless-graphql-faunadb-todoapp/tree/418cb87c3d52e54701defc07c72894672a0623ff

Steps to Reproduce

1. Confirm that packages in the root and functions directory are downloaded.
2. Create a .env file in the functions directory and paste the following into it.

FAUNADB_SERVER_SECRET=fnAEris3GVACSW8U2MVTtqyVS_C6au3qbiZEXCe_

3. Run netlify dev in the root directory.

netlify dev

Expected Result

The development server should have been running.

Actual Result

Please see the description.

Environment

System:
    OS: Windows 10 10.0.19044
    CPU: (4) x64 Intel(R) Core(TM) i3-2120 CPU @ 3.30GHz
  Binaries:
    Node: 18.6.0 - C:\Program Files\nodejs\node.EXE
    Yarn: 1.22.19 - C:\Program Files\nodejs\yarn.CMD
    npm: 8.17.0 - C:\Program Files\nodejs\npm.CMD
  Languages:
    Python: 3.10.0
  Browsers:
    Edge: Spartan (44.19041.1266.0), Chromium (104.0.1293.70)
  npmPackages:
    gatsby: 4.19.2 => 4.19.2 
  npmGlobalPackages:
    gatsby-cli: 4.21.0

Config Flags

No

Edit

When I run it in GitHub Codespaces, both netlify and gatsby development ran but both are showing the same errors in the console window.

[pieh]

I tried running your reproduction and it doesn't fail for me:

But I did have troubles installing with npm and I did install with yarn, which means lock files in repro weren't used for me. Can you try upgrading transitive deps in your lock files? (easiest way is probably to delete those, and install deps fresh, be sure to commit/stash stuff to revert in case things get worse).

[saadfrhan]

I am sorry I mutated the reproduction application code. Just before some hours, I deleted most of the packages and files. Then it worked perfectly. You can see the commit details here:
https://github.com/SaadFarhanIdress/serverless-graphql-faunadb-todoapp/commit/bc1e981d0e870c6958cffb1dabac6dc9f901255c
You can see the old code from here:
https://githubbox.com/SaadFarhanIdress/serverless-graphql-faunadb-todoapp/tree/418cb87c3d52e54701defc07c72894672a0623ff

[pieh]

We located problematic bit - there is some version mismatch happening - if everything is on latest (like in my case) everything works fine, it's when gatsby core is before certain version, but transitive deps are on latest we can get errors like the one you shown in opening post.

We will look to fix/handle this mismatch

[LekoArts]

We've looked a bit into this and we decided to do no code fix for this. If you run into this and see this issue later, upgrade all your Gatsby dependency to the latest version and it should be resolved.

It seems this is happening when one uses Gatsby pre 4.21 + gatsby-script above 1.5.0 or vice versa. Unfortunately we can't safely fix this issue, so if you have a version mismatch, please update your dependencies. We decided to go this route as the majority of our users isn't running into this problem.

[dacevedo12]

For anyone that runs into this, it is indeed a version mismatch

gatsby@4.15.2 declares gatsby-script@^1.0.1 as peer, but 1.9.0 (latest at the time of writing) is in range

gatsby-script@1.9.0 will break, causing the _gatsbyScript.PartytownContext is undefined described in this issue

I solved it by pinning gatsby-script to the exact version 1.0.1