Usually, we can just chain two locators with `>>` to implement
`Locator.locator(locator)`. However, this does not play nicely with more
advanced inner locators like `or` and `and`:
```ts
const child = page.locator('input').or(page.locator('button'));
page.locator('parent').locator(child);
```
One would expect the above to locate "input or button" inside a
"parent". However, currently it locates "input inside a parent" or
"button", because it's translated to `parent >> input >>
internal:or="button"`.
To fix this, we have to wrap inner locator into `internal:chain` and
query it separately from the parent.
Fixes#23724.
So, the following will work:
```
page.frameLocator('iframe').locator('span').or(page.frameLoactor('iframe').locator('div'))
```
The following will not work, because frame locators are not exactly the
same:
```
page.frameLocator('#iframe1').locator('span').or(page.frameLoactor('#iframe2').locator('div'))
```
Also improve the error message to be more readable and include the
locator.
Fixes#23697.
When generating a selector, we tend to match by role and call various
roleUtils methods multiple times.
Apply the usual pattern for "nested operations counter" and aggressively
cache the results.
I added a new option to the screenshot method to customize the color of
the box when we want to mask some elements for the screenshot.
The default color is pink `#FF00FF`, but with this new option you can
specify the color you like the most, like a nice green `#00FF00`:
```js
await page.screenshot({
mask: [page.locator('div').nth(5)],
maskColor: "#00FF00",
})
```

---------
Signed-off-by: Jasiel Guillén <darkensses@gmail.com>
The method accepts a `ratio` option to assert the ratio
of the element in viewport. `ratio` defaults to `Number.MIN_VALUE`.
NOTE: this reverts commit d950f5b6ee3fee4b825831983d5af5b197bda769 and
adds `ratio` option support + does the rename.
Fixes#8740
This is a new web-first assertion that should be used like this:
```ts
test('should work', async ({ page }) => {
const locator = page.locator('body');
// New web-first assertion.
await expect(locator).toIntersectViewport();
// The same functionality.
await expect.poll(() => locator.viewportRatio()).toBeGreaterThan(0);
});
```
Fixes#8740
- Properly convert coordinates for iframes with non-zero borders.
- IFrames that have `transform` anywhere in the ancestors skip
`hitPoint`-based check because we cannot reliably translate the viewport
point into frame document's coordinates.
Fixes#18245.
Following the `getByText()` and other methods:
- By default, matching is substring and case-insensitive. Before, it was
only case-insensitive, but not substring.
- With new option `exact: true`, matching is full string and
case-sensitive.
- Matching always normalizes whitespace.
- Codegen generates `exact: false` by default.
- `internal:role` treats `[name="foo"i]` as non-exact match.
Various fixes:
- Updated `getByRole` docs to match the reality.
- Locator generator edge cases.
- prefer `role=checkbox` over `input[type=checkbox]`
- prefer `#id` over `input[type=checkbox]` and `role=checkbox`
- prefer `text=foo` over `internal:has-text=foo`
- ignore `none` and `presentation` roles
- remove non-strict support