[RUM-13448] Add source code context injection for microfrontend #255
Conversation
amortemousque
force-pushed
the
aymeric/rum-microfrontend
branch
2 times, most recently
from
f38fce4 to
761d68d
Compare
yoannmoinet
left a comment
yoannmoinet
left a comment
There was a problem hiding this comment.
Looks super good.
Thanks for tackling this.
Do you think you could also update ownership of the plugin?
build-plugins/.github/CODEOWNERS
Line 26 in ae68609
I mostly had small comments.
packages/tests/src/e2e/sourceCodeContext/sourceCodeContext.spec.ts
Outdated
Show resolved
Hide resolved
|
Looks good! |
amortemousque
force-pushed
the
aymeric/rum-microfrontend
branch
from
761d68d to
da7caff
Compare
|
✅ Tests 🎉 All green!❄️ No new flaky tests detected 🔗 Commit SHA: b9729fe | Docs | Datadog PR Page | Was this helpful? Give us feedback! |
amortemousque
force-pushed
the
aymeric/rum-microfrontend
branch
from
da7caff to
405d4b4
Compare
amortemousque
force-pushed
the
aymeric/rum-microfrontend
branch
from
70018c9 to
536f84d
Compare
| <meta name="viewport" content="width=device-width, initial-scale=1.0" /> | ||
| <link rel="icon" type="image/svg+xml" sizes="21x21" href="data:image/svg+xml," /> | ||
| <title>Source Code Context Test</title> | ||
| <script src="https://www.datadoghq-browser-agent.com/us1/v6/datadog-rum.js" type="text/javascript"></script> |
There was a problem hiding this comment.
Is this the Browser SDK?
Not a fan of having a live resource in the tests.
Would the auto injection work instead?
See my other comment about the plugin's setup.
| sourceCodeContext: { | ||
| service: SERVICE_NAME, | ||
| version: SERVICE_VERSION, | ||
| }, |
There was a problem hiding this comment.
Related to my other comment, I believe if you added the sdk config here, it would work without having to load the SDK from a distant location.
| }, | |
| }, | |
| sdk: { | |
| applicationId: '123', | |
| clientToken: '123', | |
| }, |
| // eslint-disable-next-line no-throw-literal | ||
| throw 'Test error from source code context'; | ||
| }; | ||
| }); |
There was a problem hiding this comment.
Not sure I follow how this works and what it does.
Can you explain?
| await page.click('#trigger_chunk_error'); | ||
|
|
||
| const events = await getRUMEvents(page); | ||
| console.log(events); |
| console.log( | ||
| events | ||
| .filter((event: any) => event.type === 'action') | ||
| .map((event: any) => event.action.target), | ||
| ); |
There was a problem hiding this comment.
Still necessary?
Same for all the other logs.
| (globalThis as any).DD_RUM.init({ | ||
| clientToken: '<CLIENT_TOKEN>', | ||
| applicationId: '<APP_ID>', | ||
| enableExperimentalFeatures: ['source_code_context'], | ||
| beforeSend: (event: any) => { | ||
| (globalThis as any).rum_events.push(event); | ||
| return true; | ||
| }, | ||
| }); |
There was a problem hiding this comment.
If you do the SDK injection, I guess this will need to be updated as well, since you will most likely pass these options to the plugin configuration (except the beforeSend one).
Can this one be added post initialisation?
What and why?
This PR adds source code context injection capabilities to the RUM plugin, enabling customers to identify which microfrontend originates each RUM event in their applications. It focuses on setups with separated bundles loaded via dynamic imports (e.g., module federation) by injecting source code metadata at entry points.
How?