Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Since v3.2.0: ReferenceError: CSS is not defined #9598

Closed
janus-reith opened this issue Nov 28, 2024 · 5 comments · Fixed by #9603
Closed

Since v3.2.0: ReferenceError: CSS is not defined #9598

janus-reith opened this issue Nov 28, 2024 · 5 comments · Fixed by #9603
Assignees

Comments

@janus-reith
Copy link

janus-reith commented Nov 28, 2024

Describe the Bug

v3.2.0 seems to have introduced some error that surfaces on production builds.
Versions prior that version don't have that issue.

While the admin panel seems to work properly, the document is returned with a Status 500 and the server throws:

ReferenceError: CSS is not defined
    at /Users/someuser/Fiddles/test-payload/.next/server/app/(payload)/admin/[[...segments]]/page.js:43:52079
    at Object.ne [as useMemo] (/Users/someuser/Fiddles/test-payload/node_modules/.pnpm/next@15.0.0_react-dom@19.0.0-rc-65a56d0e-20241020_react@19.0.0-rc-65a56d0e-20241020/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:20:36390)
    at t.useMemo (/Users/someuser/Fiddles/test-payload/node_modules/.pnpm/next@15.0.0_react-dom@19.0.0-rc-65a56d0e-20241020_react@19.0.0-rc-65a56d0e-20241020/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:68:6677)
    at ae (/Users/someuser/Fiddles/test-payload/.next/server/app/(payload)/admin/[[...segments]]/page.js:43:52060)
    at at (/Users/someuser/Fiddles/test-payload/.next/server/app/(payload)/admin/[[...segments]]/page.js:43:53220)
    at nj (/Users/someuser/Fiddles/test-payload/node_modules/.pnpm/next@15.0.0_react-dom@19.0.0-rc-65a56d0e-20241020_react@19.0.0-rc-65a56d0e-20241020/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:20:45788)
    at nO (/Users/someuser/Fiddles/test-payload/node_modules/.pnpm/next@15.0.0_react-dom@19.0.0-rc-65a56d0e-20241020_react@19.0.0-rc-65a56d0e-20241020/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:20:47563)
    at nN (/Users/someuser/Fiddles/test-payload/node_modules/.pnpm/next@15.0.0_react-dom@19.0.0-rc-65a56d0e-20241020_react@19.0.0-rc-65a56d0e-20241020/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:20:65362)
    at nM (/Users/someuser/Fiddles/test-payload/node_modules/.pnpm/next@15.0.0_react-dom@19.0.0-rc-65a56d0e-20241020_react@19.0.0-rc-65a56d0e-20241020/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:20:62993)
    at nH (/Users/someuser/Fiddles/test-payload/node_modules/.pnpm/next@15.0.0_react-dom@19.0.0-rc-65a56d0e-20241020_react@19.0.0-rc-65a56d0e-20241020/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:20:68775) {
  digest: '1122664388'
}

I also tried switching between nextjs 15 minor versions and react 19 rc versions, made no difference.
I suspect that some code meant for the client gets bundled server side.

Link to the code that reproduces this issue

pnpm dlx create-payload-app

Reproduction Steps

  1. pnpm dlx create-payload-app
  2. pnpm build
  3. pnpm start

Which area(s) are affected? (Select all that apply)

area: core

Environment Info

Probably not OS specific, happens both on macOS and Linux.

Node.js v22.2.0

Binaries:
  Node: 22.2.0
  npm: 10.7.0
  Yarn: N/A
  pnpm: 8.15.1
Relevant Packages:
  payload: 3.2.0
  next: 15.0.0
  @payloadcms/email-nodemailer: 3.2.0
  @payloadcms/graphql: 3.2.0
  @payloadcms/next/utilities: 3.2.0
  @payloadcms/payload-cloud: 3.2.0
  @payloadcms/richtext-lexical: 3.2.0
  @payloadcms/translations: 3.2.0
  @payloadcms/ui/shared: 3.2.0
  react: 19.0.0-rc-65a56d0e-20241020
  react-dom: 19.0.0-rc-65a56d0e-20241020
@janus-reith janus-reith added status: needs-triage Possible bug which hasn't been reproduced yet validate-reproduction labels Nov 28, 2024
Copy link
Contributor

Please add a reproduction in order for us to be able to investigate.

Depending on the quality of reproduction steps, this issue may be closed if no reproduction is provided.

Why was this issue marked with the invalid-reproduction label?

To be able to investigate, we need access to a reproduction to identify what triggered the issue. We prefer a link to a public GitHub repository created with create-payload-app@beta -t blank or a forked/branched version of this repository with tests added (more info in the reproduction-guide).

To make sure the issue is resolved as quickly as possible, please make sure that the reproduction is as minimal as possible. This means that you should remove unnecessary code, files, and dependencies that do not contribute to the issue. Ensure your reproduction does not depend on secrets, 3rd party registries, private dependencies, or any other data that cannot be made public. Avoid a reproduction including a whole monorepo (unless relevant to the issue). The easier it is to reproduce the issue, the quicker we can help.

Please test your reproduction against the latest version of Payload to make sure your issue has not already been fixed.

I added a link, why was it still marked?

Ensure the link is pointing to a codebase that is accessible (e.g. not a private repository). "example.com", "n/a", "will add later", etc. are not acceptable links -- we need to see a public codebase. See the above section for accepted links.

Useful Resources

@AlessioGr AlessioGr self-assigned this Nov 28, 2024
@AlessioGr AlessioGr added the status: verified If an issue has been reproduced label Nov 28, 2024
@github-actions github-actions bot removed the status: needs-triage Possible bug which hasn't been reproduced yet label Nov 28, 2024
@AlessioGr AlessioGr added status: needs-triage Possible bug which hasn't been reproduced yet prioritized and removed status: needs-triage Possible bug which hasn't been reproduced yet labels Nov 28, 2024
@github-actions github-actions bot removed the status: verified If an issue has been reproduced label Nov 28, 2024
AlessioGr added a commit that referenced this issue Nov 28, 2024
Related: #9456
Fixes #9598

This ensures that the `CSS` property is accessed safely, preventing the
"CSS is not defined" error
@AlessioGr
Copy link
Member

Fixed! Here's a canary with the fix if you don't wanna wait for the next release: 3.2.2-canary.a11698b

@janus-reith
Copy link
Author

Fixed! Here's a canary with the fix if you don't wanna wait for the next release: 3.2.2-canary.a11698b

Awesome, thanks! Really happy with the performance improvements in 3.2, they make a huge difference :)

Copy link
Contributor

🚀 This is included in version v3.2.2

Copy link
Contributor

github-actions bot commented Dec 1, 2024

This issue has been automatically locked.
Please open a new issue if this issue persists with any additional detail.

@github-actions github-actions bot locked as resolved and limited conversation to collaborators Dec 1, 2024
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants