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

Resolves document.querySelector not a function when doing SSR with Next.js #2538

Conversation

mohsenasfia
Copy link

Addresses #2391 and resolves the issue when trying to render lit components with SSR in NextJS where the @lit-labs/ssr/lib/install-global-dom-shim.js is necessary to be imported, but the compilation results in the following error in styled-jsx package:
TypeError .. document.querySelector is not a function
Code sandbox repo which reproduces the issue

… in NextJS where the @lit-labs/ssr/lib/install-global-dom-shim.js is necessary to be imported, but the compilation results in this error in styled-jsx package: TypeError .. document.querySelector is not a function
@changeset-bot
Copy link

changeset-bot bot commented Feb 15, 2022

🦋 Changeset detected

Latest commit: 939acbe

The changes in this PR will be included in the next version bump.

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@mohsenasfia mohsenasfia changed the title fix: resolves the issue when trying to render lit components with SSR… fix: resolves document.querySelector not a function when doing SSR with Next.js Feb 15, 2022
@mohsenasfia mohsenasfia changed the title fix: resolves document.querySelector not a function when doing SSR with Next.js Resolves document.querySelector not a function when doing SSR with Next.js Feb 15, 2022
@augustjk
Copy link
Member

Thank you for the contribution!

We're taking a stance to keep the DOM shim as minimal as possible. Rather than adding no-op methods to suppress errors, we believe it best for component code to be more intentional about what happens when it does not have access to DOM APIs.

Since this PR and the referenced issue has been opened, we've added node builds that can be safely imported (but not server-rendered) without the global DOM shim, and an isServer environment checker for alleviating errors due to browser code running in the server.

@augustjk augustjk closed this Oct 18, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

2 participants