Uncaught TypeError: Cannot read property '0' of undefined when used for nav companion hidden by watchCSS

[Victor Zagorodny]

Hello!

I have 2 sliders with the following setup:

    <div
      class="cover-slider"
      data-flickity='{ "asNavFor": "#featured_banners_body_slider", "fade": true, "draggable": false, "imagesLoaded": true, "pageDots": false, "prevNextButtons": false, "wrapAround": true, "setGallerySize": false, "accessibility": false, "watchCSS": true }'
    >
      <img
        class="featured_banner slide"
        src="60yuz98zo4_Flickery_Box.png"
        aria-hidden="true"
        style=""
      /><img
        class="featured_banner slide"
        src="4zdg7w9it0_Slide_2.png"
        aria-hidden="true"
        style=""
      />
    </div>

    <div
      id="featured_banners_body_slider"
      class="banner-body-slider card-body flickity-soft-edges flickity-soft-edges-white flickity-buttons-adjacent flickity-buttons-bottom-center"
      data-flickity='{"pageDots": false, "wrapAround": true, "watchCSS": true}'
    >
      <div
        id="featured_banner_33"
        class="featured_banner slide"
        aria-hidden="true"
        style=""
      >
        <em class="tagline">New documentary</em>
        <h3 class="heading">Enmity</h3>
        <div class="description">
          <p>
            Then war broke out in heaven. Michael and his angels fought against
            the dragon, and the dragon and his angels fought back. But he was
            not strong enough, and they lost their place in heaven.
          </p>
        </div>
        <a
          href="https://www.youtube.com/watch?v=VtjMGchgrqs"
          class="btn_watch_now btn-watch-now"
          data-fancybox=""
        >
          Watch Now
        </a>
      </div>
      <div
        id="featured_banner_34"
        class="featured_banner slide"
        aria-hidden="true"
        style=""
      >
        <em class="tagline">Old mockumentary</em>
        <h3 class="heading">The Day After</h3>
        <div class="description">
          <p>
            In an age where deceptions run loose and relativism is thriving, it
            is essential to stand tall as a light shining God’s unadulterated
            truth to the world.
          </p>
        </div>
        <a
          href="https://www.youtube.com/watch?v=7-wAzlqzXH0"
          class="btn_watch_now btn-watch-now"
          data-fancybox=""
        >
          Watch Now
        </a>
      </div>
    </div>

Both of them are hidden by setting content: '' upon a CSS breakpoint as described in the watchCSS manual.

When the page is being open with a viewport width already beyond that breakpoint, I get the following console error:

It doesn't hurt much and doesn't break anything within the sliders when they become enabled again, but I guess it's easy to fix.

[Sadegh Barati]

watchCSS and asNavFor not compatible with each other I guess