Fix locally-imported SVG files (direct or barrel-re-exported) missing from Session Replay - #1350
Merged
Merged
Conversation
buildSvgMap() is a no-op until setApiTypes() has been called (it guards on this.t). Both the plugin's pre() hook and the generate-sr-assets CLI called buildSvgMap() first, so the project-wide SVG scan silently produced an empty map on every real build.
For `export { default as Logo } from './icon.svg'`, the scan keyed
the map entry on spec.local.name ('default') instead of spec.exported
('Logo') -- the name consumers actually import and render as <Logo/>.
Aliased re-exports were therefore never matched.
🎉 All green!🧪 All tests passed 🔗 Commit SHA: a10ebaa | Docs | Datadog PR Page | Give us feedback! |
There was a problem hiding this comment.
Pull request overview
This PR fixes Session Replay SVG asset extraction for SVGs imported from local .svg files (including via barrel re-exports) by ensuring the SVG import scan actually runs and by correcting how re-exported names are keyed.
Changes:
- Ensure
setApiTypes()is invoked beforebuildSvgMap()so the local.svgimport scan doesn’t silently no-op. - Fix barrel re-export mapping so
export { default as Logo } from './icon.svg'is keyed underLogo(notdefault). - Add/extend tests covering
buildSvgMap()population for default/named imports and re-exports.
Reviewed changes
Copilot reviewed 4 out of 4 changed files in this pull request and generated 3 comments.
| File | Description |
|---|---|
| packages/react-native-babel-plugin/test/react-native-svg.test.ts | Adds tests validating buildSvgMap() behavior for imports and re-exports. |
| packages/react-native-babel-plugin/src/libraries/react-native-svg/index.ts | Fixes exported-name handling for SVG barrel re-exports during scan. |
| packages/react-native-babel-plugin/src/index.ts | Adjusts plugin initialization order and attempts to reuse the SVG processor instance. |
| packages/react-native-babel-plugin/src/cli/generate-sr-assets.ts | Initializes SVG scan in the CLI by setting Babel types before building the map. |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
pre() assigned options.__internal_reactNativeSVG directly with no fallback, so in a real build (no injected instance) every file discarded the previous scan and rebuilt/rescanned from scratch.
pre() runs before Program.enter's own platform === 'web' check, so the scan ran regardless of platform even though nothing downstream uses its results for web (Program.enter/JSXElement skip immediately). Before this fix's ordering change, buildSvgMap() was a no-op there by accident; now that it actually runs, web builds would otherwise pay for a full project scan they never needed. Also adds a regression test proving pre() reuses the same ReactNativeSVG instance across files (only one buildSvgMap() call for two files processed by the same plugin instance).
buildSvgMap() used its own hardcoded, much shorter ignore list and never considered followSymlinks, so generate-sr-assets could scan directories (build output, native folders, user --ignore targets) that its own file-processing loop was told to skip -- doing significantly more work than necessary.
jonathanmos
force-pushed
the
jmoskovich/fix-svg-not-captured
branch
from
July 27, 2026 11:19
0ef8dc9 to
9372190
Compare
The same pattern was listed twice, causing fast-glob to match it against the filesystem twice for no benefit.
svgMap accumulated one entry per processed SVG element (write-only, never read anywhere) and svgOffset was never read or written at all. Now that pre() reuses the ReactNativeSVG instance across files, this dead state would grow unboundedly for the life of the worker instead of being discarded per file -- removing it entirely rather than resetting it per file, since nothing consumes it.
cdn34dd
approved these changes
Jul 28, 2026
Contributor
|
@jonathanmos Since we're now making improvements to this babel code, this may be worth looking into: |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
What does this PR do?
Inline ... JSX shapes always worked correctly. But an SVG referenced via a separate file import — import Logo from './logo.svg', or re-exported through a barrel (export { default as Logo } from './logo.svg') — was never captured in Session Replay, in any build. Root cause: buildSvgMap(), the scan that resolves these file imports, never actually ran due to an initialization-order bug, plus two compounding issues that would have kept it broken even after that.
Changes
Motivation
What inspired you to submit this pull request?
Additional Notes
Anything else we should know when reviewing?
Review checklist (to be filled by reviewers)