playwright icon indicating copy to clipboard operation
playwright copied to clipboard

Published 20 hours ago • verified publisher icon microsoft

Improve styling for HTML reports

Open pastelsky opened this issue 2 years ago • 3 comments
trafficstars

  1. Enable text wrapping and use more subtle colors for ANSI text in errors view — Screenshot 2022-11-30 at 12 46 50 AM

  2. Use subtle shadows on image and video elements, more grabbable handle — Screenshot 2022-11-30 at 12 45 50 AM

  3. The Image Mismatch section is now displayed first (just after errors) as its more often than not what you want to review first if present.

pastelsky avatar Nov 29 '22 19:11 pastelsky

Thanks for reviewing @pavelfeldman . Is there a better develop to iterate on the design of the HTML reports react page? Currently I need to manually run yarn build in the package, and start an integration test to preview my changes.

pastelsky avatar Nov 30 '22 11:11 pastelsky

I wonder why the CI checks are stuck?

pastelsky avatar Nov 30 '22 13:11 pastelsky

I wonder why the CI checks are stuck?

We have tests for the html report which are failing: https://github.com/microsoft/playwright/actions/runs/3592702190/jobs/6048732780#step:9:167 after your changes.

mxschmitt avatar Dec 13 '22 07:12 mxschmitt

Looks like the tests failed. Do you want to look at the failures?

pavelfeldman avatar Dec 19 '22 23:12 pavelfeldman

Closing as stake, but please feel free to re-post of reopen if you get back to it!

pavelfeldman avatar Dec 21 '22 21:12 pavelfeldman