TypeError when rendering BuilderComponent in Next.js app

[maciej-trebacz]

Describe the bug When running a Next.js app that renders BuilderComponent from @builder.io/react I get the following error in the server console:

- error TypeError: Cannot read properties of null (reading 'registered')

There is no additional information printed in the console, and the page in the browser seems to render correctly. This happens on any builder page I visit.

I'm using a starter Next.js project with the Builder code taken straight from the documentation, and latest Builder SDK versions.

To Reproduce Steps to reproduce the behavior:

1. Create a new Next.js project and configure it with Builder SDK
2. Add export const runtime = 'edge'; to the page with BuilderComponent
3. Open a page that will render content from Builder
4. Notice the error in the console

Additional context From package.json:

  "dependencies": {
    "@builder.io/dev-tools": "^0.1.17",
    "@builder.io/react": "^3.0.14",
    "@builder.io/sdk": "^2.0.8",
    "@cloudflare/next-on-pages": "^1.6.0",
    "@types/node": "20.5.0",
    "@types/react": "18.2.20",
    "@types/react-dom": "18.2.7",
    "autoprefixer": "10.4.15",
    "eslint": "8.47.0",
    "eslint-config-next": "13.4.18",
    "next": "^13.4.19",
    "postcss": "8.4.28",
    "react": "18.2.0",
    "react-dom": "18.2.0",
    "tailwindcss": "3.3.3",
    "typescript": "5.1.6"
  },

[mrkoreye]

Hi @maciej-trebacz ! Thanks for the report. Have you noticed any functionality of the site break, or does this issue seem to only manifest as a console error? Is the issue resolved if you downgrade the version of @builder.io/react to a previous version (e.g. 3.0.13)?

[maciej-trebacz]

@mrkoreye so far I didn't notice any functionality issues, but the error in the console does sound like something is breaking, so I'm worried there will be issues down the line. Downgrading to 3.0.13 does indeed get rid of this error. There is one other bit of information that's probably important that I left out (I've updated the original issue above) - I'm using the Edge runtime for the page that renders the BuiderComponent:

export const runtime = 'edge';

Commenting out this line does make the error go away. But I need this page to be rendered using Edge runtime for better performance.

[mrkoreye]

Great, thank you for the extra details. This will help with the investigation.

[nikola-elva]

Same error here, I am using Next.js 14 with app router and 'edge' runtime, here is part of my package.json

"dependencies": {
    "@builder.io/dev-tools": "^1.0.18",
    "@builder.io/react": "^4.0.0",
    "@builder.io/sdk": "^2.2.6",
    "@radix-ui/react-accordion": "^1.2.0",
    "@radix-ui/react-dropdown-menu": "^2.1.1",
    "@radix-ui/react-icons": "^1.3.0",
    "@radix-ui/react-select": "^2.1.1",
    "@radix-ui/react-slot": "^1.1.0",
    "class-variance-authority": "^0.7.0",
    "clsx": "^2.1.1",
    "date-fns": "^3.6.0",
    "embla-carousel-autoplay": "^8.1.6",
    "embla-carousel-react": "^8.1.6",
    "lucide-react": "^0.408.0",
    "next": "14.2.5",
    "react": "^18",
    "react-dom": "^18",
    "tailwind-merge": "^2.4.0",
    "tailwindcss-animate": "^1.0.7"
  }

I am getting on a first visit of a page. Since this manifests only as a console error I have dismissed it but recently FB crawler couldn't access my site because of this error.

@mrkoreye Is there any update on this?

[Manic-sh]

Loom issue reproduced: https://www.loom.com/share/ac762ec03fd8437baea30a1bd996e475

Github reproduced repo: https://github.com/Manic-sh/nextjs-app-edge-runtime