javascript - Trying to click a button within an iframe with puppeteer - Stack Overflow

admin管理员组

文章数量:1340938

This is my first time using puppeteer for some light automation. I am running into an issues trying to click a button that is located within an iframe.

Here is my code:

await page.waitForSelector('iframe');
        const frameElement = await page.$(
            'iframe[src=".html"]',
        );
        const frame = await frameElement.getFrame();

The getFrame() errors because the frameElement is return as a JSHandle@node.

The selectors I have access to for the iframe are src and title. As you can see I am using src.

I have searched and searched for how to do this but none of the examples seem to work for me.

I am stuck so if anyone has any advice, solution, or direction I would appreciate it.

Thank you,

Joe

This is my first time using puppeteer for some light automation. I am running into an issues trying to click a button that is located within an iframe.

Here is my code:

await page.waitForSelector('iframe');
        const frameElement = await page.$(
            'iframe[src="https://ibx.key./ibxolb/login/client/index.html"]',
        );
        const frame = await frameElement.getFrame();

The getFrame() errors because the frameElement is return as a JSHandle@node.

The selectors I have access to for the iframe are src and title. As you can see I am using src.

I have searched and searched for how to do this but none of the examples seem to work for me.

I am stuck so if anyone has any advice, solution, or direction I would appreciate it.

Thank you,

Joe

• javascript
• puppeteer

Share Improve this question Follow asked Dec 20, 2019 at 21:00 JoeJoe 79555 gold badges1212 silver badges2626 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 7

If you're accessing the iframe from URL / sites beside *.key. or *.keybank., then you can't open the iframe because of CSP directive.

Open chrome developer console and if you can see this message, then it's because CSP directive not allowing you to access the iframe site URL.

Refused to display 'https://ibx.key./ibxolb/login/client/index.html' in a frame because an ancestor violates the following Content Security Policy directive: "frame-ancestors *.key. *.keybank.".

And if you're not seeing any message like above, you can try like this

const frame = page.frames().find(frame => frame.url() === 'https://ibx.key./ibxolb/login/client/index.html');

const clickLogin = await frame.click('.login-button-space')

I was able to solve my issue.

First I got all of the frames listed on the page like so:

var frames = (await page.frames());

Then I ended up looping through the frames looking for a specific title.

exports.getFrame = async function(frames, ssoFrameTitle) {
let selectedFrame;
for(let i = 0 ; i < frames.length ; ++i) {
    let frameTitle = await frames[i].title();
    if(frameTitle === ssoFrameTitle) {
        selectedFrame = frames[i];
        break;
    }
}
return selectedFrame;};

Once I locate the frame object I returned it from the function to locate and click the button.

本文标签： javascriptTrying to click a button within an iframe with puppeteerStack Overflow