Skip to content

feat: ✨ add options to use Next Script Component or a regular script tag#163

Merged
HofmannZ merged 1 commit intodevelopmentfrom
@davevanhoorn/fix/script-tag-and-next-script-component
Mar 25, 2025
Merged

feat: ✨ add options to use Next Script Component or a regular script tag#163
HofmannZ merged 1 commit intodevelopmentfrom
@davevanhoorn/fix/script-tag-and-next-script-component

Conversation

@davevanhoorn
Copy link
Contributor

When using Sentry and next-runtime-env, we ran into a race condition with Sentry's client side configuration sentry.client.config.ts:

  1. A user visits our application
  2. The webpage loads
  3. Sentry's sentry.client.config.ts runs before our <PublicEnvScript />, and looks for env('DEPLOYMENT_ENV'), but these values are undefined
  4. Next.js Script component defaults to "beforeInteractive" and adds the runtime variables to window.__ENV after Sentry's init.

For now, the quickest solution is to enable users to use both Next.js Script Component and a regular script tag.

@davevanhoorn davevanhoorn requested a review from Copilot March 10, 2025 14:15
Copy link

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

PR Overview

This PR adds the option to choose between the Next.js Script Component and a regular <script> tag in order to work around a Sentry timing issue related to runtime environment initialization.

  • Added two new optional props (withNextScriptComponent and nextScriptComponentProps) to EnvScript for toggling component usage and customizing the Next.js Script Component.
  • Updated the component implementation to conditionally render either a Next.js Script or a regular <script> tag.
  • Extended test coverage in env-script.spec.tsx to verify the new behavior for both rendering strategies.

Reviewed Changes

File Description
src/script/env-script.tsx Introduces new props and conditional rendering to support two modes.
src/script/env-script.spec.tsx Adds tests to ensure correct attribute propagation and behavior.

Copilot reviewed 2 out of 2 changed files in this pull request and generated no comments.

@HofmannZ HofmannZ force-pushed the @davevanhoorn/fix/script-tag-and-next-script-component branch 2 times, most recently from 02ed4d6 to 68e7fe5 Compare March 25, 2025 17:00
@HofmannZ HofmannZ marked this pull request as ready for review March 25, 2025 17:01
@codecov
Copy link

codecov bot commented Mar 25, 2025

Codecov Report

All modified and coverable lines are covered by tests ✅

Project coverage is 100.00%. Comparing base (669f9cb) to head (3feb6c0).
Report is 6 commits behind head on development.

Additional details and impacted files
@@              Coverage Diff              @@
##           development      #163   +/-   ##
=============================================
  Coverage       100.00%   100.00%           
=============================================
  Files               12        12           
  Lines               89        95    +6     
  Branches            14        17    +3     
=============================================
+ Hits                89        95    +6     

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:
  • ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

@HofmannZ HofmannZ force-pushed the @davevanhoorn/fix/script-tag-and-next-script-component branch from 68e7fe5 to 3feb6c0 Compare March 25, 2025 17:02
@HofmannZ HofmannZ merged commit b8423a4 into development Mar 25, 2025
20 checks passed
@HofmannZ HofmannZ deleted the @davevanhoorn/fix/script-tag-and-next-script-component branch March 25, 2025 17:06
@expatfile-bot
Copy link
Member

🎉 This PR is included in version 3.3.0-alpha.3 🎉

The release is available on:

Your semantic-release bot 📦🚀

@expatfile-bot
Copy link
Member

🎉 This PR is included in version 3.3.0 🎉

The release is available on:

Your semantic-release bot 📦🚀

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants