правки test1

index3.js

@@ -29,8 +29,29 @@ const audienceContent = {
     const orderSuccess = document.getElementById('orderSuccess')
     const contactSuccess = document.getElementById('contactSuccess')
     const wooCommerceConfig = window.test1WooCommerce || null
+    const cartPanel = cartDrawer?.querySelector('.cart-panel')
+    const modalCard = modalBackdrop?.querySelector('.modal-card')
 
     let cart = []
+    let lastCartTrigger = null
+    let lastModalTrigger = null
+
+    const getFocusableElements = container => {
+      if (!container) {
+        return []
+      }
+
+      return Array.from(container.querySelectorAll('a[href], button:not([disabled]), textarea:not([disabled]), input:not([disabled]), select:not([disabled]), [tabindex]:not([tabindex="-1"])'))
+        .filter(element => !element.hasAttribute('hidden') && !element.closest('[hidden]'))
+    }
+
+    const focusFirstElement = container => {
+      const [first] = getFocusableElements(container)
+
+      if (first) {
+        first.focus()
+      }
+    }
 
     const updateAudience = audience => {
       heroAudienceText.textContent = audienceContent[audience]
@@ -55,31 +76,49 @@ const audienceContent = {
       document.body.classList.remove('menu-open')
     }
 
-    const openCart = () => {
+    const openCart = triggerElement => {
+      lastCartTrigger = triggerElement || document.activeElement
       cartDrawer.classList.add('open')
       cartDrawer.setAttribute('aria-hidden', 'false')
       document.body.classList.add('modal-open')
+      focusFirstElement(cartPanel)
     }
 
     const closeCart = () => {
+      const shouldRestoreFocus = cartDrawer.classList.contains('open')
       cartDrawer.classList.remove('open')
       cartDrawer.setAttribute('aria-hidden', 'true')
       document.body.classList.remove('modal-open')
+
+      if (shouldRestoreFocus && lastCartTrigger && typeof lastCartTrigger.focus === 'function') {
+        lastCartTrigger.focus()
+      }
+
+      lastCartTrigger = null
     }
 
-    const openModal = () => {
+    const openModal = triggerElement => {
+      lastModalTrigger = triggerElement || document.activeElement
       orderItemsField.value = cart.length
         ? cart.map(item => `${item.name} (${item.volume}) - ${item.price} ₽`).join('\n')
         : ''
       modalBackdrop.classList.add('open')
       modalBackdrop.setAttribute('aria-hidden', 'false')
       document.body.classList.add('modal-open')
+      focusFirstElement(modalCard)
     }
 
     const closeModal = () => {
+      const shouldRestoreFocus = modalBackdrop.classList.contains('open')
       modalBackdrop.classList.remove('open')
       modalBackdrop.setAttribute('aria-hidden', 'true')
       document.body.classList.remove('modal-open')
+
+      if (shouldRestoreFocus && lastModalTrigger && typeof lastModalTrigger.focus === 'function') {
+        lastModalTrigger.focus()
+      }
+
+      lastModalTrigger = null
     }
 
     const renderCart = () => {
@@ -173,7 +212,7 @@ const audienceContent = {
                 price: Number(button.dataset.price)
               })
               renderCart()
-              openCart()
+              openCart(button)
               button.disabled = false
             })
             .catch(() => {
@@ -189,14 +228,14 @@ const audienceContent = {
           price: Number(button.dataset.price)
         })
         renderCart()
-        openCart()
+        openCart(button)
       })
     })
 
-    cartOpenButton.addEventListener('click', openCart)
+    cartOpenButton.addEventListener('click', () => openCart(cartOpenButton))
     mobileCartOpenButton.addEventListener('click', () => {
       closeMobileMenu()
-      openCart()
+      openCart(mobileCartOpenButton)
     })
     cartCloseButton.addEventListener('click', closeCart)
     viewCartButton.addEventListener('click', () => {
@@ -211,11 +250,11 @@ const audienceContent = {
       }
 
       closeCart()
-      openModal()
+      openModal(checkoutButton)
     })
 
     orderButtons.forEach(button => {
-      button.addEventListener('click', openModal)
+      button.addEventListener('click', () => openModal(button))
     })
 
     modalCloseButton.addEventListener('click', closeModal)
@@ -234,15 +273,29 @@ const audienceContent = {
 
     faqItems.forEach(item => {
       const trigger = item.querySelector('.faq-question')
+      const answer = item.querySelector('.faq-answer')
+
+      if (!trigger || !answer) {
+        return
+      }
+
       trigger.addEventListener('click', () => {
         const isOpen = item.classList.contains('open')
         faqItems.forEach(entry => {
+          const entryTrigger = entry.querySelector('.faq-question')
+          const entryAnswer = entry.querySelector('.faq-answer')
+
           entry.classList.remove('open')
-          entry.querySelector('.faq-question').setAttribute('aria-expanded', 'false')
+          entryTrigger?.setAttribute('aria-expanded', 'false')
+
+          if (entryAnswer) {
+            entryAnswer.hidden = true
+          }
         })
         if (!isOpen) {
           item.classList.add('open')
           trigger.setAttribute('aria-expanded', 'true')
+          answer.hidden = false
         }
       })
     })