Remove session storage checks from accordion JavaScript

CHANGELOG.md

@@ -9,6 +9,7 @@ For advice on how to use these release notes see [our guidance on staying up to
 We've made fixes to GOV.UK Frontend in the following pull requests:
 
 - [#5043: Refactor the accordion JavaScript](https://github.com/alphagov/govuk-frontend/pull/5043)
+- [##5044: Remove session storage checks from accordion JavaScript](https://github.com/alphagov/govuk-frontend/pull/5044)
 
 ## 5.4.0 (Feature release)
 

packages/govuk-frontend/src/govuk/components/accordion/accordion.mjs

@@ -91,9 +91,6 @@ export class Accordion extends GOVUKFrontendComponent {
   /** @private */
   $sections
 
-  /** @private */
-  browserSupportsSessionStorage = false
-
   /**
    * @private
    * @type {HTMLButtonElement | null}
@@ -146,7 +143,6 @@ export class Accordion extends GOVUKFrontendComponent {
     }
 
     this.$sections = $sections
-    this.browserSupportsSessionStorage = helper.checkForSessionStorage()
 
     this.initControls()
     this.initSectionHeaders()
@@ -515,6 +511,22 @@ export class Accordion extends GOVUKFrontendComponent {
     this.$showAllIcon.classList.toggle(this.downChevronIconClass, !expanded)
   }
 
+  /**
+   * Get the identifier for a section
+   *
+   * We need a unique way of identifying each content in the Accordion.
+   * Since an `#id` should be unique and an `id` is required for `aria-`
+   * attributes `id` can be safely used.
+   *
+   * @param {Element} $section - Section element
+   * @returns {string | undefined | null} Identifier for section
+   */
+  getIdentifier($section) {
+    const $button = $section.querySelector(`.${this.sectionButtonClass}`)
+
+    return $button?.getAttribute('aria-controls')
+  }
+
   /**
    * Set the state of the accordions in sessionStorage
    *
@@ -523,19 +535,16 @@ export class Accordion extends GOVUKFrontendComponent {
    * @param {boolean} isExpanded - Whether the section is expanded
    */
   storeState($section, isExpanded) {
-    if (this.browserSupportsSessionStorage && this.config.rememberExpanded) {
-      // We need a unique way of identifying each content in the Accordion.
-      // Since an `#id` should be unique and an `id` is required for `aria-`
-      // attributes `id` can be safely used.
-      const $button = $section.querySelector(`.${this.sectionButtonClass}`)
+    if (!this.config.rememberExpanded) {
+      return
+    }
 
-      if ($button) {
-        const contentId = $button.getAttribute('aria-controls')
+    const id = this.getIdentifier($section)
 
-        if (contentId) {
-          window.sessionStorage.setItem(contentId, isExpanded.toString())
-        }
-      }
+    if (id) {
+      try {
+        window.sessionStorage.setItem(id, isExpanded.toString())
+      } catch (exception) {}
     }
   }
 
@@ -546,19 +555,20 @@ export class Accordion extends GOVUKFrontendComponent {
    * @param {Element} $section - Section element
    */
   setInitialState($section) {
-    if (this.browserSupportsSessionStorage && this.config.rememberExpanded) {
-      const $button = $section.querySelector(`.${this.sectionButtonClass}`)
+    if (!this.config.rememberExpanded) {
+      return
+    }
 
-      if ($button) {
-        const contentId = $button.getAttribute('aria-controls')
-        const contentState = contentId
-          ? window.sessionStorage.getItem(contentId)
-          : null
+    const id = this.getIdentifier($section)
 
-        if (contentState !== null) {
-          this.setExpanded(contentState === 'true', $section)
+    if (id) {
+      try {
+        const state = window.sessionStorage.getItem(id)
+
+        if (state !== null) {
+          this.setExpanded(state === 'true', $section)
         }
-      }
+      } catch (exception) {}
     }
   }
 
@@ -621,27 +631,6 @@ export class Accordion extends GOVUKFrontendComponent {
   })
 }
 
-const helper = {
-  /**
-   * Check for `window.sessionStorage`, and that it actually works.
-   *
-   * @returns {boolean} True if session storage is available
-   */
-  checkForSessionStorage: function () {
-    const testString = 'this is the test string'
-    let result
-    try {
-      window.sessionStorage.setItem(testString, testString)
-      result =
-        window.sessionStorage.getItem(testString) === testString.toString()
-      window.sessionStorage.removeItem(testString)
-      return result
-    } catch (exception) {
-      return false
-    }
-  }
-}
-
 /**
  * Accordion config
  *