This PR fixes the react selector behavior to support components that are
wrapped by the memo or forwardRef React builtin functions.
Previously these components couldn't be selected. This PR fixes that
behavior, enabling selecting those components.
Current behavior:
```
const Foo = memo(() => <div id="foo_component" />);
Foo.displayName = "Foo";
...
playwright.$("_react=Foo") -> undefined
```
Fixed behavior:
```
const Foo = memo(() => <div id="foo_component" />);
Foo.displayName = "Foo";
...
playwright.$("_react=Foo") -> <div id ="foo_component" />
```
Hi, I am putting this PR out as a feeler to see if there's interested in
improving this error message, but the copy is by no means final and I am
open to improvement suggestions.
My intention here is to:
- Explain what a "focused item" is - that we're talking about a test and
it being focused is most likely down it using `only`
Are there other types of "items"? Are there other ways to make them
focused other than `only`?
- Explain why we're even in focused mode and how to control it
The default scaffolded Playwright config file includes a forbidMode
expression driven by whether `CI=1` is set.
I ran into this when trying to reproduce a CI issue locally so I had it
set and unknowingly entered focus only mode.
I wasn't aware this mode was a thing because I was using the default
configuration from `npm init` and did not familiarize myself with all
the options in it.
Is there a way to tell if we're in a TypeScript or JavaScript project in
this function? I would use that to display the configuration file name
with the right extension.
---------
Signed-off-by: Tomáš Hübelbauer <tomas@hubelbauer.net>
- `unhandled rejection during beforeAll should be reported and prevent
more tests` had timeout of 100ms that is too short on busy system;
- `runTSC` is always slow, so mark as such.
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>
This mode allows a suite to opt-out from parallelism. Useful to setup
multiple suites running in parallel, with each suite not being sharded.
References #22891.