I seem to have encounted an issue, that I'm not sure if it's a bug, or simply not understanding how something should work, or a feature not yet implemented.
I'm using the product-variant-container element, with select boxes.
However when you deep link a specific variant (product?variant=id) the select boxes aren't set to reflect this. I dug through the liquify_custom.js code and when the variant is switched, you're pushing this urlparam and setting the window history. But either something is broken in my implementation, or this was never fully implemented. Can you advise?
although it's still not working correctly on the 2nd and 3rd product options, when they are also select inputs rather than radio buttons. I've debugged this through and found that the call to updateVariantStatuses is setting the option 2 and 3 selectboxes back to a default state, despite what the selected variant is on initialization.
I'm not sure this makes much sense to do at all, when you call the product page and pass in the variantid as a querystring paramter, the handleVariant() funtion is going to get that particular variant. And, even in your example template the price of the selected variant is always displayed.
So, for this scenario, I'm not sure why you've put this in here. This code is scoped only to when it's a 'select' rather than a radio button, which implies there's some sort of hierarchial dependcy, but there's not. Just like with using radio buttons, those are mapped directly to a variant ID.
I believe what you're attempting to do is disable the options if it's unavailable but I'm not sure the logic is correct; and besides that there's logic to show an "out of stock" rather than "add to cart" in that event, which are two conflicting design choices.
Thanks, in the meantime I removed the product-variant-handler tag from my component and manually set some of the bindings, and created a copy of the liquify_custom.js file to use with my edits, as it will be overwritten every time I convert the theme
