Clicking element inside iFrame does not give any response

[haquezameer]

I am clicking an element inside an iframe which should give me a different frame/view, that is move into the view represented by that element. If i click the element manually,the url does not change. So, I guess only the frame is changed. The element is being clicked properly since there are no errors for that. However nothing happens when it is clicked and returns error when I do page.waitForNavigation().
Here is the debug log listening for mouse and keyboard clicks.

Also made sure proper element is clicked referring to #618. Here is portion of code that handles clicking the element inside iframe :

var frames = await page.frames();
var myframe = frames.find(f => f.name() === 'mygurukuliframe_submenu'); 
const attselector = '#imgid_12';
const attel = await myframe.$(attselector);
const outerHTML = await attel.evaluate(e => e.parentNode.outerHTML);
console.log('the outerhtml: ', outerHTML);
await attel.click({button:'middle'});
await page.waitForNavigation();
await page.screenshot({path : 'example.png'});
browser.close();

Please mention if any further info is needed and help if it can be resolved.

[aslushnikov]

@zamhaq thanks for reporting this, that's a bug.

[SMJ93]

@zamhaq @aslushnikov any update on this issue?

[haquezameer]

@JoelEinbinder Is this being worked upon?

[okbel]

Any update?

My temporary workaround is to go to the url of the iframe:

const page = await browser.newPage();
await page.goto(url, {waitUntil: 'networkidle'});

// Getting iFrame
const iFrame = await getIframeByName(page.mainFrame(), 'iFrameName');
    
// Go to iFrame url 
await page.goto(iFrame.url(), {waitUntil: 'networkidle'});

// [...] testing

[jonlinper]

In my case, clicking element inside iFrame does the click, but in a wrong coordinates.
In detail, it doesn't calculate the offset position of the iframe in the main frame.

[jonlinper]

ElementHandle.js: "_visibleCenter": Changing "getBoundingClientRect" for "boundingBox" fix the issue.
"boundingBox" from https://github.com/GoogleChrome/puppeteer/pull/445/files

[HulaTime]

The best workaround for trying to directly click an element inside an iframe that i've found is to simply select the frame containing the element and then use the frame methods to navigate/select elements inside the frame.
e.g.

const selector = '#elementId';
const Frame = await page.frames()[1]; // quick and dirty selection of the frame i'm after, serves for example though...
await Frame.$eval(selector, el => el.click());

[jonlinper]

Other workarounds:

1. Navigate to the url of the iframe (no iframe, no bug).
2. Move the iframe (with Css) to the top-left of the screen.

[veb]

@MaxProvin when I try your code I get this in the console:

(node:10904) UnhandledPromiseRejectionWarning: Unhandled promise rejection (rejection id: 1): Error: SSL Certificate error: ERR_CERT_WEAK_SIGNATURE_ALGORITHM

Does anyone know why that's happening?

[fran0254]

Good morning, you could know if this bug will solve ??

[xPomaHx]

The solution for me
$(<style>
html, body {
width: 999px!important;
height: 999px!important;
overflow: hidden!important;
}
iframe {
position: fixed!important;
top: 0!important;
left: 0!important;
z-index: 9999!important;
}
< /style>).appendTo("head");