Missing LCP/CLS measurements

[efarem]

Is there an existing issue for this?

• I have checked for existing issues https://github.com/getsentry/sentry-javascript/issues
• I have reviewed the documentation https://docs.sentry.io/
• I am using the latest SDK release https://github.com/getsentry/sentry-javascript/releases

How do you use Sentry?

Sentry Saas (sentry.io)

Which SDK are you using? If you use the CDN bundles, please specify the exact bundle (e.g. bundle.tracing.min.js) in your SDK setup.

@sentry/nextjs

SDK Version

7.40.0

Framework Version

No response

Link to Sentry event

No response

SDK Setup

No response

Steps to Reproduce

• Use a BrowserTracing idleTimeout large enough to allow for the page to fully load
• Do not interact with the page
• Inspect the network request to Sentry ingress
• Find the event ID
• Query the event in Sentry discovery with id:{event_id}
• Notice the lack of LCP/CLS

Expected Result

Expected to see LCP/CLS measurements.

• This line shows the report() callback being called for LCP.
• This line shows the report() callback being called for CLS.

Notice both of the above trigger the report function with no arguments, report() is a result of bindReporter and will only ever record a measurement if true is passed as the forceReport argument.

This has been present for LCP since the _reportAllChanges option was removed here.

CLS appears to only report onHidden.

Actual Result

No LCP or CLS measurements are ever recorded.

[efarem]

I realise that the web-vitals documentation suggests that reportAllChanges is "not needed (or recommended)" but in this case I believe it is. The problem being that in most cases Sentry has flushed the pageload transaction before LCP data has been collected at all -- regardless of whether the user has interacted.
I can imagine that in typical usage of the web-vitals library the report could -- perhaps even should -- happen immediately after page load has completed irrespective of user interaction.

I'd be happy to fix this myself as it'd help my team, any chance that someone from Sentry could take a look and guide me on a potential fix?

[AbhiPrasad]

Hey @efarem thanks for writing in! This is simply a case where your transaction ends before LCP fires. To fix this, we recommend bumping the idleTimeout option. By default this is 1000 ms, so maybe something like 3000 ms fits better?

[efarem]

Hi @AbhiPrasad, I have idleTimeout set to 5000, LCP is never reported unless the user interacts click/keypress

[AbhiPrasad]

Gotcha - maybe we need to record LCP on transaction finish then. Let me open a PR.

[AbhiPrasad]

Yeah let's record LCP on transaction finish. This should hopefully help improve the number of LCP measurements here!

[efarem]

Thanks, this also happens with CLS. You only see CLS measurements when onHidden is called.

[AbhiPrasad]

Thanks, this also happens with CLS. You only see CLS measurements when onHidden is called.

Good point, will address this with the PR as well!

[AbhiPrasad]

Will cut a release with this change today!

[AbhiPrasad]

Released with https://github.com/getsentry/sentry-javascript/releases/tag/7.42.0!

[nadavgover]

@AbhiPrasad is there a fix required also for sentry/react?