[thumbAutosize]="true" causes random invalid starting thumbnail scroller position when scrolling possible

[AngeloGi]

What is the expected behavior?

The thumbnail scroller should be unscrolled, at its leftmost/topmost point.

What is the current behavior?

The thumbnail scroller scrolls past the selected (highlighted) image, stopping at some seemingly random point. Note, it does NOT happen in every refresh, it seems to happen randomly at each render, as you keep refreshing.

What are the steps to reproduce?

Add a gallery with the below parameters:

<gallery imageSize="contain" [thumbAutosize]="true" thumbPosition="right" [items]="images">
  </gallery>

Make sure that the thumbnails are enough so that they can scroll and do not fit all at once.

Refresh the page a few times, until you see the thumbnail scroller start randomly pre-scrolled, past the highlighted item.

What is the use-case or motivation for changing an existing behavior?

Which versions are you using for the following packages?

Angular: 15.1.1
Angular CDK: 15.1.1
Angular CLI: 15.1.2
Typescript: 4.9.4
Gallery: 8.0.2

Is there anything else we should know?

First page render (correct, expected scroll position at image 1)

After refreshing a few times (scrolled past highlighted image 1)

[MurhafSousli]

Could you add a stackblitz reproduction https://stackblitz.com/edit/ngx-gallery?

Try setting loadingAttr="eager" and see if that fixes the issue!

[AngeloGi]

I tried but that attribute is not making any difference!

I also tried replicating my code into stackblitz but it's not happening. I am assuming it has something to do with the loading differences (my API vs the stock images)...I don't know how else I can debug this! It seems while the images load, they push each other around and that causes scrolling on the thumbnail container.

[MurhafSousli]

Hmmm, so maybe in this case it should trigger an update every time an image is loaded

[peterviegas]

How to eliminate the item that appears black at the beginning and end of the carousel?

[MurhafSousli]

@peterviegas what item appears black? if you mean the empty spaces in the main slider you can use imageSize="cover", I would recommend opening a new issue with a reproduction

[peterviegas]

Murhaf, thank you very much for the feedback, yes I put it in my project and I can't remove spaces in the main slider, I'll try. Thanks Peter Viegas ***@***.*** De: Murhaf Sousli ***@***.***> Enviada em: segunda-feira, 7 de agosto de 2023 23:12 Para: MurhafSousli/ngx-gallery ***@***.***> Cc: Peter Viegas ***@***.***>; Mention ***@***.***> Assunto: Re: [MurhafSousli/ngx-gallery] [thumbAutosize]="true" causes random invalid starting thumbnail scroller position when scrolling possible (Issue #521) @peterviegas<https://github.com/peterviegas> what item appears black? if you mean the empty spaces in the main slider you can use imageSize="cover", I would recommend opening a new issue with a reproduction - Reply to this email directly, view it on GitHub<#521 (comment)>, or unsubscribe<https://github.com/notifications/unsubscribe-auth/AVZFPNVE4R3NEZCFCZ27YUTXUFRZVANCNFSM6AAAAAAUCRUN7M>. You are receiving this because you were mentioned.Message ID: ***@***.***>