Scrap dropdown that change css class after click

How to?
#1

Hi everyone! I'm new to data scraping and I need to scrape data from a website that shows products I need to scrapp them with variants "color" and "size" . The problem is that I need to click on the dropdownlist to get sizes
i followed tutorial on webscraper.io but i failed i hope someone could help me

Url: https://www.decathlon.fr/browse/c0-tous-les-sports/c1-velo-cyclisme/c2-velos/_/N-xxtlfp

Sitemap:
{"_id":"decathlonwithvariation","startUrl":["https://www.decathlon.fr/browse/c0-tous-les-sports/c1-velo-cyclisme/c2-velos/_/N-xxtlfp"],"selectors":[{"id":"pagination","paginationType":"clickMore","parentSelectors":["_root","pagination"],"selector":"[aria-label='Next product list page'] svg","type":"SelectorPagination"},{"delay":0,"id":"product links","multiple":true,"parentSelectors":["pagination"],"selector":"a.dpb-product-model-link","type":"SelectorLink"},{"delay":0,"id":"title","multiple":false,"parentSelectors":["product-wrapper-2"],"regex":"","selector":"h1.vtmn-typo_title-5","type":"SelectorText"},{"delay":0,"id":"price","multiple":false,"parentSelectors":["product-wrapper-2"],"regex":"","selector":".prc__financing div.prc__active-price","type":"SelectorText"},{"delay":0,"id":"description1","multiple":false,"parentSelectors":["product-wrapper-2"],"regex":"","selector":"p.svelte-yqaodq:nth-of-type(1) ","type":"SelectorText"},{"delay":0,"id":"decription2","multiple":false,"parentSelectors":["product-wrapper-2"],"regex":"","selector":"p.svelte-yqaodq:nth-of-type(2) ","type":"SelectorText"},{"delay":0,"extractAttribute":"src","id":"images","parentSelectors":["product-wrapper-2"],"selector":"#thumbnails-slider > div > section > button > img","type":"SelectorGroup"},{"delay":500,"id":"reviewcontent","multiple":false,"parentSelectors":["product-wrapper-2"],"selector":"div.product-floors","type":"SelectorElementScroll"},{"delay":0,"id":"contentreview","multiple":true,"parentSelectors":["reviewcontent"],"regex":"","selector":"p.answer-body","type":"SelectorText"},{"clickElementSelector":"#app > main > article > div.product-summary.svelte-yqaodq > div.model-choice.svelte-ag2xiw > button","clickElementUniquenessType":"uniqueCSSSelector","clickType":"clickOnce","delay":500,"discardInitialElements":"discard-when-click-element-exists","id":"product-wrapper","multiple":true,"parentSelectors":["product links"],"selector":"body","type":"SelectorElementClick"},{"clickElementSelector":"#app > main > article > div.product-summary.svelte-yqaodq > div.sku-selector.svelte-1dkais7 > div > ul > li > div >span:not(.no)","clickElementUniquenessType":"uniqueCSSSelector","clickType":"clickOnce","delay":2000,"discardInitialElements":"do-not-discard","id":"product-wrapper-2","multiple":true,"parentSelectors":["dropsize"],"selector":"_parent_","type":"SelectorElementClick"},{"clickElementSelector":"span.label-container","clickElementUniquenessType":"uniqueText","clickType":"clickOnce","delay":2000,"discardInitialElements":"do-not-discard","id":"dropsize","multiple":true,"parentSelectors":["product-wrapper"],"selector":"_parent_","type":"SelectorElementClick"}]}

#2

@pacmangenious Hi, it appears that some of the selectors are redundant. In order to click through all of the available color and size variations you should manually perform some specifications using the jQuery selector - ':contains'.

Sitemap example:

{"_id":"decathlonwithvariation","startUrl":["https://www.decathlon.fr/p/velo-tout-chemin-electrique-riverside-500-e/_/R-p-169143?mc=8608513&c=GRIS"],"selectors":[{"delay":0,"id":"title","multiple":false,"parentSelectors":["dropsize"],"regex":"","selector":"h1.vtmn-typo_title-5","type":"SelectorText"},{"clickElementSelector":"div.model-choice button","clickElementUniquenessType":"uniqueCSSSelector","clickType":"clickOnce","delay":1000,"discardInitialElements":"discard-when-click-element-exists","id":"product-wrapper","multiple":true,"parentSelectors":["_root"],"selector":"body","type":"SelectorElementClick"},{"clickElementSelector":"select#product-size-selection option:not(:contains(\"Sélectio\"))","clickElementUniquenessType":"uniqueCSSSelector","clickType":"clickOnce","delay":1000,"discardInitialElements":"discard-when-click-element-exists","id":"dropsize","multiple":true,"parentSelectors":["product-wrapper"],"selector":"_parent_","type":"SelectorElementClick"},{"delay":0,"id":"price","multiple":false,"parentSelectors":["dropsize"],"regex":"","selector":"div[class*=\"prc__active\"]","type":"SelectorText"},{"delay":0,"id":"color","multiple":false,"parentSelectors":["dropsize"],"regex":"","selector":"span.current-model-color","type":"SelectorText"},{"delay":0,"id":"size","multiple":false,"parentSelectors":["dropsize"],"regex":"","selector":"select#product-size-selection option:checked","type":"SelectorText"}]}

1 Like