CD
Cloudflare Developers•2mo ago
CanRau

Uncaught ReferenceError: MessageChannel is not defined

Updating different (unrelated) dependencies causes this. At least some seem to be related to React19 (which itself also causes this 🥲 I'm not sure it's directly CF related tho it only happens on wrangler deploy and only after building etc 🤔 
Total Upload: 20484.96 KiB / gzip: 3636.26 KiB

✘ [ERROR] A request to the Cloudflare API (/accounts/ddddc353374f7ec886d7d7d97e239a71/workers/scripts/rakkas-cf-origin/versions) failed.

  Uncaught ReferenceError: MessageChannel is not defined
    at null.<anonymous>
  (file://[..]/node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom-server.browser.production.js:126:15)
  in
  ../../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom-server.browser.production.js
    at null.<anonymous> (entry-cf.js:32:50) in __require2
    at null.<anonymous>
  (file://[..]/node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/server.browser.js:6:7)
  in ../../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/server.browser.js
    at null.<anonymous> (entry-cf.js:32:50) in __require2
    at null.<anonymous>
  (file://[..]/dist/edge/hattip.js:12:62)
  in dist/edge/hattip.js
    at null.<anonymous> (entry-cf.js:29:59) in __init
    at null.<anonymous>
  (file://[..]/dist/edge/entry-cf.js:2:1)
   [code: 10021]
Total Upload: 20484.96 KiB / gzip: 3636.26 KiB

✘ [ERROR] A request to the Cloudflare API (/accounts/ddddc353374f7ec886d7d7d97e239a71/workers/scripts/rakkas-cf-origin/versions) failed.

  Uncaught ReferenceError: MessageChannel is not defined
    at null.<anonymous>
  (file://[..]/node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom-server.browser.production.js:126:15)
  in
  ../../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom-server.browser.production.js
    at null.<anonymous> (entry-cf.js:32:50) in __require2
    at null.<anonymous>
  (file://[..]/node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/server.browser.js:6:7)
  in ../../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/server.browser.js
    at null.<anonymous> (entry-cf.js:32:50) in __require2
    at null.<anonymous>
  (file://[..]/dist/edge/hattip.js:12:62)
  in dist/edge/hattip.js
    at null.<anonymous> (entry-cf.js:29:59) in __init
    at null.<anonymous>
  (file://[..]/dist/edge/entry-cf.js:2:1)
   [code: 10021]
Update: nodejs_compat is already enabled in my wrangler.toml
14 Replies
Rohan Vashisht
Rohan Vashisht•2mo ago
Hello! Same issue here 
[wrangler:inf] Ready on http://localhost:8788
⎔ Starting local server...
✘ [ERROR] service core:user:zigistry: Uncaught ReferenceError: MessageChannel is not defined

    at null.<anonymous> (g9werpoqfas.js:9183:18) in requireReactDomServer_browser_production
    at null.<anonymous> (g9werpoqfas.js:13866:9) in requireServer_browser
    at null.<anonymous> (g9werpoqfas.js:14087:29) in
  .wrangler/tmp/pages-vjhWro/chunks/_@astro-renderers_Du4IiIVl.mjs
    at null.<anonymous> (g9werpoqfas.js:18:59) in __init
    at null.<anonymous> (g9werpoqfas.js:43883:1)



✘ [ERROR] The Workers runtime failed to start. There is likely additional logging output above.
[wrangler:inf] Ready on http://localhost:8788
⎔ Starting local server...
✘ [ERROR] service core:user:zigistry: Uncaught ReferenceError: MessageChannel is not defined

    at null.<anonymous> (g9werpoqfas.js:9183:18) in requireReactDomServer_browser_production
    at null.<anonymous> (g9werpoqfas.js:13866:9) in requireServer_browser
    at null.<anonymous> (g9werpoqfas.js:14087:29) in
  .wrangler/tmp/pages-vjhWro/chunks/_@astro-renderers_Du4IiIVl.mjs
    at null.<anonymous> (g9werpoqfas.js:18:59) in __init
    at null.<anonymous> (g9werpoqfas.js:43883:1)



✘ [ERROR] The Workers runtime failed to start. There is likely additional logging output above.
I am using pages and workers, I am getting this same issue Are you using astro? or just apis? An easy fix: just take your package.json to the previous configuration when it was working 🤣 And it really worked but, do this at your own risk, because using unupdated packages is generally considered a security vulnerability Anyways, I ain't from cloudflare, I am just someone like you getting errors and trying to fix them, lets wait for someone from cloudflare to reply
CanRau
CanRauOP•2mo ago
Yea this is working for me for now as well, it started to happen only with react 19, all other packages on latest, now it seems like as packages start to officially support react 19 they cause the same issue so now I have lots of outdated packages 🥲 Surprising that seemingly no one else seems to run into this so far 🤔
Radoš
Radoš•2mo ago
the code throwing error 
// react-dom-server.browser.production.js
var channel = new MessageChannel(), taskQueue = [];
channel.port1.onmessage = function() {
    var task = taskQueue.shift();
    task && task();
};
function scheduleWork(callback) {
    taskQueue.push(callback);
    channel.port2.postMessage(null);
}
// react-dom-server.browser.production.js
var channel = new MessageChannel(), taskQueue = [];
channel.port1.onmessage = function() {
    var task = taskQueue.shift();
    task && task();
};
function scheduleWork(callback) {
    taskQueue.push(callback);
    channel.port2.postMessage(null);
}
Radoš
Radoš•2mo ago
https://github.com/facebook/react/issues/31827
GitHub
Bug: Uncaught ReferenceError: MessageChannel is not defined · Issue...
React version: 19.0.0 Steps To Reproduce Create an Astro & React project with server adapter for Cloudflare Try to deploy to Cloudflare Pages via wrangler deploy The current behavior Uncaught R...
CanRau
CanRauOP•2mo ago
nice, thank you for finding and reporting 🙏
jado
jado•2mo ago
Would love a solution to this! It looks like someone else hit the unsupported MessageChannel API in Vercel's Edge Runtime https://github.com/vercel/next.js/issues/60337 but this is the only issue I can find & it was never resolved, so they might still not support it. Not sure if this is in the scope for workerd or if React should revert its usage.
GitHub
Next.js 14.0.4 - Edge Runtime Warnings in scheduler Module · Issue ...
Link to the code that reproduces this issue https://github.com/Soheiljafarnejad/sabzlearn-front To Reproduce I am encountering warnings related to the use of Node.js APIs in the scheduler module wh...
jado
jado•2mo ago
@Mike Nomitch | Workers PM hi 👋 would opening an issue on workerd be appropriate for this?
Radoš
Radoš•2mo ago
@jado I think it is the React issue as MessageChannel is for the browsers only (or browser context).
jado
jado•2mo ago
mm i see
meakr
meakr•4w ago
Hey @jado sorry for the slow reply on this. I won't have time to fully dig in today, but I think even if its a React issue, it's worth opening a workerd issue for this. Others might hit it so good for redirecting them to open React issues, and its good evidence that supporting that API is valuable (even if an upstream changes it later). @Radoš so this is server-side React code that gets executed assuming MessageChannel is there? You sure its React and not Astro or the CF-specific code for that integration?
jado
jado•4w ago
https://github.com/cloudflare/workerd/issues/3273 ✅
GitHub
🐛 Bug Report — Runtime APIs: MessageChannel · Issue #3273 · cloudfl...
The MessageChannel API is available on node but not CF Workers. This is causing an issue during the deployment of sites using React 19 + Astro + Workers, see facebook/react#31827 and withastro/astr...
jado
jado•4w ago
ah this is an issue with astro not using the edge renderer, workaround is here: https://github.com/withastro/adapters/pull/436#issuecomment-2525190557
GitHub
fix(cloudflare): use React edge renderer for compatibility with Rea...
Note: Until a proper fix gets merged, you can use this workaround. React 19 requires MessageChannel from node:worker_threads, which isn&#39;t available in Cloudflare&#39;s workerd runtime....
jado
jado•4w ago
this config worked for me: 
// @ts-check
import { defineConfig } from "astro/config";
import cloudflare from "@astrojs/cloudflare";

import react from "@astrojs/react";

// https://astro.build/config
export default defineConfig({
  output: "server",
  adapter: cloudflare(),
  integrations: [react()],
  vite: {
    resolve: {
      // Use react-dom/server.edge instead of react-dom/server.browser for React 19.
      // Without this, MessageChannel from node:worker_threads needs to be polyfilled.
      alias: import.meta.env.PROD && {
        "react-dom/server": "react-dom/server.edge",
      },
    },
  },
});
// @ts-check
import { defineConfig } from "astro/config";
import cloudflare from "@astrojs/cloudflare";

import react from "@astrojs/react";

// https://astro.build/config
export default defineConfig({
  output: "server",
  adapter: cloudflare(),
  integrations: [react()],
  vite: {
    resolve: {
      // Use react-dom/server.edge instead of react-dom/server.browser for React 19.
      // Without this, MessageChannel from node:worker_threads needs to be polyfilled.
      alias: import.meta.env.PROD && {
        "react-dom/server": "react-dom/server.edge",
      },
    },
  },
});
Radoš
Radoš•4w ago
In some other parts of the Rect code (similar to this one), there is condition to check if MessageChannel exists, so this is why assume it is issue there.

Did you find this page helpful?