Form/Variants not found, page not loaded properly

Store Design
, ,
1

Hi all,

I experience the following issue:
Whenever I try to add an item having multiple variants to my cart, the default variant is added to my cart, regardless of which variant I selected. It’s as if there were no variant.

After investigation, it seems that the page is not loaded properly yet when the javascript code executes, and the code can’t find the variants.

This is the error I get in the console:

product-form.js:129 Uncaught TypeError: Cannot read properties of null (reading 'querySelector')
    at get variantIdInput (product-form.js:129:26)
    at new <anonymous> (product-form.js:9:14)

And this below is the code for my theme (Dawn or Sense):

if (!customElements.get('product-form')) {
  customElements.define(
    'product-form',
    class ProductForm extends HTMLElement {
      constructor() {
        super();

        this.form = this.querySelector('form');
        this.variantIdInput.disabled = false;
        this.form.addEventListener('submit', this.onSubmitHandler.bind(this));
        this.cart = document.querySelector('cart-notification') || document.querySelector('cart-drawer');
        this.submitButton = this.querySelector('[type="submit"]');
        this.submitButtonText = this.submitButton.querySelector('span');

        if (document.querySelector('cart-drawer')) this.submitButton.setAttribute('aria-haspopup', 'dialog');

        this.hideErrors = this.dataset.hideErrors === 'true';
      }

Is there a way to ensure the DOM is fully loaded before the code is executed?

Thank you in advance,

2

Hi @choopette , thanks for reaching out.

I checked your issue and after reviewing the situation, I noticed that this feature is closely tied to your theme’s logic and other related functionalities. To ensure the stability and performance of your website, I recommend you contact your theme developer to address this matter. They will have the expertise to make the necessary adjustments safely.

I hope the information is helpful to you, and thanks for your understanding in this matter.

Liz