Modal registers scroll bar click as backdrop click and closes

[andre-gois]

Modal registers scroll bar click as backdrop click and closes. On modals with long content I can scroll with the trackpad and/or mousewheel just fine, but when I click and drag the browser's scrollbar the modal closes.

Happens on the documentation page: https://valor-software.com/ngx-bootstrap/#/modals#scrolling-long-content

ngx-bootstrap: 5.6.1
Angular: 9

[thanhdn1989]

Modal registers scroll bar click as backdrop click and closes. On modals with long content I can scroll with the trackpad and/or mousewheel just fine, but when I click and drag the browser's scrollbar the modal closes.

Happens on the documentation page: https://valor-software.com/ngx-bootstrap/#/modals#scrolling-long-content

ngx-bootstrap: 5.6.1
Angular: 9

i raised this issue long time ago and it still there on the newest version

[Basketblo]

The same issue here, in vanilla Bootstrap everything works fine, but with ngx-bootstrap I could reproduce an issue even in example on the website: https://valor-software.com/ngx-bootstrap/#/modals#scrolling-long-content

ngx-bootstrap: 5.6.1
Angular: 9
Browser: Chrome 83.0.4103.61 (Official Build) (64-bit)

[andre-gois]

If I try to change the version of the exemple website the problem start happening in release 5.5.0 (https://valor-software.com/ngx-bootstrap/old/5.5.0/#/modals#scrolling-long-content), 5.4.0 was fine (https://valor-software.com/ngx-bootstrap/old/5.4.0/#/modals#scrolling-long-content).
For now maybe a downgrade could be an option for some projects.

[FirassKoubaa]

is there any news fo this bug ??

[Hleb-Chupin]

How are the things today?

[florenthobein]

It seems there is a duplicate of this issue on #5893 that provides a fix in the commit 87e7df8e9bdf5d7269bc3727286f2576a2a4273e
Could we perhaps merge it for the next release? It is really an irritating bug for my clients.

[florenthobein]

My bad, it seems the fix proposed doesn't actually work.

When looking more into the problem, it appears that on some browsers (for ex Chrome 87 on mac) the scrollbar appears above the content without modifying the layout, thus equating scrollbar click and backdrop click.
The reason why this bug is relatively new is that, when clicking on the scrollbar, the events mousedown and mouseup fire, but not click, and the use of mousedown & mouseup has been introduced in the fix #5326 .

Coincidentally other librairies relying on bootstrap seem to have had the exact same problem, and have fixed this issue by replacing mouseup by click. That seems to do the trick for me, I'll propose a PR with this solution.

[Hleb-Chupin]

Any news on that case?

[florenthobein]

@Hleb-Chupin the fix has been merged, it will be available in the next version of the library (I suppose)

[ViralDPatel]

Still issue in version 8.0.0, showing merged but still not working in current version, last working in version 5.4.0 then after issue in all versions, this is critical issue, large height modal is not usable without fix, need to take as priority and release in next sub version