Configurable timeout for initializing the extension?

[jrnail23]

Hi, I'm trying to get the chrome extension working, but it keeps telling me this:

An error occurred while collecting the measures. This is possibly due to
absence of register observer hook in your project. See the detailed documentation on how to register a top level observer in your React application.

your project is not using React.
If above solutions don't work, then try reloading the plugin or close and reopen the inspected window.

I have installed the observer hook, and I definitely am using React, but my app does take a ridiculously long time to load (one of the reasons we need a good react profiler so badly!), so I suspect your extension's initialization may be timing out before my app is loaded. If that is the case, perhaps you could make that timeout configurable?

[nitin42]

Oops! Sorry for that. I am going to work on the next release that will hopefully fix this issue.

[nitin42]

Heya, I've released a new version of the observer hook.

Install the new beta with

yarn add [email protected]

Configure the timeout value like this -

registerObserver({ timeout: desire_value_in_number })

Let me know if it works and then I'll go ahead and update the docs.

[jrnail23]

Wow @nitin42, that was ridiculously fast. I'll give it a shot!

[nitin42]

Did you got it working with the new beta release ?

[jrnail23]

finally about to try it, @nitin42. I'll let you know ASAP

[nitin42]

Awesome!

[jrnail23]

@nitin42, I just tried it with the Chrome extension (v5.5), and it's still doing the same thing. I set a timeout of 30000, but the extension still gives me the same error message above after only about 2 seconds.
It is capturing state in __REACT_PERF_DEVTOOL_GLOBAL_STORE__, though, and I see the timeout value in that state

[nitin42]

Hm... Strange! Can you show me a screenshot where you are using the observer hook ?

[nitin42]

Also, if it gives the error after two sec. then I am sure you must be using [email protected] and not @3.1.8-beta.2!

[nitin42]

It's perfectly working... see this video where I am using the current beta on my machine. I am adjusting the timeout value that directly impacts the initialisation process - video source

Please make sure that you've [email protected] installed!

[jrnail23]

I'll doublecheck and get back to you ASAP

[jrnail23]

@nitin42:

invoking the observer hook in my app.js, right before we first render to ReactDOM:

The error message, plus console output showing registerObserver was reached:

Is it possible I don't have the right version of the chrome extension? (I have v5.5 installed)

[nitin42]

Strange! Are you doing server side rendering or using any server side React framework ?

[nitin42]

I've released a stable version registerObserver hook i.e [email protected]

I've thoroughly tested the build on three of my websites and apps built with React and I can confirm that everything is working fine.

Closing this issue since the new release adds the timeout value property. But if still there is any issue, feel free to open it.

[jrnail23]

@nitin42, we're definitely not doing any server-side rendering. Perhaps we're doing something else that the tool doesn't like. What are the general assumptions that the tool expects?

Perhaps my problem isn't actually related to the timeout -- it could be a different error condition, but it doesn't look like I have a way to see the errors. Perhaps you can log errors to the console (or have an option to enable console error logging)

[agandra]

@nitin42 I am having the same issue as @jrnail23 . Sometimes the devtools waits the full timeout length before showing me the performance statistics. Othertimes, it does not wait the timeout length and just shows the error message. It appears to work inconsistently.

I am not doing server side rendering or using any server side React framework.