0

I am trying to catch elements from this website: https://seguro.marca.com/registro/v3/?view=signup

But when I go to the element, right click, inspect and copy css_selector, or id or xpath and I search for the element with crtl + F, it is imposible. I don't know what is the problem.

Obviously I see the elements on the HTML DOM but I cant find them searching on inspector with Crtl + F and introducing for example input.mdc-checkbox__native-control

enter image description here

Example of elements I cant search: the check element, or the yes and no radio buttons

And using selenium it is the same problem, it does not find the elements I want

borjaperez
  • 37
  • 4
  • What code is the code that you are using to look at those elements? Are you possibly not waiting for the page to load before looking for those elements? – Andrew Ryan May 01 '23 at 20:28
  • [Please do not upload images of code/data/errors.](//meta.stackoverflow.com/q/285551) Also, please include code for what you have tried, if you have any. Be specific about what it is you are looking for. Also, the Material web controls (checkbox and radio) put their user interfaces in the `mdc-checkbox__background` element. – Heretic Monkey May 01 '23 at 21:29

1 Answers1

0
  • In your HTML code inspector i.e. Google Chrome:
    1. Go to Settings
    2. Enable Show user agent shadow DOM
  • Via Selenium, you need to locate the Shadow Root element and then look up elements within that. Check this related thread.
levangode
  • 406
  • 2
  • 12
  • Do you know that the problem here is elements in the shadow DOM? Or is this just a wild guess. – Heretic Monkey May 01 '23 at 21:30
  • @HereticMonkey I went to the website provided and tested it with and without shadow DOM option :) – levangode May 01 '23 at 21:47
  • unable to find elements under #shadow-root, but able to find all the rest of the elements in main DOM – levangode May 01 '23 at 22:09
  • That kind of information should be included in the answer. Otherwise it sounds like you're just guessing that it must be the shadow DOM. And especially in this case, because you are in fact, incorrect. These are Material Web components, which do not use the shadow DOM; the checkmark is an SVG element with the class `mdc-checkbox__checkmark`. – Heretic Monkey May 03 '23 at 19:31