My website is switched from Magento 1 to Magento 2 and there is one major issue i.e. when I open the URL of the configurable product with their attribute ids, it jumped to the default color selection.
For eg: I selected the color blue for product A & when I hit the URL in the browser like abc.com/mountain-bike-gloves.html#137=120&133=17
this. After loading my page jumped to the default color instead of showing blue color as selected.
Firstly checking the configurable.js under
vendor/magento/module-configurable-product/view/frontend/web/js/configurable.js
we can see on line 59 a comment that says
// Override defaults with URL query parameters and/or inputs values
by the function _overrideDefaults. So the next step will be to find the id / value of the option fields and add them to the url. We can easily do that by inspecting the input elements in frontend finding the option id and value to set. Inspecting the div element for the grey colour option on the following product http://demo.magevision.com/hero-hoodie.html we will see the information that we need. The aria-describedby="option-label-color-90" and the option-id ="52", meaning the id for the attribute colour is 90 and the id for the option grey is 52. By adding these values as parameters to the url we will land to the product page with this option preselected. The URL will look like
http://demo.magevision.com/hero-hoodie.html#90=52
For more info please check the below URL: https://www.magevision.com/blog/post/select-default-options-of-configurable-product-by-url-query-magento-2/