[Feature]: add method locator.isClickable and Locator.toBeClickable

[marcusNumminen]

🚀 Feature Request

Add method locator.isClickable and Locator.toBeClickable to be able to see if a element is "truly" clickable from an enduser perspective. If I have an text field that have an overlaying invisible element then I can check if it's visible and editable and I can add text to it by using fill but as soon as I try to click on it playwright can't click on it.

We currently have a bug that the end user under some circumstance can't edit a text field due to an overlaying element and I want to create a test exactly for this case.

I can create a test for this by using expect().toPass() like this:

 test('test if something overlay', async () => {
    await expect(async () => {
      await page.locator('#myTextField').click({timeout: 1000});
    }, 'Can\'t click on the text field').toPass({timeout: 5000});
  });

But this would look much cleaner:

 test('test if something overlay', async () => {
	await expect(page.locator('#myTextField'), 'Can\'t click on the text field').toBeClickable()
 });

Example

No response

Motivation

Testing of overlaying element would be much cleaner

[yury-s]

You can pass trial: true, would that work? If not, please share an example of the page and the test.

[marcusNumminen]

Good morning. Oh, I have missed that option I will test it. But still I think in would be nice to have locator.isClickable and Locator.toBeClickable because it would be much cleaner and more readable tests in this case

[marcusNumminen]

I just tested the trial: true But still I have to capture that within expect().toPass() to make a specific test out that. I still prefer the locator.isClickable and Locator.toBeClickable since the code would be cleaner in this case.

[yury-s]

But still I have to capture that within expect().toPass() to make a specific test out that.

Why? If you need to hide an element that occasionally obstructs clicking on another, you can consider addLocatorHandler

I still prefer the locator.isClickable and Locator.toBeClickable since the code would be cleaner in this case.

You can use test.step with box parameter to give your assertion custom name. Given that the functionality is already there, it is unlikely we'll be changing this API.

[pavelfeldman]

Closing as per above, please feel free to open a new issue if this does not cover your use case.