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 empty strategy props not working in _document.js #65580

Closed
hwangstar156 opened this issue May 9, 2024 · 0 comments · Fixed by #65585
Closed

next/script empty strategy props not working in _document.js #65580

hwangstar156 opened this issue May 9, 2024 · 0 comments · Fixed by #65585
Labels
bug Issue was opened via the bug report template. Script (next/script) Related to Next.js Script Optimization.

Comments

@hwangstar156
Copy link
Contributor

hwangstar156 commented May 9, 2024 •
edited

Link to the code that reproduces this issue

https://github.com/hwangstar156/nextjs-bug-demo/blob/main/pages/_document.tsx

To Reproduce

next/script with empty strategy props

    // _document.tsx

      <Html lang="ko">
        <Head>
            <Script src="https://cdn.jsdelivr.net/npm/react-query@3.39.3/dist/react-query.production.min.js" /> // not working
        </Head>
        <body>
          <Main />
          <NextScript />
        </body>
      </Html>

chrome devtools network tap

스크린샷 2024-05-10 오전 3 00 56

next/script with afterInteractive strategy props

    // _document.tsx

      <Html lang="ko">
        <Head>
            <Script src="https://cdn.jsdelivr.net/npm/react-query@3.39.3/dist/react-query.production.min.js" strategy="afterInteractive" /> // but this example is working
        </Head>
        <body>
          <Main />
          <NextScript />
        </body>
      </Html>

chrome devtools network tap

스크린샷 2024-05-10 오전 3 01 23

Current vs. Expected behavior

If nextjs' empty strategy prop in _document.js, the script will not be loaded. However, if afterInteractive strategy props are given, it works normally. Since the default setting of empty strategy props is afterInteractive, in this case, one would expect it to operate normally like the previous example, but that is not the case.

Provide environment information

Operating System:
  Platform: darwin
  Arch: x64
  Version: Darwin Kernel Version 21.6.0: Thu Nov  9 00:38:19 PST 2023; root:xnu-8020.240.18.705.10~1/RELEASE_X86_64
  Available memory (MB): 32768
  Available CPU cores: 12
Binaries:
  Node: 18.17.0
  npm: 9.6.7
  Yarn: 1.22.19
  pnpm: 7.22.0
Relevant Packages:
  next: 14.3.0-canary.53 // Latest available version is detected (14.3.0-canary.53).
  eslint-config-next: N/A
  react: 18.3.1
  react-dom: 18.3.1
  typescript: 5.1.3
Next.js Config:
  output: N/A

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

Script (next/script)

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

next dev (local), next build (local), next start (local)

Additional context

No response
@hwangstar156 hwangstar156 added the bug Issue was opened via the bug report template. label May 9, 2024
@github-actions github-actions bot added the Script (next/script) Related to Next.js Script Optimization. label May 9, 2024
@hwangstar156 hwangstar156 mentioned this issue May 9, 2024
Merged
ijjk added a commit that referenced this issue May 15, 2024
@hwangstar156 @ijjk
Add script to script loader when strategy prop is undefined (#65585)
337666b 
### Fixing a bug

fixes #65580 

### What?

#65580 

### Why?

Currently, afterInteractive is given as the default strategy prop, but
afterInteractive is not set for the child retrieved through
React.Children, and it is an empty prop and is not added to the script
loader, so the script is not executed.

### How?

Added item to script loader when `child.props.strategy` is undefined.

---------

Co-authored-by: JJ Kasper <jj@jjsweb.site>
panteliselef pushed a commit to panteliselef/next.js that referenced this issue May 20, 2024
@hwangstar156 @ijjk @panteliselef
Add script to script loader when strategy prop is undefined (vercel#6…
e30e520 
…5585)

### Fixing a bug

fixes vercel#65580 

### What?

vercel#65580 

### Why?

Currently, afterInteractive is given as the default strategy prop, but
afterInteractive is not set for the child retrieved through
React.Children, and it is an empty prop and is not added to the script
loader, so the script is not executed.

### How?

Added item to script loader when `child.props.strategy` is undefined.

---------

Co-authored-by: JJ Kasper <jj@jjsweb.site>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
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

Successfully merging a pull request may close this issue.

Add script to script loader when strategy prop is undefined hwangstar156/next.js
1 participant
@hwangstar156