fix: make sure applyPageFocus not forces all elements to use tabind…

…ex="-1"
dnbexperience · Feb 1, 2019 · 53c3700 · 53c3700
1 parent 3d93b7a
commit 53c3700
Show file tree

Hide file tree

Showing 2 changed files with 27 additions and 6 deletions.
diff --git a/packages/dnb-design-system-portal/src/shared/menu/MainMenu.js b/packages/dnb-design-system-portal/src/shared/menu/MainMenu.js
@@ -156,6 +156,7 @@ const customBodyStyle = css`
 `
 const toggleContent = css`
   /* hide content if shown as overlay menu */
+  .dnb-skip-link,
   .sticky-menu,
   .content-wrapper {
     display: none !important;

diff --git a/packages/dnb-ui-lib/src/shared/tools.js b/packages/dnb-ui-lib/src/shared/tools.js
@@ -17,14 +17,34 @@ export const applyPageFocus = (key = 'default') => {
       element = document.querySelector('.dnb-no-focus')
     }
     if (element instanceof HTMLElement) {
-      if (!element.hasAttribute('tabindex')) {
-        element.setAttribute('tabindex', '-1')
-      }
       if (
-        element.classList &&
-        !element.classList.contains('dnb-no-focus')
+        [
+          'h1',
+          'h2',
+          'h3',
+          'h4',
+          'h5',
+          'h6',
+          'p',
+          'div',
+          'main',
+          'nav',
+          'header',
+          'footer',
+          'aside',
+          'section',
+          'article'
+        ].includes(element.type)
       ) {
-        element.classList.add('dnb-no-focus')
+        if (!element.hasAttribute('tabindex')) {
+          element.setAttribute('tabindex', '-1')
+        }
+        if (
+          element.classList &&
+          !element.classList.contains('dnb-no-focus')
+        ) {
+          element.classList.add('dnb-no-focus')
+        }
       }
       element.focus({ preventScroll: true })
     }