#18535 closed defect (fixed)
TabContainer: scroll button incorrectly disabled after selecting pane from menu
Reported by: | Jason Cowley | Owned by: | bill |
---|---|---|---|
Priority: | undecided | Milestone: | 1.10.5 |
Component: | Dijit | Version: | 1.10.4 |
Keywords: | Cc: | ||
Blocked By: | Blocking: |
Description
Tested with Dojo/Dijit? 1.10.1 and 1.10.4 in Chrome.
Steps to reproduce:
- In Chrome open the dijit/tests/layout/TabContainer.html test page.
- Watch the top tab container example as the page loads.
Expected: Top tab container loads with left-most tab selected.
Actual: It loads with one of the middle tabs selected, then triggers and animation to scroll back to the first tab.
- Notice that the left scroll button is disabled.
- Click the drop-down arrow and select the last tab "newTab2".
Expected: newTab2 is selected and the tabs scroll so that it becomes visible on the right-side of the tab container. The left scroll button should become enabled.
Actual: newTab2 is selected but is scrolled to the centre of the tab container and the left scroll button is still disabled, so you cannot scroll left with the scroll button.
This test page behaves correctly in Dojo 1.9.2.
Change History (7)
comment:1 Changed 7 years ago by
Resolution: | → invalid |
---|---|
Status: | new → closed |
comment:2 Changed 7 years ago by
Hi Bill,
I don't think you understand the problem. See the expected and actual description after step 4.
Expected: newTab2 is selected and the tabs scroll so that it becomes visible on the right-side of the tab container. The left scroll button should become enabled.
Actual: newTab2 is selected but is scrolled to the centre of the tab container and the left scroll button is still disabled, so you cannot scroll left with the scroll button.
You end up with the left scroll button disabled, even though the tabs are scrolled to the right. This problem was discovered in our application, and I managed to reproduce it on the test page. It has nothing to do with the automation.
Jason
comment:3 Changed 7 years ago by
Resolution: | invalid |
---|---|
Status: | closed → reopened |
OK, it turns out you are describing two separate issues in this ticket.
I reproduce the second problem you describe, about manually selecting newTab2 from the menu.
Not the first problem though. The top TabContainer? correctly loads with the left-most tab selected, and there's no animation. You can see this more clearly by commenting out doh.run() and replacing it with parser.parse().
comment:4 Changed 7 years ago by
Looks like the second problem started with the changes to _TabContainerBase.js in https://github.com/dojo/dijit/commit/df83f09c02ffdb0aa7ee77ae4da20e04e2f949d8, to fix #17287.
TabContainer#selectChild()
now has code to focus the tab button for the selected tab:
selectChild: function(/*dijit/_WidgetBase|String*/ page, /*Boolean*/ animate){ // Override _StackContainer.selectChild() so the page's focus isn't left in a strange state. if(this._focused){ // Focus must be inside the currently selected tab, // or on the currently selected tab label. page = registry.byId(page); this.tablist.pane2button(page.id).focus(); } return this.inherited(arguments); }
The call to focus()
effectively cancels the animation, because in ScrollingTabController#onSelectChild()
, the code inside the if()
isn't triggered:
if(sl > node.offsetLeft || sl + domStyle.get(this.scrollNode, "width") < node.offsetLeft + domStyle.get(node, "width")){ this.createSmoothScroll().play(); }
comment:5 Changed 7 years ago by
Milestone: | tbd → 1.10.5 |
---|---|
Status: | reopened → assigned |
Summary: | dijit/layout/TabContainer regression in 1.10.x → TabContainer: scroll button incorrectly disabled after selecting pane from menu |
comment:6 Changed 7 years ago by
Resolution: | → fixed |
---|---|
Status: | assigned → closed |
That's an automated test, and it's behaving correctly. The scrolling is caused by the test code inside the TabContainer?.html files that selects various tabs.