"State" section of Properties window doesn't always show up.

[xouqoa]

Augury version (required): 1.7
Angular version (required): 4.1.1
Date: 5/16/2017
OS: Windows 10

This is more of a general question than an actual issue, perhaps.

Some of our components don't show the State section of the properties window. It worked in the past, and then at some point it stopped. I'm not sure if this is a code change thing, or an actual issue with Augury.

I guess what I'm trying to find out is if there are any common code pitfalls that can cause this issue or not. In one parent component, we have a child component that doesn't show anything, and a separate child component that functions as expected. It's kinda weird and I'm just not sure what to look for/at.

[JanEggers]

same issue here,

it would be nice that in case augury is not able to display the state to generate a logmessage in the console or in the area the state would normally show up. that way we could provide better feedback whats not working or fix the issue in that component

[colthreepv]

I am having the same issue with version 1.9
Are you sure your version is 1.7? Chrome extensions should auto-update

[xouqoa]

I uninstalled/installed to get 1.9 -- it wasn't doing it automatically (Chrome Canary). Problem seems to be resolved for me at least. I'll keep an eye on it.

[xouqoa]

Still having issues with the State section not showing up. Would this have anything to do with lazy loaded modules, maybe?

Also, with the 1.9 update, I have to close the F12 tools if I reload my page or I get the "this is not an angular application" message in Augury. Separate issue I'm sure, but figured I'd mention it.

[AlrikOlson]

I noticed when we had a property that contained a "." in the name that the State section stopped showing up. As soon as we replaced the "." in the property, the State section showed up again.

This does not work:
var options = { ... ... events: { 'froala.editor': true } }

This does work:
var options = { ... ... events: { 'froalaeditor': true } }

[mhengelein]

Still having this issue with 1.15.0. :(

[jacobedawson]

I'm having this issue with 1.15.0 / Angular 5- not having the state available greatly reduces the use cases for this extension...

[jainvishal520]

Any updates on this? I'm not able to see component states!

[sunstar007]

Same here - I don't see the state on many of the components in our Angular 5 application (works on some components though). There's no error message to indicate what could be wrong, and the components are very similar in the way they're structured

[kpodkalicki]

Same here - no state of components visible for Angular 5 app.

[lautaros86]

Same here - no state of components visible for Angular 6 app.
Windows 10

[santiago-elustondo]

The bug described in #1283 is confirmed: Injecting Router into a component causes the disappearance of the state display.
Is anyone else also injecting Router into their components? As in:

constructor( private router: Router ) {}

If not, are you injecting anything else? (HttpClient has also been reported to cause this, although it works for me)

[MattWilliamsDev]

@santiago-elustondo I am injecting ActivatedRoute in mine but not Router and having no luck seeing state. No HttpClient here either.

[santiago-elustondo]

Hey, thanks @MattWilliamsDev.

Is the state missing for all the components, or only those that inject ActivatedRoute?

[santiago-elustondo]

Can you try the latest Canary Build, and tell me if the issue persists there?

[lautaros86]

Hi!
i'm injecting HttpClient at some services, Router at some Components and ActivatedRoute in some other. But the state is missing for all components of app, even if I have no injection.

[santiago-elustondo]

@lautaros86, are you using version 1.16.1 of the Canary Build ?

[santiago-elustondo]

Version 1.16.2 released just now, which brings the official Chrome and FireFox versions up-to-date with the Canary Build. Please reopen if the issue persists.

[s001dxp]

I have Angular Version: 4.4.7
Augury 1.16.2

And do not see state on any of my components. BTW, it only worked sporadically in recent versions.

On one component, for example, I'm injecting custom built services and the StateService from ui-router.

[slavede]

I have Angular 5.2.3 and Augury 1.16.3. There are no states displayed :(.

$$el.context works fine

[ltippmann]

Angular 4.4.6, Augury 1.16.3. No state on 90% of the components. The issue is definitely not resolved.

I can see the property values of the component in the console via $$el.context just fine.

[santiago-elustondo]

Two new edge cases causing this issue have been identified and fixes have been applied in the new version of the Canary Build (version 1.17.1)

@lukeatron, @slavede, @s001dxp, can you confirm / disconfirm that version 1.17.1 of the Canary Build eliminates the issue for you?

[slavede]

@santiago-elustondo yes, it eliminates the issue for me. Thanks!

[ltippmann]

@santiago-elustondo I am now seeing the state for (I believe but haven't checked exhaustively) all components. It takes a little bit to load and display the state when I click on a component in the tree. Everything but the state shows immediately but while the state is loading the browser is unresponsive and loading can take 10s of seconds for more complex components with a lot of properties.

Also, mousing over the component tree causes the browser to go unresponsive for a couple seconds before it shows the hover highlight. It seems like there's some lengthy work being done in a synchronous context that's bogging down the browser (Chrome 66.0.3359.181 in my case).

I also just noticed that unreponsiveness is an issue when scrolling the properties pane.

Edit: after a little more poking it around, it seems that Augury is causing huge performance problems once it's loaded. If I open the dev tools pain then load the Augury tab and click on some component, after about 30 seconds the browser tab becomes basically unusable. If I click a button it can be upwards of a minute before I see any kind of visual response. If I close the dev tools pane the browser tab becomes responsive again (though it can take more than a minute for the browser to respond and the pane to close).

[santiago-elustondo]

Thanks for this detailed problem description, @lukeatron.

The issue you are describing, or a similar one, was fixed yesterday on the Canary Build.

Users experienced the tab slow down to a complete freeze after some interaction. We found it was caused by an interaction between augury and other active extensions, notably Redux DevTools.

Can you confirm / disconfirm that Canary clears the issue for you?

[santiago-elustondo]

Canary merged with master as official 1.18 release.
Please reopen if this issue persists.

[ReallyNotARussianSpy]

I deactivated all of my extensions before posting. I am still experiencing the issue on both master and the Canary Build. I always see "No state to show". Angular 6.0.2, Chrome 65.0.3325.181, Fedora 27

[lautaros86]

Its fixed for me!
Thx!

[ltippmann]

I finally got a chance to test this. It's mostly working except for a few components that have a lot of public members that show up in the state pane. For these components the state pane shows "Loading component state..." for about 10 seconds then switches to "No state to show". It seems like it's timing out and giving up.

To be fair, I'm forced to run Norton AV on my machine by work policy and it absolutely butchers the performance. My gut feeling is that if the browser was running like it should, this wouldn't be an issue.

None the less, it would be nice if the state pane could be progressively loaded as things are resolved and maybe give up on particular fields if they're taking to long (perhaps with the option to lazy load those ones on demand if you really want to wait). Not getting any state info on these big crappy components (where most of the bugs live of course) really hampers the usefulness of the tool.

[ReallyNotARussianSpy]

Can this issue be reopened ?

[santiago-elustondo]

Thank you for the info, @lukeatron.

We are aware that this issue persists for some users.

We are currently attempting a fix-all solution.
An example repository would be useful to help us figure out the outstanding cases that cause this problem.

[ltippmann]

The only place I'm seeing this behavior is in a poorly architected internal company application that I obviously can't share. After some more use I'm finding the problem is pretty pervasive and affects some components that I wouldn't expect to be problematic based on the number of properties alone. Perhaps some of these components have properties with very deep trees that need to be walked.

It does seem like loading is being cutoff by timeout as the message switches to "No state to show" at almost exactly 10 seconds every time. Are there any configuration variables for the timeout that I could mess with or is it hard coded to 10 seconds?

[ReallyNotARussianSpy]

@santiago-elustondo I was able to reproduce the issue in this repository: https://github.com/AdJesumPerMariam/augryissue1114

[santiago-elustondo]

Thank you very much, @AdJesumPerMariam.
Will look at this today.

[ReallyNotARussianSpy]

Hi @santiago-elustondo ,

I installed 1.18.1 on canary and can see that the issue I have had with my project with the state being empty was fixed! Thank you very much!

The only issue I have now is that the component tree does not seem to be automatically updating as I navigate through the application. I have to close the console and open it again to be able to get the component tree of the current application state. I reverted back to 1.18.0 and this behavior exists on the Angular Tour of Heroes example. Let me know if you would like me to create another issue for this, or if this is expected behavior.

Thanks again!

[santiago-elustondo]

Thank you, @AdJesumPerMariam, your example repo was very helpful.

I became aware this morning of the issue you are describing. Please try the newest Canary Build (1.18.2). Let me know if that fixes it for you.

[santiago-elustondo]

@lukeatron, can you confirm this issue is resolved for you as well in Canary Build 1.18.2 ?

[ReallyNotARussianSpy]

Hi @santiago-elustondo. No problem! I tried the newest canary build and the issue I described is fixed now.

Thank you for your quick response to these issues! The extension is very helpful.

[santiago-elustondo]

Canary version released as Augury 1.19.0.
Please reopen if you're still experiencing this issue.