Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(html): link from attachment step to attachment #33267

Draft
wants to merge 7 commits into
base: main
Choose a base branch
from

Conversation

Skn0tt
Copy link
Member

@Skn0tt Skn0tt commented Oct 24, 2024

Similar to #33265. Adds a link from the attachment step to the attachment view.

This comment has been minimized.

@Skn0tt
Copy link
Member Author

Skn0tt commented Oct 24, 2024

demo:

Screen.Recording.2024-10-24.at.14.40.25.mov

This comment has been minimized.

Copy link
Contributor

@dgozman dgozman left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

A screenshot of some sorts would be nice to see.

<span style={{ float: 'right' }}>{msToString(step.duration)}</span>
{attachmentName && <a style={{ float: 'right' }} title='link to attachment' href={'#' + componentID(params => params.set('attachment', attachmentName))} onClick={(evt) => { evt.stopPropagation(); }}>{icons.attachment()}</a>}
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Does this rely on the browser to automatically scroll to the anchor? How does that work together with the router? I am confused.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yes, that's how it works. Didn't even know we had a router until now - i'll see if I can switch this to our Link component.

I figured using the anchor to target an element is the most browser-standards way of making this work. But I can also change it to use scrollIntoView if you'd prefer that.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

#33295 is a refactoring that allows us to use one scrollIntoView implementation for all attachments. It makes this implementation a lot easier.

packages/html-reporter/src/testResultView.tsx Outdated Show resolved Hide resolved

This comment has been minimized.

This comment has been minimized.

This comment has been minimized.

@Skn0tt
Copy link
Member Author

Skn0tt commented Nov 19, 2024

I've updated this PR to use the Anchor primitive we added in #33537.

@Skn0tt Skn0tt requested a review from dgozman November 19, 2024 16:20
Copy link
Contributor

Test results for "tests 1"

10 failed
❌ [playwright-test] › reporter-html.spec.ts:919:5 › merged › should link from attach step to attachment view @macos-latest-node18-2
❌ [playwright-test] › reporter-html.spec.ts:919:5 › created › should link from attach step to attachment view @macos-latest-node18-2
❌ [playwright-test] › reporter-html.spec.ts:919:5 › merged › should link from attach step to attachment view @ubuntu-latest-node18-2
❌ [playwright-test] › reporter-html.spec.ts:919:5 › created › should link from attach step to attachment view @ubuntu-latest-node18-2
❌ [playwright-test] › reporter-html.spec.ts:919:5 › merged › should link from attach step to attachment view @ubuntu-latest-node20-2
❌ [playwright-test] › reporter-html.spec.ts:919:5 › created › should link from attach step to attachment view @ubuntu-latest-node20-2
❌ [playwright-test] › reporter-html.spec.ts:919:5 › merged › should link from attach step to attachment view @ubuntu-latest-node22-2
❌ [playwright-test] › reporter-html.spec.ts:919:5 › created › should link from attach step to attachment view @ubuntu-latest-node22-2
❌ [playwright-test] › reporter-html.spec.ts:919:5 › merged › should link from attach step to attachment view @windows-latest-node18-2
❌ [playwright-test] › reporter-html.spec.ts:919:5 › created › should link from attach step to attachment view @windows-latest-node18-2

3 flaky ⚠️ [playwright-test] › ui-mode-test-setup.spec.ts:98:5 › should show errors in config @macos-latest-node18-1
⚠️ [installation tests] › playwright-electron-should-work.spec.ts:21:5 › electron should work @package-installations-macos-latest
⚠️ [chromium-library] › library/inspector/cli-codegen-aria.spec.ts:77:7 › should update aria snapshot highlight @ubuntu-20.04-chromium-tip-of-tree

36950 passed, 650 skipped
✔️✔️✔️

Merge workflow run.

@Skn0tt
Copy link
Member Author

Skn0tt commented Nov 19, 2024

sorry, i'll need to look more into this to make links to trace etc work

@Skn0tt Skn0tt marked this pull request as draft November 19, 2024 17:21
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants