AnsweredAssumed Answered

Why does TabContainer render differently in 3.19+?

Question asked by janiceb on Apr 10, 2018

I am upgrading from javascript api 3.13 to 3.23 and notice that my TabContainers act differently. When I run my app with the 3.13 api, my Floating Panes are all hidden including the one on which I have a TabContainer. When I change to 3.23 api, all of my Floating Panes are again hidden however the TabContainer is visible. I have tested this behavior with the javascript apis 3.13, 3.19, and 3.23. Both the 3.19 and 3.23 exhibit the behavior. I have further narrowed this down to the claro.css file. If I use the claro.css file from 3.13 and everything else from 3.23, my app seems to function properly as far as displaying the TabContainer.

I copied the div that is generated for my TabContainer for both 3.13 and 3.23 and have found that the first tab in the

3.13 generated div has the visibility set the hidden and the first tab in the 3.23 generated div does not.

 

I do not really understand how the css files get updated from one api version to the next and there is probably a simple change I can make somewhere in my code to override this but I am not sure where to make the change. If I programmatically set the first tab to hidden, I need to follow it through my code and change the visibility to visible when I need the tab. What works in 3.13 is for me to only hide and show the FloatingPane and the TabContainer and Tabs follow suit.

 

Anyways, I am really interested in why the 3.19 version of claro.css dropped the visibility setting for my tab. For now, I have copied the 3.13 version of claro.css over my local copy of the 3.23 version and life is good.

 

Has anyone else noticed this behavior? Has anyone else found an easy solution?

Differences between claro.css 3.13 and 3.23 when rendering tab

Outcomes