How to debug the issue "locator.click: Target closed"

[sunkehappy]

I have the bellow error. I can NOT reproduce it in my local environment. So how can I debug it? I have no idea.

I have a lot of other cases and they all can work except for this one. Need your help, thanks.

[rwoll]

Thanks for your report! You can enable tracing and open the trace from a failed test to see what's going on: https://playwright.dev/docs/trace-viewer

[rwoll]

Closing per-above advice, but if that doesn't help, please re-open!

[daniavander]

i have the same issue, anybody have an idea?

[Wilhop]

I have the same issue when I run the test suite in Azure Devops Pipelines with Webkit.

A random "Target closed" never appears with Chrome or Firefox.

Test timeout of 60000ms exceeded.
locator.click: Target closed
=========================== logs ===========================
waiting for selector "#userInput"
  selector resolved to visible <input type="text" tabindex="0" id="userInput" cchanged…/>
attempting click action
  waiting for element to be visible, enabled and stable
============================================================

  77 |
  78 |         // Click confirm deletion by typing the company-ID of the company
> 79 |         await page.locator('#userInput').click();

The image on the HTML report shows that the input is there, at least visible on the image.

[madamore]

Same thing here
Happens only with webkit


"@playwright/test": "~1.25.2",
"playwright": "~1.25.2",
ubuntu 22.04.1 LTS

[cristinataplytics]

I suddenly have the same problems with a test that was running:

Screen.Recording.2022-09-16.at.1.43.31.PM.mov

Do we have a solution for this?
Thank you.

[PotapovDmytro]

I my case the problem was that dispose method was called before clicking on item. And dispose was wrongly called because instead of "async Task" - "async void" was used.

[telboy007]

Question: does the test timeout also include the retries as well? It would explain a lot of these target closed messages, I can see some of these screenshots show a retry in the test's output dir.

[just-Bri]

Getting the Target closed no matter what kind of selector/locator I use when running tests via a GH Action. Not sure if strictly related but figured I'd drop a comment in here.

[tokyo-watcher]

How about this patch?
You just ignore error.

export function extendLocator(locator: Locator): void {
  const { click: _click } = locator;
  // override
  locator.click = async (options) => {
    try {
      await _click.apply(locator, [options]);
    } catch (err: any) {
      const msg = `${err.message}`;
      if (
        err instanceof Error &&
        msg.startsWith("locator.click: Target closed")
      ) {
        // ignore error.
        console.warn(msg);
      } else {
        throw err;
      }
    }
  };
}

[barbzrona]

Can we re-open this issue? I'm experiencing this as well with Github Actions but locally, it's working fine.

[dimitur2204]

Can we re-open this issue? I'm experiencing this as well with Github Actions but locally, it's working fine.

Same. I don't know if the problem is with my setup or GH Actions though

[mickael-h]

We're also encountering this error seemingly randomly in our e2e tests on Github CI. But when it happens, it's consistent through retries and the test will fail no mater how many retries we set.

Test timeout of 120000ms exceeded.

,locator.click: Target closed
waiting for selector "text=New Invoice"
locator.click: Target closed
waiting for selector "text=New Invoice"
   at /home/runner/work/invoices-e2e/invoices-e2e/tests/createAndSendAnInvoice.spec.ts:10:44
,Pending operations:
 - locator.click at tests/createAndSendAnInvoice.spec.ts:10:44

In this instance, webkit and firefox tests all passed on the first try, but the chromium tests failed 3 times in a row, with this specific error.

Our tests are taking very long though, and since tests on CI only have 1 worker, it could indeed be the symptom of the timeout, and not the cause of it, as it was suggested.

[mickael-h]

Never mind, I don't think it's the timeout.
If I force a timeout in the exact same conditions as in Github CI, I don't get a "target closed" error. Only "timeout exceeded".
And the timer restarts for each retry. And the error I have happens at the very beginning of the tests, and it's very unlikely that Playwright hung for 2 minutes doing nothing for no reason.
It must be something else.

[Onokaev]

I am experiencing the same issue with tests that were running initially. Everything works on my local environment but fails on GitHub CI

[codesman]

👍 For me too. Stepping through the test results in success every time locally(app doesn't have CI yet), but fails intermittently on test run.

[codesman]

This output suggests something is waiting until the global timeout and then aborting the test?

[codesman]

Dangit, it was an ID10T error! I just needed to increase the global timeout. lol

[Onokaev]

By how much did you increase the timeout?

On Thu, 15 Dec 2022 at 23:26, Tom Holland ***@***.***> wrote: Dangit, it was an ID10T error! I just needed to increase the global timeout. lol — Reply to this email directly, view it on GitHub <#13090 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AK4QM7CSHWQ2CQNIOQYWZWDWNN5ITANCNFSM5RWJFIOA> . You are receiving this because you commented.Message ID: ***@***.***>

-- null

[codesman]

By how much did you increase the timeout?

The spec runs I'm working on usually take 35-50s, so I set it to 60s. Been fine ever since.

[huykon]

I still facing this error on my Github Action CI. It's working well on my localhost. So do we have any solution for this?

[tokyo-watcher]

@huykon
How about this one?

export const test = _test.extend({
    page: async ({ page }, use): Promise<void> => {
        const _page = extendPage(page);
        await use(_page);
    },

export function extendPage(page: Page) {
    const {
        locator: _locator,
    } = page;
    page.locator = (selector, options): Locator => {
        const loc = _locator.apply(page, [selector, options]);
        const locEx = extendLocator(loc);
        return locEx;
    };

export function extendLocator(locator: Locator): Locator {
    const {
        click: _click,
    } = locator;
    locator.click = async (options) => {
        try {
            await _click.apply(locator, [options]);
        } catch (err: any) {
            const msg = `${err.message}`;
            if (
                err instanceof Error &&
                msg.startsWith('locator.click: Target closed')
            ) {
                getMyLogger().warn(msg);
            } else {
                throw err;
            }
        }
    };

[tokeeffe9]

I've been working on an assignment so very new to playwright but I have the same issue. On my local, Chrome, webkit and Firefox all pass consistently (sometimes a security error may pop up on Firefox causing issue but 9% of the time passes) however when I push to my repo, all the firefox tests fail on the same part when trying to signup.

[andrew-hossack]

We're also running into this issue. Awaiting a fix, thanks. For now we will be using cypress tests.

[alanjh]

We're also running into this issue. Awaiting a fix, thanks. For now we will be using cypress tests.

Did you use trace viewer? That fixed the issue for me (was a timing issue). Trace is really good debugging tool, thanks.

[spoeken]

For me I think it was because of id's not matching between the generator and the test browser.
Probably not the case for all here, but figured it's worth mentioning.
const buttonLocator = await page .locator('[id="headlessui-popover-button-\\:Rl7jdddlmacq\\:"]')

[wagner-deoliveira]

Same issue here, as many have reported. On local it works fine but on GitHub Actions constantly fails.

[iamthe-Wraith]

Adding a +1 here. Tests run fine locally, but fail in GitHub CI.

I have no idea why, but when I add http:localhost:5173 ws://localhost:5173 to the Content Security Policy, it runs just fine in GitHub CI. Before adding this, when looking over the traces, there were no issues I could see with anything not loading, but I was getting consistent failures (but not on All tests...). But when I added the above to the CSP, everything passed.

[iroshanAV]

for me its locally failing too :(

[SemX74]

Guys, I've solved the same issue on my side:
I was mocking the data and suddenly I realized that I have a few broken API URL's that I needed to intercept.
Example: check if you correctly handling condition routes, like:

Wrong ❌ : **/someroute/:someid/someroute <=== we can't use it like that ( idk why I used it like that before, I'm new at it )
Correct ✅ : : **/someroute/*/someroute

This error caused the backend request instead of mocking my data, => I received data from the backend => and the button I wanted to click was disabled ( backend response ) => triggering some "Target closed" fails.

ALWAYS run your tests via npx playwright test --ui to see what's going on at every step. By that move, you can ensure all the buttons are enabled or visible before you click them. This will also show the details of your requests, and if it's successfully intercepted, you'll see the blue "fulfilled" label. Make sure they all have this label if you're mocking data.

I don't know why locally it was working and on Github actions it was not, but if your tests are written well, they'll work everywhere.
upd: On GitHub it was working only sometimes due to backend data, which made the button disabled sometimes.

I hope I'll help someone, if not just get some patience and try to debug tests one time per other.

[jorgemd24]

In my case, the reason was that I didn't include the await for the click action. As a result, the test was concluded before the action was completed:

	test( 'Go to dashboard page', async ( {
	        const button = await page.locator('my-button');
    		button.click(); <--- This should be `await button.click()`
	} ) => {
	})

[NowNewNao]

I have the same issue on the selector click.
await didn't work for my case.

[mikepray]

I was seeing this on a few tests in GitHub Actions, while locally I could not reproduce this.

Our tests look like this:

The error looks like this:

Test timeout of 30000ms exceeded.
Error: locator.click: Target closed
=========================== logs ===========================
waiting for getByRole('row', { name: '*******' }).getByPlaceholder('Your Bid')
  locator resolved to <input step="1" type="text" value="40,000" inputmode="n…/>
============================================================

The docs indicate that this might have something to do with how Playwright is too fast for the page, but this test is very long and the page has already loaded, and in fact actions have already been taken on these form elements several times.

My best guess is that there's some kind of rendering issue or underlying problem with the form components we are using that tricks Playwright into either losing focus or not waiting long enough to be able to find the input element by the placeholder, I'm not 100% sure.

Adding test.slow() makes this pass for me, just like @chimurai mentioned above.

[SemX74]

I was seeing this on a few tests in GitHub Actions, while locally I could not reproduce this.

Our tests look like this:

The error looks like this:

Test timeout of 30000ms exceeded.
Error: locator.click: Target closed
=========================== logs ===========================
waiting for getByRole('row', { name: '*******' }).getByPlaceholder('Your Bid')
  locator resolved to <input step="1" type="text" value="40,000" inputmode="n…/>
============================================================

The docs indicate that this might have something to do with how Playwright is too fast for the page, but this test is very long and the page has already loaded, and in fact actions have already been taken on these form elements several times.

My best guess is that there's some kind of rendering issue or underlying problem with the form components we are using that tricks Playwright into either losing focus or not waiting long enough to be able to find the input element by the placeholder, I'm not 100% sure.

Adding test.slow() makes this pass for me, just like @chimurai mentioned above.

Why you guys don't use theexpect(button).toBeVisible() before clicking it? Exactly that can cause the issue of "target closed" - button is just not available at the moment.

[aaltat]

button.click(); <--- This should be await button.click()

I have await in place and I still get the error.

Why you guys don't use theexpect(button).toBeVisible() before clicking it? Exactly that can cause the issue of "target closed" - button is just not available at the moment.

1. I can reproduce the problem with static html page. Button is visible when page has loaded the html.
2. Not all users are using Playwright test, some of us are only using Playwright API.

[nilshartmann]

I also have this problem from time to time, on my local machine with chrome (not tried it somewhere else yet). The locator works (checked in trace view) and also explicit expecting button.toBeVisible() and button.toBeEnabled() just before clicking the button works. Butten then Target closed...

[anthony-hamm]

Incrementing the timeout on the playwright.config.ts worked for me.

[AlabamaYarrow]

Had this problem when running playwright in docker on mac. For some reason problem resolved after docker restart (actually, I'm using Colima, so I did colima stop /colima start). Obvious thing but took me way too long to try it :)

[frixaco]

Same issue. Works locally (both Chromium and Webkit). In GH, Chromium works, but Webkit is failing constantly

[MohabMohie]

same issue, causing random flakiness.
await is in place. page object model is implemented correctly.

[Hiaslafson]

Solved it now with a general time out. Are there any updates on a "best practice" fix??

[AnnaDore]

I also get this issue randomly in Azure pipeline, locally always works ok. I increased the timeout but still randomly gets this issue. It even can be that I run the same pipeline (code is the same) and first time it is ok and the next time it fails with this issue.

[szambukusz]

If you see this error message, you may check your spec.ts file's character encoding as well. For me this caused the problem, my code has some special textfield name characters like "é" and "á" and when it runs, the framework can't deal with it.

[claucol]

I am experiencing a similar issue only with webkit while running tests from my local machine (haven't tried in CICD yet).
This is the error, it says Page closed. Is something being done to address this issue? Could someone please help?

[williamlabrum]

I am experiencing a similar issue only with webkit while running tests from my local machine (haven't tried in CICD yet). This is the error, it says Page closed. Is something being done to address this issue? Could someone please help?

@claucol I've been tracking something like this at my workplace and have been working on upgrading playwright from 1.23 to 1.37. Seems like folks who upgraded to Sonoma running webkit 17.1 run into target closed issues with older versions of playwright. My hope is that the upgrade helps with this situation.

[claucol]

I am experiencing a similar issue only with webkit while running tests from my local machine (haven't tried in CICD yet). This is the error, it says Page closed. Is something being done to address this issue? Could someone please help?

@claucol I've been tracking something like this at my workplace and have been working on upgrading playwright from 1.23 to 1.37. Seems like folks who upgraded to Sonoma running webkit 17.1 run into target closed issues with older versions of playwright. My hope is that the upgrade helps with this situation.

thank you for your answer @williamlabrum, however I'm already using Playwright 1.37.1 so I think that's not the cause

[nilshartmann]

Maybe this is helpful for some of you:

When I had the issue, I was using a locator to find a button. Verifiying that the button was visible and enabled both worked, but clicking afterwards does not ("target closed"). In the trace view the locator also selected and highlighted correctly the button.

After some debugging I found out, that in my application the button actually was replaced quickly by another one (different labels) during the test. Think of something like: during loading of data the button shows "please wait" and later it is replaced by "edit data". Now in my case I was trying to click on the"old" button ("please wait"), that does not exists anymore in the UI. My assumption in this case was, that playwright in this case (a) would show the "new" button in the trace view and (b) would make my test fail when doing the visible and enabled checks (as the button does not exists anymore). I tried timeout and sleeps in my test, so that I was sure that the new button was displayed, expecting my tests to fail when using the "old" locator for checkig the visibility of the old not existing button, but tests still only failed when trying to click that button.
After changing the locator to search for the "new" button, the test works. While this is in my testcase correct, I still wonder, why the visible and enabled expectations for the old button didn't fail and why trace view shows an outdated ui.

[quyctd]

I have the same issue. Increase the timeout works, but that doesn't make any sense. My button is here and shows in the trace viewer, but somehow Playwright cannot click it. Very weird.

[mxschmitt]

For future users running into it: we recommend filing a new issue with a minimal reproduction so we can help you better, since this error can have many different causes.