Uncaught TypeError: Cannot read properties of undefined (reading 'startTime') in `getCLS` logic #6083

Tofandel · 2022-10-28T12:13:47Z

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?

Self-hosted/on-premise

Which package are you using?

@sentry/vue

SDK Version

7.17.2

Framework Version

7.17.2

Link to Sentry event

https://sentry.tukan.hu/share/issue/cc80369f87ff438e88e5d6caf67987c9/

Steps to Reproduce

Move the mouse around on an element creating a layout shift (eg a row that expands on hover)

Expected Result

No error

Actual Result

Js error on line
https://github.com/getsentry/sentry-javascript/blob/master/packages/tracing/src/browser/web-vitals/getCLS.ts#L64
Uncaught TypeError: Cannot read properties of undefined (reading 'startTime')

firstSessionEntry and lastSessionEntry are undefined but being used without any check

The text was updated successfully, but these errors were encountered:

AbhiPrasad · 2022-10-28T12:26:35Z

Hey @Tofandel, thanks for reporting!

This is related to us upgrading to web vitals v3 #5987, and seems to be a problem with web vitals as well:

https://github.com/GoogleChrome/web-vitals/blob/7f0ed0bfb03c356e348a558a3eda111b498a2a11/src/onCLS.ts#L83-L91

@philipwalton do we have to adjust the logic in web vitals repo - or is this a case that shouldn't be possible?

philipwalton · 2022-10-28T23:51:24Z

@philipwalton do we have to adjust the logic in web vitals repo - or is this a case that shouldn't be possible?

I don't believe this case should be possible, so I'm not sure how it's happening here.

Referencing the startTime property of firstSessionEntry and lastSessionEntry only ever happens behind a check for sessionValue being truthy, and the only way session sessionValue can be truthy is if session entries have also been set.

I'd need more context for the error report in order to know whether or not it reflects a real case or perhaps just a fluke error.

tylerzey · 2022-10-29T00:54:31Z

I'm seeing the same error with @sentry/nextjs. (Hosting a react app on vercel)

Tofandel · 2022-10-29T09:55:28Z

@philipwalton it's definitely not a fluke, I get the error every single layout shift 100% of the time

timfish · 2022-10-29T10:34:34Z

Looking through the changes for the Web Vitals v3 update I performed, the sessionEntries.length !== 0 check has been lost from here:

Before:

sentry-javascript/packages/tracing/src/browser/web-vitals/getCLS.ts

Lines 54 to 59 in 5386ce7

    
           if ( 
        
             sessionValue && 
        
             sessionEntries.length !== 0 && 
        
             entry.startTime - lastSessionEntry.startTime < 1000 && 
        
             entry.startTime - firstSessionEntry.startTime < 5000 
        
           ) {

After:

sentry-javascript/packages/tracing/src/browser/web-vitals/getCLS.ts

Lines 62 to 66 in 25b5f6f

    
           if ( 
        
             sessionValue && 
        
             entry.startTime - lastSessionEntry.startTime < 1000 && 
        
             entry.startTime - firstSessionEntry.startTime < 5000 
        
           ) {

This check was added in this PR but as far as I can tell, the sessionEntries.length check has never existed in the Web Vitals source.

Let me do some debugging and I'll get back to you...

timfish · 2022-10-29T11:22:11Z

I'm unable to reproduce the error with the most basic example:

<!DOCTYPE html>
<html lang="en">
  <head>
    <title>CLS Test</title>
    <style>
      .test:hover {
        padding-top: 200px;
      }
    </style>
  </head>
  <body>
    <h1 class="test">Hello, world!</h1>

    <script src="https://browser.sentry-cdn.com/7.17.2/bundle.tracing.debug.min.js"></script>
    <script>
      Sentry.init({
        dsn: "__DSN__",
        debug: true,
        release: "tracing-demo@1.2.3-test",
        integrations: [new Sentry.BrowserTracing()],
        tracesSampleRate: 1.0,
      });
    </script>
  </body>
</html>

Any info that may help me reproduce the issue locally would be greatly appreciated!

Inlustra · 2022-10-29T15:05:43Z

I can confirm that I'm also seeing this.
I'm seeing this with NextJS and @sentry/nextjs also when running in dev mode.

philipwalton · 2022-10-29T18:12:22Z

@philipwalton it's definitely not a fluke, I get the error every single layout shift 100% of the time

@Tofandel do you have an repro you could share? Even if not a reduced case, I'd like to try debugging to see how this is happening.

paraboul · 2022-10-30T07:42:06Z

Also seeing this reported in production (@sentry/vue).

Tofandel · 2022-10-30T10:06:29Z

Humm well now that I reverted to previous version and reupgraded to make a reproduction, I'm trying the same thing as before and it's not happening at all... When before it was always happening 🤔

Looking at the source, it does make sense it wouldn't happen because sessionValue starts at 0 and only gets set when sessionEntries gets set as well.. All variables seem scoped so unless there is some black magic happening with object references. This is a WTF moment

The only thing that makes sense is this is a race condition between the extremely short amount of time sessionValue = entry.value; and sessionEntries = [entry]; are executed, the handleEntries fires another time from another event, so unless it fires 3000 times a second I don't see this happening all the time like it did before

dahanyosi · 2022-10-30T16:57:39Z

Same issue here, getting several errors every few minutes

AbhiPrasad · 2022-10-31T08:32:55Z

@timfish for the time being let’s just add a Boolean check to the conditional to unblock users? We can then cut a patch release with that.

We can always revert it later when we investigate more and reproduce it.

AbhiPrasad · 2022-10-31T11:36:20Z

This has been released with https://github.com/getsentry/sentry-javascript/releases/tag/7.17.3, closing as such, but maybe we should open an issue in the web vitals repo and continue investigating there?

Tofandel added the Type: Bug label Oct 28, 2022

getsantry bot added the Status: Untriaged label Oct 28, 2022

AbhiPrasad added Package: tracing labels Oct 28, 2022

getsantry bot removed Status: Untriaged labels Oct 28, 2022

AbhiPrasad changed the title ~~[Tracing] Js error~~ Uncaught TypeError: Cannot read properties of undefined (reading 'startTime') in getCLS logic Oct 28, 2022

AbhiPrasad mentioned this issue Oct 29, 2022

Web Vitals GetCLS - failing with Cannot read properties of undefined (reading 'startTime') #6087

Closed

3 tasks

timfish mentioned this issue Oct 31, 2022

fix(tracing): Add an extra conditional check to web vitals onCLS() #6091

Merged

AbhiPrasad added Status: In Progress and removed Status: Needs Discussion labels Oct 31, 2022

AbhiPrasad assigned timfish Oct 31, 2022

AbhiPrasad mentioned this issue Oct 31, 2022

meta: CHANGELOG for 7.17.3 #6092

Merged

AbhiPrasad closed this as completed Oct 31, 2022

masinette mentioned this issue Nov 8, 2022

Cannot read properties of undefined (reading 'startTime') getsentry/sentry#41066

Closed

philipwalton mentioned this issue Sep 27, 2024

Add a guard to prevent errors in the onCLS() function GoogleChrome/web-vitals#536

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uncaught TypeError: Cannot read properties of undefined (reading 'startTime') in `getCLS` logic #6083

Uncaught TypeError: Cannot read properties of undefined (reading 'startTime') in `getCLS` logic #6083

Tofandel commented Oct 28, 2022 •

edited

Loading

AbhiPrasad commented Oct 28, 2022

philipwalton commented Oct 28, 2022

tylerzey commented Oct 29, 2022

Tofandel commented Oct 29, 2022

timfish commented Oct 29, 2022 •

edited

Loading

timfish commented Oct 29, 2022 •

edited

Loading

Inlustra commented Oct 29, 2022 •

edited

Loading

philipwalton commented Oct 29, 2022

paraboul commented Oct 30, 2022

Tofandel commented Oct 30, 2022

dahanyosi commented Oct 30, 2022

AbhiPrasad commented Oct 31, 2022

AbhiPrasad commented Oct 31, 2022

Uncaught TypeError: Cannot read properties of undefined (reading 'startTime') in getCLS logic #6083

Uncaught TypeError: Cannot read properties of undefined (reading 'startTime') in getCLS logic #6083

Comments

Tofandel commented Oct 28, 2022 • edited Loading

Is there an existing issue for this?

How do you use Sentry?

Which package are you using?

SDK Version

Framework Version

Link to Sentry event

Steps to Reproduce

Expected Result

Actual Result

AbhiPrasad commented Oct 28, 2022

philipwalton commented Oct 28, 2022

tylerzey commented Oct 29, 2022

Tofandel commented Oct 29, 2022

timfish commented Oct 29, 2022 • edited Loading

timfish commented Oct 29, 2022 • edited Loading

Inlustra commented Oct 29, 2022 • edited Loading

philipwalton commented Oct 29, 2022

paraboul commented Oct 30, 2022

Tofandel commented Oct 30, 2022

dahanyosi commented Oct 30, 2022

AbhiPrasad commented Oct 31, 2022

AbhiPrasad commented Oct 31, 2022

Uncaught TypeError: Cannot read properties of undefined (reading 'startTime') in `getCLS` logic #6083

Uncaught TypeError: Cannot read properties of undefined (reading 'startTime') in `getCLS` logic #6083

Tofandel commented Oct 28, 2022 •

edited

Loading

timfish commented Oct 29, 2022 •

edited

Loading

timfish commented Oct 29, 2022 •

edited

Loading

Inlustra commented Oct 29, 2022 •

edited

Loading