Easily access failure screenshot after tests run
Clear and concise description of the problem
As a developer using Vitest browser mode, I want to quickly access the correct failure screenshot for a failed test so that I save time and don't need to manually figure out the correct filename.
Suggested solution
In the Failed Tests section that prints out in red at the bottom of a test run, add a log message with the full screenshot path below each FAIL src/components/MyApp.tsx > MyDescribe > does a thing log message so that I can just cmd+click or copy+paste it. This is nice in CI and when running from the CLI.
Additionally, accessing the screenshot from the browser UI when viewing the failure details would be very helpful to prevent context switching between the CLI and UI.
Alternative
Some way of checking if a test failed in afterEach such that I can console.log my own message; but this might not be as nice if the log doesn't end up getting printed out next to the test assertion failure message.
Additional context
Using v2.0.0.beta-12 browser mode with playwright
Validations
- [X] Follow our Code of Conduct
- [X] Read the Contributing Guidelines.
- [X] Read the docs.
- [X] Check that there isn't already an issue that request the same feature to avoid creating a duplicate.
I think we can have a tab with images on the right. Printing the URL in the error report also sounds like a nice idea.