Disclaimer: I know absolutely nothing about React.
My initial suspicion is that you have a race condition with a side order of uncaught exception.
At least with Angular, there are many situations where my app code gets called in the middle of what is effectively a framework execution context, like:
lifecycleEventHandler() {
doSomethingWith(this.jankilyInitializedProperty.ruhroh);
}
someOtherFunction() {
doAsynchronousThing().then((foo) => this.jankilyInitializedProperty = foo);
}
If doAsynchronousThing
completes before lifecycleEventHandler
gets called, everything works great and you don’t notice a thing. If it doesn’t, an exception will be thrown when you try to access the ruhroh
property of undefined
. If lifecycleEventHandler
was called as part of some sort of framework pseudocode like:
frameworkInternals(compo: Component) {
compo.lifecycleEventHandler();
attachStyles(compo);
}
…and lifecycleEventHandler
throws an uncaught exception, attachStyles
never gets run, and you end up with broken styling, unresponsive controls, &c.
With Angular, there are things you can set in tsconfig.json
that will turn these sorts of bugs into build-time errors, allowing you to audit your code for such problems in a more deterministic fashion than simply waiting for them to bite you.