Sidenav initializes as expanded for a split second even thou

Topic: Sidenav initializes as expanded for a split second even though resolution is under the configured breakpoint

Adrian Ghita free asked 2 years ago

Expected behavior If the device width is lower than the sidenav's breakpoint setting, the sidenav shouldn't be visible at all (unless manually toggled).

For MDB site, if I load it on mobile, it behaves correctly - the sidenav is not showed at all. How did you set it up to work correctly? Thank you!

PS: in the SIdenavComponent, there's a typo in one of its properties: windwosWidth: number

Actual behavior For a split second, the sidenav is visible, then quickly collapses.

Resources (screenshots, code snippets etc.) The website where the issue manifests: https://stire9.ro/. Load it on a res < 860px to see it. This is my config of the sidenav:

sidenavAlwaysVisibleBreakpointPx = 860;

<mdb-side-nav #sidenav [sidenavBreakpoint]="sidenavAlwaysVisibleBreakpointPx" class="bg-sidebar" [fixed]="true">
....
</mdb-side-nav>

Grzegorz Bujański staff commented 2 years ago

Please provide more details on how we can reproduce this bug. I've tried several ways to recreate it, but it works fine every time.

Adrian Ghita free commented 2 years ago

I tested again and it seems that the issue reproduces ONLY when sidenavBreakpoint attribute is set and on (at least) chromium based browsers (Google Chrome, new MS Edge). It does not occur on Firefox for example.

Can you do this test and confirm you can reproduce it? If not, I will put together a project archive.

Arkadiusz Idzikowski staff commented 2 years ago

@Adrian Ghita We managed to reproduce this problem on our end, thank you. We still need to make some additional tests to find the cause of this problem.

Adrian Ghita free commented 2 years ago

Good to hear! Looking forward to the fix, as people using my site (90% mobile) are complaining about this quite often.. Thank you!

Add comment

Arkadiusz Idzikowski staff answered 2 years ago