Automatically open multiple fSelect facet dropdowns when a selection is active

<?php

// Automatically keep fSelect facet drowndowns open when a selection was made.
// Keeps fSelect facets dropdowns open on page reload when a selection is in the URL.
// Intended for pages with multiple fSelect facets. If you only have one fSelect facet, use this snippet:
// https://gist.facetwp.com/gist/automatically-open-single-fselect-facet-dropdowns-when-a-selection-is-active/
// Closes all fSelects on click.
// Add or remove fSelect facet names to the facets array as needed.

add_action( 'wp_footer', function() {
  ?>
    <script>
      (function($) {

        function fselectClick() {
          window.fSelectInit.activeEl = '';        
          $('.facetwp-type-fselect .facetwp-dropdown').each(function() {
            this.fselect.close();
          });
          document.removeEventListener('click', fselectClick);
        }

        document.addEventListener('facetwp-loaded', function() {
          const facets = ['my_fselect_facet_one', 'my_fselect_facet_two', 'my_fselect_facet_three']; // Add or remove fSelect facets
          facets.forEach(facet => {
            if (FWP.facets[facet].length) {
              $(`.facetwp-facet-${facet} .facetwp-dropdown`).nodes[0].fselect.open();
            }
          });
          document.addEventListener('click', fselectClick);
        });
        
      })(fUtil);
    </script>
  <?php
}, 100 );