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
- Rename internal selectors `has`, `control` and `attr` to
`internal:has`, `internal:control` and `internal:attr`.
- Fix `getByLabel()` to respect strictness, by introducing
`internal:label` selector.
- Move tests essential for ports to `selectors-by.spec`.
Currently, we ues `#root` vs `#root > *` selector for component roots
depending on the number of root children. This heuristic detects
fragments that render multiple elements inside the root.
However, this does not work with empty fragments that do not render
anything.
The fix is to make the `#root >> control=component` selector that would
dynamically detect the root. This supports empty fragments and also
allows for dynamic updates of the fragments.
