ix
ix copied to clipboard
<ix-tabs> The tabs sliding window position is incorrect if tab selected by JS code
What happened?
When the tab list exceeds the width of the container, the sliding window of the tabs does not move to the selected tab position if the tab's selected state is controlled by javascript.
In the reproduction demo code, the tabs are force to lock to tab1. However if you click the tab5, the tabs position will stay on tabs 5 but not moves back to the tab1.
The real case is if the page is refreshing and the tab that needs to be displayed is the 5th tab (in my application this is determined by angular's routing parameter). The user will not be aware of that the 5th tab is selected. Instead, they think that no tab is selected
What type of frontend frameware are you seeing the problem on?
Angular
Which version of iX do you use?
v2.0.4
Code to produce this issue.
https://stackblitz.com/edit/1tqmdv?file=src%2Fapp%2Ftabs.ts
Internal ref [IX-866]
+1 - Facing the same issue in Angular 17 with ix-angular 2.1.2. But in our case the component that is shown is the right one, but the Tabs are hiding behind arrows. The tabs slide too far right by the pixel of the margin to the left corner.
Fixed via #1390