Search code examples
javascriptdom

Can't access shadowRoot


I want to pass a captcha on website https://sirus.one/#play and I need to set the solved captcha value in textarea.g-recaptcha-response -> div.innerText. TextArea has shadowRoot where website saving the response of recaptcha.

I tried to access shadowRoot like that: document.querySelector("textarea.g-recaptcha-response").shadowRoot, but the result is null.

If I print the element in console it appears that shadowRoot exists screenshot

How to get the shadowRoot?


Solution

  • Since it is a captcha you are trying to solve I think it's a reasonable assumption that the shadow root has not been attached with the mode: open option. As such you will not be able to access it using the shadowRoot property

    const div = document.querySelector('div');
    const p = document.querySelector('p');
    
    p.attachShadow({mode: 'open'});
    div.attachShadow({mode: 'closed'});
    
    console.log('Paragraph has accessible Shadow DOM:', !!p.shadowRoot); // true
    console.log('Div has accessible Shadow DOM:', !!div.shadowRoot); // false
    <p></p>
    <div></div>