where else can I put wdyr.js?

[allan-m-bonadio]

This is more a cry for help than a bug report. I'd like to know how much freedom is there in the commandment that the wdyr.js file should "import it as the first import in your application". So far, I've not gotten a single report from WDYR. Let me explain my situation in more detail.

Our app is big and complex. The foundation (top level) is written in GWT, which is an obsolete webdev platform where you write a web UI in Java and it gets translated into JS. In practice, it's a bad idea, you actually have to write plenty of ad-hoc JS, and we're trying to replace it with React, gradually. GWT has nothing to do with React; it's more old-school DHTML, using way too many tables for layout.

Our React components live in React portals that are all embedded in GWT components. Although we have an index.js at the head of every portal, it's called by index-dev.js (in dev), which is called somewhere in the abyss of GWT. I'm importing wdyr.js in the index-dev.js file, but I'm not getting any reports out, so I figure I'm not inserting it high enough in the system - or it's not running soon enough, or something. A breakpoint in wdyr.js does get hit, and the code seems to run.

If you could explain why it needs to be imported first, or before any React code, that would be great. Or, is there some other hack I could use to make it work inside an isolated portal, or at some level other than the Top?

We are not using Hooks, but we are using MaterialUI, Redux, Redux-Saga, and other packages; not sure if that's important.

[vzaidman]

The only rule is not to have any React elements created before WDYR runs, i.e calls to JSX (<Something ... />) or the app will crash.

[allan-m-bonadio]

Wow, that's great info! and if it crashes, I did it wrong. Thanks! 😎

[allan-m-bonadio]

Works. cleared away some of my stupid fumbles, and I now have an ocean of these trace msgs coming out. Now to fix them.

Tx!