fix(back-to-top): target surface with main role in demo JS

RedHat-UX · Jan 16, 2025 · 20d51c0 · 20d51c0
1 parent 903b015
commit 20d51c0
Show file tree

Hide file tree

Showing 4 changed files with 4 additions and 4 deletions.
diff --git a/elements/rh-back-to-top/demo/color-context.html b/elements/rh-back-to-top/demo/color-context.html
@@ -61,7 +61,7 @@
 <script type="module">
   /* add support for demo/fullscreen and dev server */
   const b2t = document.querySelector('rh-back-to-top');
-  const main = document.querySelector('main');
+  const main = document.querySelector('main, [role="main"]');
   // if main isn't scrollable use window
   if (window.getComputedStyle(main).overflow === 'scroll') {
     b2t.scrollableSelector = 'main';

diff --git a/elements/rh-back-to-top/demo/no-slotted-text.html b/elements/rh-back-to-top/demo/no-slotted-text.html
@@ -39,7 +39,7 @@
 <script type="module">
   /* add support for demo/fullscreen and dev server */
   const b2t = document.querySelector('rh-back-to-top');
-  const main = document.querySelector('main');
+  const main = document.querySelector('main, [role="main"]');
   // if main isn't scrollable use window
   if (window.getComputedStyle(main).overflow === 'scroll') {
     b2t.scrollableSelector = 'main';

diff --git a/elements/rh-back-to-top/demo/on-a-scrollable-page.html b/elements/rh-back-to-top/demo/on-a-scrollable-page.html
@@ -40,7 +40,7 @@
 <script type="module">
   /* add support for demo/fullscreen and dev server */
   const b2t = document.querySelector('rh-back-to-top');
-  const main = document.querySelector('main');
+  const main = document.querySelector('main, [role="main"]');
   // if main isn't scrollable use window
   if (window.getComputedStyle(main).overflow === 'scroll') {
     b2t.scrollableSelector = 'main';

diff --git a/elements/rh-back-to-top/demo/scroll-distance.html b/elements/rh-back-to-top/demo/scroll-distance.html
@@ -41,7 +41,7 @@
 <script type="module">
   /* add support for demo/fullscreen and dev server */
   const b2t = document.querySelector('rh-back-to-top');
-  const main = document.querySelector('main');
+  const main = document.querySelector('main, [role="main"]');
   // if main isn't scrollable use window
   if (window.getComputedStyle(main).overflow === 'scroll') {
     b2t.scrollableSelector = 'main';