How to click svg element within an iFrame using JavaScript or JQuery?

I am trying to use web automation and use JavaScript or JQuery to click the svg elements within an iFrame. I am trying to click on all the svg elements with class “expand-svg”.

Here is the website: Credit Union Careers & Jobs in Jacksonville | 121 Financial Credit Union

Here is JQuery I tried using unsuccessfully:

var el = $("gnewtonIframe").contents().find("svg[class='expand-svg']");
el.trigger("click");

Here is JavaScript I tried using unsuccessfully:

document.querySelectorAll('svg[class="expand-svg"]')[0].click();

Any idea what I am doing wrong?

3 Likes

It should work if you querySelect the class alone with your vanilla JS.
Example: document.querySelectorAll(‘.expand-svg’)[0]
I don’t think I’ve ever seen a .click() built in method before.

I think The Same Origin Policy prevents you from scripting an Iframe from a different domain.

I suggest checking this example by w3school: How To Get an Element in an iframe

2 Likes

Thanks for the reply. I can’t seem to get it to work. I am not for sure, but maybe ‘The Same Origin Policy’ might be the cause like @front_endDEV01 mentioned.

1 Like

Thanks. I was hoping this was not the case, but maybe so.

1 Like

Is ‘The Same Origin Policy’ a security header?

The same-origin policy restricts which network messages one origin can send to another. For example, the same-origin policy allows inter-origin HTTP requests with GET and POST methods but denies inter-origin PUT and DELETE requests