[Silk UI Web] Tabs Pattern in Silk UI 1.2.1 is not functioning properly

[Silk UI Web] Tabs Pattern in Silk UI 1.2.1 is not functioning properly

Forge Component
Published on 28 Mar by OutSystems R&D
61 votes
Published on 28 Mar by OutSystems R&D
I believe the Tabs Pattern in Silk UI 1.2.1 is broken.

It seems there is a problem with the Javascript because clicking on the Tab headers displays different bodies.  For example:

Click Tab header 1, see body 1
Click Tab header 2, see nothing (nothing gets the "active" class)
Click Tab header 3, see body 2
Click Tab header 4, see body 3
Hello Bryan,

So far, we were not able to replicate your issue.
Can you share with us an eSpace with your issue?

Best Regards,
Samuel Jesus
Yes,  I can share it to you directly.  A coworker and I were able to get in and debug the issue last night and it appears to be a 1.2.1 issue that has arisen when employing nested Tabs.  The old Tabs javascript worked with nested Tabs but this new one's selectors aren't specific enough when selecting ".Tabs .Tabs_header ..." It probably should be something like ".Tabs > .Tabs_header ..." to ensure you're grabbing direct descendants.

This is what actually happens:
  • Tab 1 "Dashboard"
    • Tab 1 - Report A
    • Tab 2 - Report B
  • Tab 2 "Daily Detail Report"
  • Tab 3 "Settings"

Clicking Tab 1 "Dashboard" displays Dashboard (as desired)
Clicking Tab 2 "Daily Detail Report" sets "Report A" as the 'active' class and nothing is displayed (big problem)
Clicking Tab 3 "Settings displays "Daily Detail Report" tab

Does this make sense?
Hello Bryan,

First of all sorry for the really late reply, but somehow we missed your reply.

Yes, your issue description makes sense, however, we still cannot replicate it.
Do you think you can test it again with the latest version of Silk, and if able to replicate the issue, share here a clean eSpace with the issue?

Hope to hear from you soon.

Best Regards,
Samuel Jesus