Skip to content

Unable to use dangerouslySetInnerHTML and beforeInteractive strategy in Script component  #31275

@genetschneider

Description

@genetschneider

What version of Next.js are you using?

14.17.1

What version of Node.js are you using?

12.0.3

What browser are you using?

Chrome

What operating system are you using?

macOS

How are you deploying your application?

npm run dev

Describe the Bug

Setting dangerouslySetInnerHtml in next Script component while also specifying beforeInteractive strategy will result in the Script component doing nothing. Since there is no src specified, the src will simply be (unknown).
script

<Script
  id="test"
  strategy="beforeInteractive"
  dangerouslySetInnerHTML={{
    // will not run
    __html: `console.log('hello!')`,
  }}
/>

Expected Behavior

Script component can be used with no src while using dangerouslySetInnerHtml property.

To Reproduce

Try to render Script component using beforeInteractive while having no url and specifying dangerouslySetInnerHtml property.

<Script
  id="test"
  strategy="beforeInteractive"
  dangerouslySetInnerHTML={{
    // will not run
    __html: `console.log('hello!')`,
  }}
/>

This piece of code of next Script will result in the following script tag being added
script

Metadata

Metadata

Labels

Script (next/script)Related to Next.js Script Optimization.bugIssue was opened via the bug report template.

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions