primeng
primeng copied to clipboard
Tabview: Forward Button Visible with Fractions
Describe the bug
For checking if the forward button needs to be displayed, it compares the current scrollstate with the actual width of the content.
The issue is that the scrollWidth is rounded and the scrollLeft Value is not.
In my case the scroll width actually is: 1671.5, but during runtime the value reads 1672. Where as the scroll left value is and stays 150.5.
Environment
MacOS
Reproducer
No response
Angular version
17.1.0
PrimeNG version
17.4.0
Build / Runtime
Angular CLI App
Language
TypeScript
Node version (for AoT issues node --version)
v20.x
Browser(s)
Chrome 121
Steps to reproduce the behavior
No response
Expected behavior
updateButtonState(this: TabView): void { const content = this.content!.nativeElement; const {scrollLeft, scrollWidth} = content; const width = DomHandler.getWidth(content); this.backwardIsDisabled = scrollLeft === 0; this.forwardIsDisabled = Math.round(scrollLeft) === scrollWidth - width; }
I could create a PR with the rounded scrollLeft, so it actually matches the rounded scrollWidth
Rounded ScrollWidth: https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollWidth?retiredLocale=de
Mentioning the scrollLeft decimal value:
https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollLeft