feat(browser): Add CLS sources to span attributes#16710
Merged
AbhiPrasad merged 1 commit intodevelopfrom Jun 24, 2025
Merged
Conversation
Contributor
size-limit report 📦
|
Member
|
Mhm, are we ok with that bundle-size increase? |
Contributor
Author
|
I think we are. When span streaming comes we'll drop attaching CLS as measurements in favour of only using standalone spans, so I think this is the right direction to go down. |
This was referenced Sep 29, 2025
This was referenced Oct 7, 2025
This was referenced Oct 15, 2025
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
4 participants
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.
resolves #16707
The session focused on enhancing CLS (Cumulative Layout Shift) spans by adding attributes detailing the elements that caused layout shifts.
packages/browser-utils/src/metrics/cls.ts, thesendStandaloneClsSpanfunction was updated. It now iterates overLayoutShiftentry sources and adds them ascls.source.Nattributes to the span, converting DOM nodes to readable CSS selectors usinghtmlTreeAsString(). This aligns standalone CLS spans with the existing implementation for regular pageload spans.dev-packages/browser-integration-tests/suites/tracing/metrics/web-vitals-cls-standalone-spans/test.tswere updated to assert the presence of these newcls.source.Nattributes on the captured CLS spans.yarn.lockwas updated to reflect changes in dependency resolutions, likely due to package installations during the session.