Skip to content

Conversation

@sergical
Copy link
Member

@sergical sergical commented Nov 3, 2025

Fix integrations wrapper visibility in code blocks with line highlighting

Problem

The integrations array wrapper (integrations: [ and ],) wasn't showing/hiding correctly in the Vue quickstart and other guides that use line highlighting syntax (e.g., {3, 12-41}).

Root Cause

When code blocks have line highlighting, the makeHighlightBlocks function wraps highlighted lines in <HighlightBlock> components. This changed the DOM structure so that lines were no longer direct children of the <code> element, but nested inside containers.

The runtime logic in updateElementsVisibilityForOptions assumed lines were direct children, causing allLines.indexOf(openLine) to return -1 and breaking the wrapper show/hide logic.

Solution

Added a getAllCodeLines helper function that properly traverses the code block structure, extracting lines from both:

  • Direct children (non-highlighted lines)
  • Nested children inside HighlightBlock containers (highlighted lines)

This ensures the integrations wrapper visibility logic works correctly regardless of whether the code block uses line highlighting.

Files Changed

  • src/components/onboarding/index.tsx - Added helper to handle nested line structure in highlighted code blocks

IS YOUR CHANGE URGENT?

Help us prioritize incoming PRs by letting us know when the change needs to go live.

  • Urgent deadline (GA date, etc.):
  • Other deadline:
  • None: Not urgent, can wait up to 1 week+

SLA

  • Teamwork makes the dream work, so please add a reviewer to your PRs.
  • Please give the docs team up to 1 week to review your PR unless you've added an urgent due date to it.
    Thanks in advance for your help!

PRE-MERGE CHECKLIST

Make sure you've checked the following before merging your changes:

  • Checked Vercel preview for correctness, including links
  • PR was reviewed and approved by any necessary SMEs (subject matter experts)
  • PR was reviewed and approved by a member of the Sentry docs team

LEGAL BOILERPLATE

Look, I get it. The entity doing business as "Sentry" was incorporated in the State of Delaware in 2015 as Functional Software, Inc. and is gonna need some rights from me in order to utilize my contributions in this here PR. So here's the deal: I retain all rights, title and interest in and to my contributions, and by keeping this boilerplate intact I confirm that Sentry can use, modify, copy, and redistribute my contributions, under Sentry's choice of terms.

EXTRA RESOURCES

@sergical sergical marked this pull request as ready for review November 3, 2025 17:36
@vercel
Copy link

vercel bot commented Nov 3, 2025

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Preview Comments Updated (UTC)
develop-docs Ready Ready Preview Comment Nov 3, 2025 5:53pm
sentry-docs Ready Ready Preview Comment Nov 3, 2025 5:53pm

@codecov
Copy link

codecov bot commented Nov 3, 2025

Bundle Report

Changes will increase total bundle size by 9.14kB (0.04%) ⬆️. This is within the configured threshold ✅

Detailed changes
Bundle name Size Change
sentry-docs-client-array-push 10.16MB 161 bytes (0.0%) ⬆️
sentry-docs-server-cjs 12.85MB 8.98kB (0.07%) ⬆️

Affected Assets, Files, and Routes:

view changes for bundle: sentry-docs-client-array-push

Assets Changed:

Asset Name Size Change Total Size Change (%)
static/chunks/pages/_app-*.js -3 bytes 882.71kB -0.0%
static/chunks/8321-*.js -3 bytes 425.87kB -0.0%
static/chunks/app/[[...path]]/page-*.js 167 bytes 94.73kB 0.18%
server/middleware-*.js -6.46kB 1.0kB -86.59%
server/middleware-*.js 6.46kB 7.46kB 645.5% ⚠️
static/VYye1fB1RXPjXZoXHTEdL/_buildManifest.js (New) 684 bytes 684 bytes 100.0% 🚀
static/VYye1fB1RXPjXZoXHTEdL/_ssgManifest.js (New) 77 bytes 77 bytes 100.0% 🚀
static/z5APyV7ycZaSG4hICz1P2/_buildManifest.js (Deleted) -684 bytes 0 bytes -100.0% 🗑️
static/z5APyV7ycZaSG4hICz1P2/_ssgManifest.js (Deleted) -77 bytes 0 bytes -100.0% 🗑️

Files in static/chunks/app/[[...path]]/page-*.js:

  • ./src/components/onboarding/index.tsx → Total Size: 20.08kB
view changes for bundle: sentry-docs-server-cjs

Assets Changed:

Asset Name Size Change Total Size Change (%)
1729.js -3 bytes 1.74MB -0.0%
../instrumentation.js -3 bytes 1.07MB -0.0%
9523.js -3 bytes 1.04MB -0.0%
../app/[[...path]]/page.js.nft.json 2.94kB 849.9kB 0.35%
../app/platform-redirect/page.js.nft.json 2.94kB 849.82kB 0.35%
../app/sitemap.xml/route.js.nft.json 2.94kB 847.05kB 0.35%
../app/[[...path]]/page.js 167 bytes 615.8kB 0.03%

Files in ../app/[[...path]]/page.js:

  • ./src/components/onboarding/index.tsx → Total Size: 1.79kB

  • ./src/components/onboarding/index.tsx → Total Size: 18.92kB

App Routes Affected:

App Route Size Change Total Size Change (%)
/[[...path]] 167 bytes 3.36MB 0.0%

@sergical sergical merged commit 402483b into master Nov 4, 2025
15 checks passed
@sergical sergical deleted the sergical/fix-highlight-integrations branch November 4, 2025 15:20
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.

3 participants