I'm trying to embed the interactive radar in an iframe, then click a certain button inside the iframe which toggles full-screen mode. The button has the title "Toggle Full Screen Mode," so the javascript should search for and find that button, then click it; but it doesn't work and the Safari console says the following:
TypeError: undefined is not an object (evaluating 'document.getElementById('screen2').contentDocument.querySelectorAll("button[title='Toggle Full Screen Mode']")[0].click')
I'm basing my code off of this answer.
Is this possible to do, and if so what am I doing wrong? If it is not possible, then what workarounds can I use to accomplish the same thing?
Here is the code for the button inside the iframe.
<button title="Toggle Full Screen Mode" aria-label="toggle fullscreen"><span classname="icon icon-font iconset-map icon-maximize" class="icon icon-font iconset-map icon-maximize"></span></button>
And here is my code:
document.getElementById('screen2').contentDocument.querySelectorAll("button[title='Toggle Full Screen Mode']")[0].click();
<iframe style="height:500px; width:800px;" id="screen2" src="https://weather.com/weather/radar/interactive/l/d1936f8be052152442dd64abf7364f3650c8b2d6ad905be1cacef7ad56eced11?layer=radar&animation=true&zoom=9"></iframe>