[ANGULAR] App never gets stable when showCurrentTimeLine is set true

[hltob]

We would like to periodically reload data from the API in the scheduler. This reload interval may only be started after the app has entered stable mode (ApplicationRef.isStable).
However, if the following feature is activated, the app never enters stable mode:

timeRangesFeature.showCurrentTimeLine

I was able to reproduce this in the following example:

https://bryntum.com/products/schedulerpro/examples/frameworks/angular/timezone/dist/timezone/

Add the following code to app.component.ts:

constructor(private appRef: ApplicationRef) {
        appRef.isStable.pipe(
            filter(stable => stable)
          ).subscribe(() => console.log('App is stable now'));
    }

If the mentioned feature is active, the app is NOT stable. If the feature is deactivated, the app enters stable mode!

[mats]

Not sure what the isStable mode actually means, but this sounds like an application issue more than an issue in our code. How does your app determine that stable state?

[hltob]

I think that the current-time-timerange of the Scheduler is updated with a window.setTimeout or window.setInterval by the Bryntum team. However, this must be executed at the earliest when the Angular app is in stable mode. Please refer to the Angular documentation here:

https://v17.angular.io/api/core/ApplicationRef

If you want to execute something when the app is stable, you have to wait for the application to be stable before starting your polling process.

The periodic loading of new data should also be done in our app with a window.setTimeout(). But we are waiting for stable mode first, as prescribed by Angular.

However, this stable mode is never reached when the mentioned scheduler feature is enabled.

[mats]

Sounds like you ping Angular team about this.

As a workaround, you can disable the TimeRanges feature until your app is stable, then enable it.

[hltob]

Can you please explain in more detail how you think the Angular team can help here?

The Bryntum component blocks Angular's stable mode because a setTimeout or setInterval is executed (Bryntum code) before the app is stable. The documentation says that this should not be done.

If you execute setTimeout or setInterval before stable-mode is reached, this can lead to rending problems.

Therefore, the cause lies in the Bryntum code, where the update of current-TimeRange is started.

[mats]

Can you please explain in more detail how you think the Angular team can help here?

It's a bizarre implementation choice by the Angular team, can't understand how they expect Angular apps to work with any third-party library on the market as setTimeout/setInterval are very basic JS APIs used widely. Is this behavior newly added? We haven't heard anyone else complain.

Did you try the workaround suggested?

[hltob]

Ok, this is a workaround that works.
But in my opinion, Angular components that start a polling (setTimeout, setInterval) should pay attention to the app state themselves.