title: Why am I getting this error 'TypeError undefined is not an object...' when including Shopify Linked Product Options?
body: <p>I'm trying to implement Shopify's Linked Product Options into my store (followed this <a href="https://docs.shopify.com/manual/configuration/store-customization/advanced-navigation/linked-product-options" rel="nofollow">tutorial</a>), they seem to be working fine on the product page but breaking other script (Cart &amp; Quick Shop open but no content) on my index and collection pages.</p>
  
  <p>I'm getting the following error in Safari:</p>
  
  <pre><code>TypeError: undefined is not an object (evaluating 'availableOptions.length')
  </code></pre>
  
  <p>which is referencing this piece of code:</p>
  
  <pre><code>var initialValue = selector.val();
    selector.empty();    
    var availableOptions = Shopify.optionsMap[key];
    for (var i=0; i&lt;availableOptions.length; i++) {
      var option = availableOptions[i];
      var newOption = jQuery('&lt;option&gt;&lt;/option&gt;').val(option).html(option);
      selector.append(newOption);
    }
  </code></pre>
  
  <p>If anyone has any suggestions as to why that might be I would appreciate your input. I'm not great with JS so struggling with this one!</p>
  
  <p><strong>Update:</strong></p>
  
  <p>I'm pretty sure this part is defining 'key' - if key is undefined does that mean it cannot find <code>.single-option-selector</code>?</p>
  
  <pre><code> switch (selectorIndex) {
  case 0:
    var key = 'root';
    var selector = jQuery('.single-option-selector:eq(0)');
    break;
  case 1:
    var key = jQuery('.single-option-selector:eq(0)').val();
    var selector = jQuery('.single-option-selector:eq(1)');
    break;
  case 2:
    var key = jQuery('.single-option-selector:eq(0)').val();  
    key += ' / ' + jQuery('.single-option-selector:eq(1)').val();
    var selector = jQuery('.single-option-selector:eq(2)');
    }
  </code></pre>