[Feature]: Make it easy to identify what Inspector is associated to what window

[alexbjorlig]

🚀 Feature Request

When writing tests for multiple windows, it's not easy to tell what Playwright Inspector window is associated with what window.

Maybe we could rename the "Playwright Inspector" window, use color themes, or other smart ways.

Example

Check here, where I just have 2 windows:

Motivation

It will make Playwright better by enabling developers to keep their sanity while working on tests interacting with multiple windows. (for example realtime-sync tests)

[agg23]

Do you have any suggestions on how we might accomplish this? What would a different window title signify? Colors aren't accessible, so that's not good enough.

[alexbjorlig]

Do you have any suggestions on how we might accomplish this? What would a different window title signify? Colors aren't accessible, so that's not good enough.

It's a really good question, and it was very itentional that I did not mention a specific solution. But I think the screenshot makes it very clear, that something should be done 😅

What options could there be? What about patterns, if colors are not an option?

[agg23]

I think for now we will add the browser URL, just like in Chrome Devtools, but that is often not unique.

For identifying the window in question, the "Record" and "Pick locator" buttons will both bring the corresponding browser window to the front.