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.

Sign up for GitHub

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

Jump to bottom

Next/script inside _document.js won't load #37225

Closed
1 task done
timfuhrmann opened this issue May 26, 2022 · 4 comments
Closed
1 task done

Next/script inside _document.js won't load #37225

timfuhrmann opened this issue May 26, 2022 · 4 comments
Assignees
@housseindjirdeh
Labels
bug Issue was opened via the bug report template. Script (next/script) Related to Next.js Script Optimization.

Comments

@timfuhrmann
Copy link
Contributor

Verify canary release

  • I verified that the issue exists in Next.js canary release

Provide environment information

    Operating System:
      Platform: darwin
      Arch: arm64
      Version: Darwin Kernel Version 21.4.0: Fri Mar 18 00:46:32 PDT 2022; root:xnu-8020.101.4~15/RELEASE_ARM64_T6000
    Binaries:
      Node: 17.7.2
      npm: 8.5.2
      Yarn: 1.22.18
      pnpm: N/A
    Relevant packages:
      next: 12.1.7-canary.16
      react: 17.0.2
      react-dom: 17.0.2

What browser are you using? (if relevant)

Chrome 101.0.4951.64

How are you deploying your application? (if relevant)

next dev & next start

Describe the Bug

Usually I've integrated my beforeInteractive next/script's outside of _document.tsx, but since the docs are saying that it's actually supposed to be integrated within _document.tsx, I moved my consent manager. Though it looks just like in the docs, the script won't load - it won't even appear inside of the documents head. Outside of _document.tsx the script works properly.

Expected Behavior

The script should load.

To Reproduce

import Script from "next/script";
import { Head, Html, Main, NextScript } from "next/document";

export default function Document() {
    return (
        <Html>
            <Head />
            <body>
                <Main />
                <NextScript />
                <Script
                    id="usercentrics-cmp"
                    src="https://app.usercentrics.eu/browser-ui/latest/loader.js"
                    data-settings-id="..."
                    strategy="beforeInteractive"
                />
            </body>
        </Html>
    );
}

Same result for every script I have tested.
@timfuhrmann timfuhrmann added the bug Issue was opened via the bug report template. label May 26, 2022
@await-ovo
Copy link
Contributor

It looks like the Script that uses the beforeInteractive strategy can only be placed in the _document Head: #37084

@balazsorban44 balazsorban44 added the Script (next/script) Related to Next.js Script Optimization. label May 27, 2022
@timfuhrmann
Copy link
Contributor Author

It looks like the Script that uses the beforeInteractive strategy can only be placed in the _document Head: #37084

Ahh yes, for canary it seems to be working if placed inside of Head. The stable version still fails to load no matter where Script is placed within document.tsx. I guess this means that only the docs are wrong and it will be fixed?

@timfuhrmann timfuhrmann changed the title Next/script inside of _document.js won't load Next/script inside _document.js won't load May 28, 2022
@housseindjirdeh
Copy link
Collaborator

Yep recent changes that have landed to better support streaming restricted beforeInteractive usage in the _document Head. Docs are currently not reflecting this, but I'll be submitting a patch this week to remove the restriction (i.e. use Script with beforeInteractive anywhere in _document.js)

@github-actions
Copy link
Contributor

github-actions bot commented Jul 1, 2022

This closed issue has been automatically locked because it had no new activity for a month. If you are running into a similar issue, please create a new issue with the steps to reproduce. Thank you.

@github-actions github-actions bot locked as resolved and limited conversation to collaborators Jul 1, 2022
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Assignees

@housseindjirdeh housseindjirdeh

Labels
bug Issue was opened via the bug report template. Script (next/script) Related to Next.js Script Optimization.
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
4 participants
@housseindjirdeh @balazsorban44 @await-ovo @timfuhrmann