"createContext only works in Client Components" when using `npx dev --turbo`

[simonknittel]

Describe the bug

Seems like the issue from #32 is back but this time only when using npx dev --turbo. Without --turbo it's working fine.

Steps to reproduce the bug

1. Install @unleash/next.js@1.4.2
2. Create an app router Route Handler:

Example:

import { evaluateFlags, flagsClient, getDefinitions } from "@unleash/nextjs";

export async function GET() {
  const definitions = await getDefinitions({
    fetchOptions: {
      next: { revalidate: 30 },
    },
  });

  const { toggles } = evaluateFlags(definitions);

  const flags = flagsClient(toggles);

  console.log(flags.isEnabled("myFlag"))
}

Expected behavior

The server-side methods should not use any client-side methods.

Logs, error output, etc.

createContext only works in Client Components. Add the "use client" directive at the top of the file to use it. Read more: https://nextjs.org/docs/messages/context-in-server-component
    at /home/simon/repos/sinister-incorporated/app/node_modules/@unleash/proxy-client-react/src/FlagContext.ts:20:27
    at /home/simon/repos/sinister-incorporated/app/.next/server/chunks/node_modules_8c8081._.js:10710:57
    at Object.<anonymous> (/home/simon/repos/sinister-incorporated/app/.next/server/chunks/node_modules_8c8081._.js:10711:3)
    at [project]/node_modules/@unleash/proxy-client-react/dist/unleash-react.umd.cjs [app-route] (ecmascript) (/home/simon/repos/sinister-incorporated/app/.next/server/chunks/node_modules_8c8081._.js:10865:3)
    at instantiateModule (/home/simon/repos/sinister-incorporated/app/.next/server/chunks/[turbopack]_runtime.js:520:23)
    at getOrInstantiateModuleFromParent (/home/simon/repos/sinister-incorporated/app/.next/server/chunks/[turbopack]_runtime.js:572:12)
    at commonJsRequire (/home/simon/repos/sinister-incorporated/app/.next/server/chunks/[turbopack]_runtime.js:136:20)
    at Object.<anonymous> (/home/simon/repos/sinister-incorporated/app/node_modules/@unleash/nextjs/dist/FlagProvider.js:5:7)
    at [project]/node_modules/@unleash/nextjs/dist/FlagProvider.js [app-route] (ecmascript) (/home/simon/repos/sinister-incorporated/app/.next/server/chunks/node_modules_8c8081._.js:10652:3)
    at instantiateModule (/home/simon/repos/sinister-incorporated/app/.next/server/chunks/[turbopack]_runtime.js:520:23)
    at getOrInstantiateModuleFromParent (/home/simon/repos/sinister-incorporated/app/.next/server/chunks/[turbopack]_runtime.js:572:12)
    at commonJsRequire (/home/simon/repos/sinister-incorporated/app/.next/server/chunks/[turbopack]_runtime.js:136:20)
    at Object.<anonymous> (/home/simon/repos/sinister-incorporated/app/node_modules/@unleash/nextjs/dist/index.js:23:1)
    at [project]/node_modules/@unleash/nextjs/dist/index.js [app-route] (ecmascript) (/home/simon/repos/sinister-incorporated/app/.next/server/chunks/node_modules_8c8081._.js:10706:3)
    at instantiateModule (/home/simon/repos/sinister-incorporated/app/.next/server/chunks/[turbopack]_runtime.js:520:23)
    at getOrInstantiateModuleFromParent (/home/simon/repos/sinister-incorporated/app/.next/server/chunks/[turbopack]_runtime.js:572:12)
    at esmImport (/home/simon/repos/sinister-incorporated/app/.next/server/chunks/[turbopack]_runtime.js:122:20)
    at /home/simon/repos/sinister-incorporated/app/.next/server/chunks/src_ed78b1._.js:391:158
    at [project]/src/lib/getUnleashFlag.ts [app-route] (ecmascript) (/home/simon/repos/sinister-incorporated/app/.next/server/chunks/src_ed78b1._.js:425:3)
    at instantiateModule (/home/simon/repos/sinister-incorporated/app/.next/server/chunks/[turbopack]_runtime.js:520:23)
    at getOrInstantiateModuleFromParent (/home/simon/repos/sinister-incorporated/app/.next/server/chunks/[turbopack]_runtime.js:572:12)
    at esmImport (/home/simon/repos/sinister-incorporated/app/.next/server/chunks/[turbopack]_runtime.js:122:20)
    at /home/simon/repos/sinister-incorporated/app/.next/server/chunks/src_ed78b1._.js:560:134
    at [project]/src/lib/emailConfirmation.ts [app-route] (ecmascript) (/home/simon/repos/sinister-incorporated/app/.next/server/chunks/src_ed78b1._.js:640:3)
    at instantiateModule (/home/simon/repos/sinister-incorporated/app/.next/server/chunks/[turbopack]_runtime.js:520:23)
    at getOrInstantiateModuleFromParent (/home/simon/repos/sinister-incorporated/app/.next/server/chunks/[turbopack]_runtime.js:572:12)
    at esmImport (/home/simon/repos/sinister-incorporated/app/.next/server/chunks/[turbopack]_runtime.js:122:20)
    at /home/simon/repos/sinister-incorporated/app/.next/server/chunks/src_ed78b1._.js:705:137
    at [project]/src/lib/auth/authenticateAndAuthorize.ts [app-route] (ecmascript) (/home/simon/repos/sinister-incorporated/app/.next/server/chunks/src_ed78b1._.js:804:3)
    at instantiateModule (/home/simon/repos/sinister-incorporated/app/.next/server/chunks/[turbopack]_runtime.js:520:23)
    at getOrInstantiateModuleFromParent (/home/simon/repos/sinister-incorporated/app/.next/server/chunks/[turbopack]_runtime.js:572:12)
    at esmImport (/home/simon/repos/sinister-incorporated/app/.next/server/chunks/[turbopack]_runtime.js:122:20)
    at /home/simon/repos/sinister-incorporated/app/.next/server/chunks/src_ed78b1._.js:848:152
    at [project]/src/lib/auth/server/index.ts [app-route] (ecmascript) <module evaluation> (/home/simon/repos/sinister-incorporated/app/.next/server/chunks/src_ed78b1._.js:853:3)
    at instantiateModule (/home/simon/repos/sinister-incorporated/app/.next/server/chunks/[turbopack]_runtime.js:520:23)
    at getOrInstantiateModuleFromParent (/home/simon/repos/sinister-incorporated/app/.next/server/chunks/[turbopack]_runtime.js:572:12)
    at esmImport (/home/simon/repos/sinister-incorporated/app/.next/server/chunks/[turbopack]_runtime.js:122:20)
    at /home/simon/repos/sinister-incorporated/app/.next/server/chunks/src_ed78b1._.js:867:171
    at [project]/src/server/auth.ts [app-route] (ecmascript) (/home/simon/repos/sinister-incorporated/app/.next/server/chunks/src_ed78b1._.js:1106:3)
    at instantiateModule (/home/simon/repos/sinister-incorporated/app/.next/server/chunks/[turbopack]_runtime.js:520:23)
    at getOrInstantiateModuleFromParent (/home/simon/repos/sinister-incorporated/app/.next/server/chunks/[turbopack]_runtime.js:572:12)
    at esmImport (/home/simon/repos/sinister-incorporated/app/.next/server/chunks/[turbopack]_runtime.js:122:20)
    at /home/simon/repos/sinister-incorporated/app/.next/server/chunks/src_ed78b1._.js:1115:127
    at [project]/src/app/api/auth/[...nextauth]/route.ts [app-route] (ecmascript) (/home/simon/repos/sinister-incorporated/app/.next/server/chunks/src_ed78b1._.js:1122:3)
    at instantiateModule (/home/simon/repos/sinister-incorporated/app/.next/server/chunks/[turbopack]_runtime.js:520:23)
    at getOrInstantiateModuleFromParent (/home/simon/repos/sinister-incorporated/app/.next/server/chunks/[turbopack]_runtime.js:572:12)
    at esmImport (/home/simon/repos/sinister-incorporated/app/.next/server/chunks/[turbopack]_runtime.js:122:20)
    at /home/simon/repos/sinister-incorporated/app/.next/server/chunks/node_modules_next_ca8175._.js:4596:162
    at [project]/node_modules/next/dist/esm/build/templates/app-route.js { INNER_APP_ROUTE => "[project]/src/app/api/auth/[...nextauth]/route.ts [app-route] (ecmascript)" } [app-route] (ecmascript) (/home/simon/repos/sinister-incorporated/app/.next/server/chunks/node_modules_next_ca8175._.js:4631:3)
    at instantiateModule (/home/simon/repos/sinister-incorporated/app/.next/server/chunks/[turbopack]_runtime.js:520:23) {page: '/api/auth/providers', stack: 'createContext only works in Client Components…/server/chunks/[turbopack]_runtime.js:520:23)', message: 'createContext only works in Client Component…rg/docs/messages/context-in-server-component'}

Screenshots

Additional context

Next.js v14.2.3

Unleash version

5.11.3

Subscription type

Open source

Hosting type

Self-hosted

SDK information (language and version)

@unleash/next.js@1.4.2

[andreas-unleash]

Hi @simonknittel , For clarity, has this worked for you prior to this SDK version? (Turbopack)

[simonknittel]

Hi @andreas-unleash, I tested with following combinations of version:

	1.4.2	1.4.1	1.4.0
14.2.3	❌	❌	❌
14.2.0			❌
14.1.3	✅		✅

It seems to me, that it broke with Next.js v14.2+, independent of the SDK version.

[andreas-unleash]

Thanks @simonknittel . My guess is that NextJS changed something in Turbopack. We will definitely look into it but you did say that not using Turbopack does not give you the error right?

[simonknittel]

Yes, it's only an issue when using Turbopack.

I'm aware that Turbopack isn't fully production ready yet, but I thought to give you an heads-up 🙂