Handle headers within tabpanels

Author: agriyakhetarpal

assets/js/shortcuts.js

@@ -98,15 +98,24 @@ function setupShortcuts(shortcutDepth = 2) {
 
   shortcutDepth += 1; // to account for the page title
 
-  // Build a class selector for each header type, and concatenate with commas
+  /*
+   * We have build selectors to find headers in different contexts.
+   * i. direct children of .content-container (main structure)
+   * i. headers within tabpanels (for tabbed content)
+   */
   let classes = "";
+
   for (let i = 2; i <= shortcutDepth; i++) {
     if (i != 2) {
       classes += ",";
     }
     classes += " .content-container > h" + i;
   }
 
+  for (let i = 2; i <= shortcutDepth; i++) {
+    classes += ", [role='tabpanel'] > h" + i;
+  }
+
   const classElements = Array.from(document.querySelectorAll(classes));
 
   // Only proceed if we found headers (to avoid creating an empty shortcuts section)