77 Commits

Author SHA1 Message Date
Max Schmitt
78054a7652
chore: remove 'screenshot instead of snapshot' usages (#32905)
Fixes https://github.com/microsoft/playwright/issues/32904
2024-10-01 18:38:10 +02:00
Pavel Feldman
11014145ce
chore: update trace event on action merge (#32860) 2024-09-27 21:18:30 -07:00
Max Schmitt
0d79291604
chore: hide screenshot instead of snapshot Trace Viewer feature (#32832) 2024-09-26 22:30:41 +02:00
Pavel Feldman
9bff4d7eab
chore: move sw files into the sw/ folder (#32837) 2024-09-26 11:22:20 -07:00
Pavel Feldman
8649b13f25
chore: start putting tv-recorder ui together (#32776) 2024-09-23 19:13:45 -07:00
Pavel Feldman
0c8b2a7c32
chore: take snapshot tab apart (#32756) 2024-09-23 15:51:15 -07:00
Dmitry Gozman
b3a82bef46
feat: do not record route calls in the trace (#32723)
These are represented in the network pane instead.
2024-09-21 10:17:59 -07:00
Pavel Feldman
17ed944a84
chore: iterate towards recording into trace (4) (#32743) 2024-09-20 16:56:05 -07:00
Pavel Feldman
3bff7b6ab1
chore: preserve selected trace action in live trace (#32630) 2024-09-16 17:33:52 -07:00
Simon Knott
3fe1263643
feat(trace viewer): show Screenshot instead of Snapshot (#32248)
Closes https://github.com/microsoft/playwright/issues/23964.

Trace snapshots are a best-effort snapshots of the browser DOM, but we
can't guarantee them to be exactly what the browser showed. One example
of this is `canvas` elements, where you just can't see their contents.
That makes snapshots useful, but not perfect.

For those cases where the snapshot doesn't show everything, this PR
introduces a new setting to show a screenshot instead. You won't be able
to scroll or inspect the DOM or select a locator anymore. But if the
snapshot was missing something, or displaying something wrong, you can
now check the screenshot instead.
2024-09-06 16:24:33 +02:00
Dmitry Gozman
d7393f998e
chore: simplify settings management in UI mode (#32440) 2024-09-04 01:05:07 -07:00
Pavel Feldman
9d86bc5336
fix(dupe): render dupe test error indicator (#32303)
Fixes https://github.com/microsoft/playwright/issues/32093
2024-08-23 14:33:37 -07:00
Simon Knott
17bb36a7fe
fix(ui): reset higlighted action on keyboard navigation (#32051)
Closes https://github.com/microsoft/playwright/issues/32050

When keyboarding through the action view, the UI continues showing the
hovered action. This makes keyboard nav hard to use.

The fix is to reset the higlighted action on keyboard navigation. This
is what we do when the mouse pointer leaves an action, and what I think
is reasonable.
2024-08-08 10:06:36 +02:00
Dmitry Gozman
bbe252a3d7
fix(ui mode): api review feedback (#31952)
- Hide "Testing Options" as not ready.
- Update SettingsView margins.
- Include `page.route` and similar methods into "Show route actions".
2024-08-01 05:36:19 -07:00
Yury Semikhatsky
47714d6559
feat(ui-mode): add annotations tab (#31945)
<img width="867" alt="image"
src="https://github.com/user-attachments/assets/7d714723-1d3f-49b2-944a-0a476d79aee8">

---------

Signed-off-by: Dmitry Gozman <dgozman@gmail.com>
Co-authored-by: Dmitry Gozman <dgozman@gmail.com>
2024-08-01 03:43:29 -07:00
Simon Knott
daca1681c0
refactor(ui): in splitview component, move sidebar and main from children into named properties (#31925)
Pulled out from https://github.com/microsoft/playwright/pull/31900

I stumbled over `React.Children`, because it's the first time I saw that
used. https://react.dev/reference/react/Children lists `React.Children`
it as "Legacy" and mentions it's uncommon. Also, the fact that SplitView
only displays its first two children, and all others are silently
discarded, can be a surprise to some.

By separating things out into `sidebar` and `main`, not only do we give
the two elements names (otherwise one needs to remember that sidebar is
always the first child), but we also prevent any "third children" from
being dropped.
2024-07-31 12:48:46 +02:00
Simon Knott
99724d0322
refactor(ui): some react refactorings (#31900)
Addresses https://github.com/microsoft/playwright/issues/31863. This PR
is chonky, but the individual commits should be easy to review. If
they're not, i'm happy to break them out into individual PRs.

There's two main things this does:

1. Remove some unused imports
2. Add a `clsx`-inspired helper function for classname templating

I wasn't able to replace `ReactDOM.render` with `ReactDOM.createRoot`.
This is the new recommended way starting with React 18, and the existing
one is going to be deprecated at some point. But it somehow breaks our
tests, i'll have to investigate that separately.
2024-07-31 12:12:06 +02:00
Simon Knott
b8b562888e
refactor(ui): synchronize settings via useSyncExternalStore instead of prop drilling (#31911)
Broken out from https://github.com/microsoft/playwright/pull/31900, part
of https://github.com/microsoft/playwright/issues/31863.

Synchronizes different `useSettings` calls via `useSyncExternalStore`.
This saves us from having to drill down settings props everywhere,
without the big refactoring that a `Context` would be.
2024-07-30 17:57:31 +02:00
Dmitry Gozman
f232507afa
feat(ui mode): ui updates (#31894)
- Update copy to clipboard button.
- Reveal test source in the Source tab instead of external editor.
- New button to reveal in the external editor in the Source tab.
- Move the Pick Locator button next to snapshot tabs.
2024-07-29 07:32:13 -07:00
Dmitry Gozman
a41cebc1c9
feat(ui mode): introduce Testing Options and Settings (#31841)
Testing Options control tests, while Settings are UI mode settings.

<img width="298" alt="Screenshot 2024-07-25 at 10 54 22 AM"
src="https://github.com/user-attachments/assets/7b6f5fff-687b-48d1-80b3-d1e6f2a257e8">


These sections are separately expandable, collapsed by default.

<img width="294" alt="Screenshot 2024-07-24 at 2 06 25 PM"
src="https://github.com/user-attachments/assets/5d35ac8c-9289-46ca-aaa2-ebc5419fa0c4">

References #31520.

---------

Signed-off-by: Simon Knott <info@simonknott.de>
Co-authored-by: Simon Knott <info@simonknott.de>
2024-07-25 11:23:43 -07:00
Dmitry Gozman
d87cb7a303
feat(trace viewer): allow hiding route actions (#31726)
Adds a new settings tab above the actions list.

<img width="307" alt="settings tab"
src="https://github.com/user-attachments/assets/792212b7-e2fd-4a5c-8878-654e2e060505">

Toggling the "Show route actions" checkbox hides all route calls:
`continue`, `fulfill`, `fallback`, `abort` and `fetch`.

References #30970.
2024-07-22 11:34:34 -07:00
Max Schmitt
6dbc7b54e8
feat(ui-mode): highlight console message in timeline on hover (#31756) 2024-07-18 16:39:40 +02:00
Rui Figueira
9bc45ea2fc
feature(trace-viewer): embedded mode support PoC (#30885)
Companion PR of https://github.com/microsoft/playwright-vscode/pull/483
2024-06-28 10:36:11 -07:00
Max Schmitt
9ca895dea0
fix(trace-viewer): trap focus inside drop-target popup (#29845)
https://github.com/microsoft/playwright/issues/29099
2024-03-07 22:24:21 +01:00
Sarkis Matinyan
0c3f60e95e
fix(ui): show stack frames in ui mode (#29560)
#29558, #29500
2024-03-06 12:29:35 -08:00
Dmitry Gozman
cf6549687c
fix(trace viewer): reveal error location when it comes from the test (#29268)
Errors coming from the test runner do not have an associated `action`,
but have a `stack` that we can reveal.
2024-02-01 08:23:07 -08:00
Pavel Feldman
462e70ab82
chore: render sidebar tab selector as drop down (#27844) 2023-10-27 15:31:31 -07:00
Pavel Feldman
ff206bd9c1
chore: render time in the trace viewer log (#27825) 2023-10-26 14:45:15 -07:00
Pavel Feldman
47733b04fb
chore: do not select after hooks automatically (#27805) 2023-10-25 17:05:06 -07:00
Pavel Feldman
0bb9f7cdf7
feat(ui): show test status in trace view (#27785) 2023-10-24 16:41:40 -07:00
Pavel Feldman
70dbb9d83a
feat(trace): allow navigating from error to source (#27464) 2023-10-05 14:59:59 -07:00
Pavel Feldman
c7d9ae1c8b
ui(trace): make drawer appear under action list (#27260) 2023-09-22 10:43:44 -07:00
Pavel Feldman
97b3625049
chore: polish ui mode for better mac appearance (#27008) 2023-09-11 19:01:00 -07:00
Pavel Feldman
ea4974ce36
chore: allow resetting the time filter (#26920) 2023-09-06 16:14:26 -07:00
Pavel Feldman
8c494e2519
chore: add log/error tabs and counters (#26843) 2023-09-01 20:12:05 -07:00
Pavel Feldman
1c5f53f216
chore: show innermost error in ui mode (#26840) 2023-09-01 13:48:15 -07:00
Pavel Feldman
fd31f5bc50
chore: fix har date types (#26783) 2023-08-30 12:40:46 -07:00
Pavel Feldman
a34deffa43
chore: highlight actions and har entries in timeline (#26781) 2023-08-29 22:23:08 -07:00
Pavel Feldman
91b784e15e
chore: update icon font (#26627) 2023-08-23 08:31:43 -07:00
Pavel Feldman
fe7b956c3b
chore: allow toggling sidebar location (#26589) 2023-08-21 19:40:44 -07:00
Pavel Feldman
2b16860e06
chore: locator tab polish (#26568) 2023-08-21 10:59:49 -07:00
Pavel Feldman
41c312cd04
chore: fix ui mode to show screenshots (#26563) 2023-08-20 14:47:18 -07:00
Pavel Feldman
09bb866333
chore: format console message from page (#26555) 2023-08-19 16:13:42 -07:00
Pavel Feldman
8f31191637
chore: pick locator tab (#26532) 2023-08-18 17:53:03 -07:00
Pavel Feldman
a705d68c8a
chore: filter actions, console and network based on the timeline window (#26509) 2023-08-16 16:30:17 -07:00
Pavel Feldman
67ad2c2bf4
feat(ui): render all console / network messages in trace (#24115) 2023-07-10 12:56:56 -07:00
Max Schmitt
4d02aa1e52
chore: render locator in trace viewer timeline label (#23754) 2023-06-16 17:56:11 +02:00
Pavel Feldman
b99c214b29
chore(trace): render drawer as a sidebar in the tv mode (#23451)
Fixes: https://github.com/microsoft/playwright/issues/23227
2023-06-01 15:49:48 -07:00
Pavel Feldman
0e1aeaaecf
chore: do not show stale source in the trace (#23163) 2023-05-19 15:18:18 -07:00
Pavel Feldman
2697e93663
chore: do not annotate actions after failed ones as timed out (#23148) 2023-05-18 15:52:44 -07:00