framesjs/frames.js

Latest debugger release raises nextjs errors.

Closed this issue · 5 comments

Here is the error from yarn:

yarn run v1.22.21
$ node ./scripts/dev-script.js
[1] > Debugger ready on http://localhost:3010
[1] > Debug HUB URL is http://localhost:3010/hub
[1] > Opening browser... http://localhost:3010?url=http://localhost:3000
[0]   ▲ Next.js 14.2.1
[0]   - Local:        http://localhost:3000
[0]   - Environments: .env
[0] 
[0]  ✓ Starting...
[1] TypeError: x is not a function
[1]     at rW (/Users/tudor/work/magic-frames/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:16:10405)
[1]     at async /Users/tudor/work/magic-frames/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:16:9396
[1]     at async Promise.all (index 0)
[1]     at async rW (/Users/tudor/work/magic-frames/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:16:9204)
[1]     at async r3 (/Users/tudor/work/magic-frames/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:16:15916) {
[1]   digest: '3092548031'
[1] }
[1] TypeError: x is not a function
[1]     at rW (/Users/tudor/work/magic-frames/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:16:10405)
[1]     at async /Users/tudor/work/magic-frames/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:16:9396
[1]     at async Promise.all (index 0)
[1]     at async rW (/Users/tudor/work/magic-frames/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:16:9204)
[1]     at async r3 (/Users/tudor/work/magic-frames/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:16:15916) {
[1]   digest: '3092548031'
[1] }
[1] TypeError: s is not a function
[1]     at /Users/tudor/work/magic-frames/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:13:2748
[1]     at eh (/Users/tudor/work/magic-frames/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:12:134795)
[1]     at e (/Users/tudor/work/magic-frames/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:12:137680)
[1]     at ek (/Users/tudor/work/magic-frames/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:12:138154)
[1]     at Array.toJSON (/Users/tudor/work/magic-frames/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:12:135764)
[1]     at stringify (<anonymous>)
[1]     at eR (/Users/tudor/work/magic-frames/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:12:142228)
[1]     at eE (/Users/tudor/work/magic-frames/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:12:142707)
[1]     at Timeout._onTimeout (/Users/tudor/work/magic-frames/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:12:135484)
[1]     at listOnTimeout (node:internal/timers:573:17) {
[1]   digest: '1968314801'
[1] }
[1] [Error: An error occurred in the Server Components render. The specific message is omitted in production builds to avoid leaking sensitive details. A digest property is included on this error instance which may provide additional details about the nature of the error.] {
[1]   digest: '1968314801'
[1] }
[1]  ⨯ [Error: An error occurred in the Server Components render. The specific message is omitted in production builds to avoid leaking sensitive details. A digest property is included on this error instance which may provide additional details about the nature of the error.] {
[1]   digest: '1968314801'
[1] }
[0]  ✓ Ready in 3.1s

My package.json:

{
  "name": "framesjs-starter",
  "version": "0.2.4",
  "private": true,
  "scripts": {
    "dev": "node ./scripts/dev-script.js",
    "dev:starter": "concurrently --kill-others \"next dev\" \"frames\"",
    "dev:monorepo": "next dev",
    "build": "next build",
    "start": "next start",
    "lint": "next lint",
    "update-debugger": "npx degit github:framesjs/frames.js/examples/framesjs-starter/app/debug#main app/debug --force",
    "update-framesjs": "yarn upgrade frames.js@latest && yarn run update-debugger"
  },
  "dependencies": {
    "@farcaster/core": "^0.14.3",
    "@noble/ed25519": "^2.0.0",
    "@supabase/supabase-js": "^2.40.0",
    "@vercel/kv": "^1.0.1",
    "@xmtp/frames-validator": "^0.5.0",
    "class-variance-authority": "^0.7.0",
    "clsx": "^2.1.0",
    "frames.js": "0.12.1",
    "lucide-react": "^0.331.0",
    "next": "14.2.1",
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "tailwindcss": "^3.3.0",
    "tailwindcss-animate": "^1.0.7",
    "viem": "^2.8.18"
  },
  "engines": {
    "node": ">=18.17.0"
  },
  "devDependencies": {
    "@frames.js/debugger": "0.1.9",
    "@types/node": "^18.17.0",
    "@types/react": "^18.2.0",
    "@types/react-dom": "^18.2.0",
    "autoprefixer": "^10.0.1",
    "concurrently": "^8.2.2",
    "dotenv": "^16.4.5",
    "eslint": "^8.56.0",
    "eslint-config-next": "14.1.0",
    "postcss": "^8",
    "typescript": "^5.3.3"
  }
}

I tried different combinations of versions for @frames.js/debugger, next and frames.js and no luck.

The same error is raised even after removing the node_modules dir and trying older that were ok in the past.

@tudormunteanu please downgrade next to 14.1.4 since there are issues with 14.2.x versions.

Or you can wait until we release patched debugger with the pinned version instead.

@tudormunteanu please downgrade next to 14.1.4 since there are issues with 14.2.x versions.

I have tried 14.1.4 before and even 14.1.0. Exact same error.

FYI: After each version change in package.json I run:
rm -rf node_modules; rm -rf .next; rm yarn.lock; yarn; yarn dev

@tudormunteanu debugger version 0.1.18 was just released with next pinned to 14.1.4 which fixes the issue.

@michalkvasnicak , can confirm fix works. Well done!