ok, so in a really old angular-js app I am working on, there is a div looking like this
<div ng-cloak>
The context seems fine and it should work. However when running the app i dev mode (with vite) the content of the div never turns visible.
What makes it strange is that angular seems to do everything right.
Checking the inspector, the ng-cloak attribute has been removed.
Checking the computed style of the element says display: block and it simply should be visible.
To make matters worse, if I add the style display: block in the inspector it shows up, and it stays visible even if I remove the style.
Additionally if I change the size of the window until it hits some breakpoint (not sure which one) it becomes visible, and no change in window size can make it disappear again.
I know angular-js is old and no longer maintained, but I still want to solve this issue
edit: Messing around with the angular code, it continues to behave in unexpected ways.
I changed the file node_modules/angular/index.js to this
require('./angular');
module.exports = angular;
console.log("index.js")
so, just adding a console.log at the end, and everything starts working without any hickups.
Feels like it is either a timing issue, or a vite issue
ngCloakis a simple directive that removes the class and attribute during compilation state. If ng-cloak remains in DOM, that means the element is not being compiled. And its not being compiled because its not a child ofngAppor some element, which is being bootstrapped manually.