Rayrun
BlogAsk AIToolsVideosQA WikiDiscord
← Back to Discord Forum

Issue with popups and iframes on firefox

Web DevelopmentTest DebuggingPlaywright Test
spysteposted in #help-playwright
Open in Discord
spyste
spyste

@automationpanda We spoke briefly at Star West regarding firefox issues.

Hello all,

Website: https://terckert.github.io/pw-firefox-test/ Code: https://github.com/terckert/pw-firefox-test

The live environment I'm testing has an iframe that contains a button that opens a pop-up containing an upload element. On clicking the save button, it handles the upload, closes the popup, and refreshes the iframe. I have simplified an approximation of the live environment found at the link above and included a playwright test that I wrote to highlight the issue I'm having:

import { test, expect } from '@playwright/test';

test('access iframe after reload', async ({ page }) => {
await page.goto(`https://terckert.github.io/pw-firefox-test/`)
for (let i = 0; i < 4; i++) {
console.log(`Run ${i}`)
await page.waitForLoadState();
const popupPromise = page.waitForEvent('popup');
await page.frameLocator(`#iframe-id`).locator("#iframe-button").click();
const popup = await popupPromise;
await popup.waitForLoadState();
const button = await popup.locator('#popup-button').click()
}
});

The test runs fine on safari, chromium, msedge, google chrome, but fails on firefox with the following:

locator.click: Target closed
=========================== logs ===========================
waiting for locator('#popup-button')
locator resolved to <button id="popup-button" onclick="closePopupAndRefreshI…>↵ Click me to close the popup and refresh …</button>
attempting click action
waiting for element to be visible, enabled and stable
element is visible, enabled and stable
scrolling into view if needed
done scrolling
performing click action
============================================================```

I have also run into errors when handling iframes on firefox, but was hoping someone could point me in the right direction as to where to go next to attempt to solve this issue.

This thread is trying to answer question "Why does the test script fail to interact with a button in a popup window on Firefox and how can this issue be resolved?"

13 replies
tphillips8117

I am seeing the same behaviour, looking into it

tphillips8117

It seems like the firefox browser can't see the opened window

tphillips8117

actually it can see the window, just not the button for some reason

tphillips8117

this is a good case for a bug report on Github

tphillips8117

this code works:

test('test', async ({ page }) => {
await page.goto('https://terckert.github.io/pw-firefox-test/');
const page1Promise = page.waitForEvent('popup');
await page.frameLocator('#iframe-id').getByRole('button', { name: 'Click to open a pop up that will take user upload or input.' }).click();
const page1 = await page1Promise;
await page1.getByText('I do something, like upload a file or get user input.').click();
});
tphillips8117

(clicking on the text in the popup)

tphillips8117

but even while recording, PW can't record clicking on the button in the popup

tphillips8117

works fine with chrome as you say

tphillips8117

only broken in firefox

spyste
spyste

Thank you, I will.

a.vintrovich

I also see the same issue. It looks like this behavior started from Version 1.30.

Open in Discord

Related Discord Threads

BlogAsk AIToolsVideosQA WikiDiscord
TwitterGitHubLinkedIn
AboutQuestionsDiscord ForumBrowser ExtensionTagsQA Jobs

Rayrun is a community for QA engineers. I am constantly looking for new ways to add value to people learning Playwright and other browser automation frameworks. If you have feedback, email luc@ray.run.