Firefox flickers on loading scrollbar/polyfill

[daniel-sc]

Reproduction

@MurhafSousli it seems there is still (probably related to #615) some issue with that polyfill - I am using v15.1.0 and (still) get a short flicker when the scrollbar/polyfill is loaded, where all styles quickly get reset, see attached video/gif (in reality it is shorter, I artificially slowed down the relevant 2 frames..):

Expected Behavior

All existing styles already loaded should not (visibly) changed/updated.

Actual Behavior

For a short period some(?) styles get reset.

Environment

• Angular: 18.1
• ngx-scrollbar: 15.1.0
• Browser(s): Firefox 128.0 (64-Bit)
• Operating System (e.g. Windows, macOS, Ubuntu): Win10

[MurhafSousli]

Could you try this polyfill URL and tell if it fixes the issue https://cdn.statically.io/gist/MurhafSousli/c852b6a672069396953f06ddd4b64620/raw/0b2553be83108b96b442c7004b08ef57c9282bfe/scroll-timeline-lite.js

import { provideScrollbarPolyfill } from 'ngx-scrollbar';

export const appConfig: ApplicationConfig = {
  providers: [
    provideScrollbarPolyfill(polyfillURL)
  ]
};

[daniel-sc]

@MurhafSousli yes, this seems to fix the issue!

[daniel-sc]

note: using the new polyfill (scoll-timeline-lite.js) I observed the following error in FF

I can reproduce this on a specific route change / navigation..

[MurhafSousli]

@daniel-sc how to reproduce it?

[daniel-sc]

@MurhafSousli I uploaded a small reproduction: https://github.com/daniel-sc/ngx-scrollbar-reproduce-polyfill-error
You can run it locally with ng serve and observe the issue in FF on clicking "toggle".

[bruno-lopes]

#624 (comment) Seems to fixes this issue.

[MurhafSousli]

Try this https://cdn.statically.io/gist/MurhafSousli/c852b6a672069396953f06ddd4b64620/raw/ef55db72e2abb7bc002ed79f4ad4cf408bfdb72f/scroll-timeline-lite.js