document.querySelectorAll returns values only after inspecting DOMs

Question

Trying to get these 2 elements having the same class with "document.querySelectorAll(".sc-gHboQg"), but it returns and empty NodeList:

As soon as I inspect the element:

only now I can get them:

As far as I understand these elements are outputted dynamically in javascript, probably react, but how can I get them without having to inspect them first?

At what time are you getting the elements? are you waiting for DOMContentLoaded? — Luis Cabrera Benito, Nov 21 '18 at 18:44
Could there be another event at play, like mouseover, click, etc. triggering a class change? — Logan Bertram, Nov 21 '18 at 18:45
It's not time related, nor at play, mouseover or click on it, I tried them all without inspecting the element in the console, but nothing.. — Alessandro Crotti, Nov 21 '18 at 18:50
I believe it's time-related. Try to get them after some time using `setTimeout` — Dominik Krzywiecki, Nov 21 '18 at 18:57
No, I tried setTimeout, even up to 10 sec it doesn't come up — Alessandro Crotti, Nov 21 '18 at 19:04
https://stackoverflow.com/questions/28163033/when-is-nodelist-live-and-when-is-it-static — chrisg86, Nov 21 '18 at 19:08

score 1 · Accepted Answer · answered Nov 21 '18 at 19:11

1

It is due to the javascript console changed scope after you inspect element. Notice how top in the first image changed to something else(mews...) in the second image.

Your target element is probably in an iframe, or something that is not in a same javascript console scope than the top window?

answered Nov 21 '18 at 19:11

William Chong

2,107
13
24

I see, I didn't notice that. It's not an iframe though, I just checked the page source and no iframes at all. Besides, do you know how can I overcome this? – Alessandro Crotti Nov 21 '18 at 19:16
Try clicking on the `top`, and see what causes the scope change in the list? For me it is usually either `iframe` or `extension` – William Chong Nov 21 '18 at 19:18
You were right, in fact there is an iframe, I just didn't see it. Thanks much for your help. – Alessandro Crotti Nov 21 '18 at 20:16

document.querySelectorAll returns values only after inspecting DOMs

1 Answers1