Filip/playwright
1
0
Fork 0
Code Issues Pull requests Actions Packages Projects Releases Wiki Activity

tweak: use div instead of textarea to display text attachments

Browse source
This commit is contained in:
alvaromartmart 2024-06-15 23:50:01 +02:00
parent c034a4e9de
commit 3520c7a86b
3 changed files with 12 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
packages/trace-viewer/src/ui/attachmentsTab.css
View file

@ -49,5 +49,7 @@
.attachment-item .attachment-item__text {
display: block;
width: 100%;
border: 1px solid var(--vscode-panel-border);
border-radius: 2px;
padding: 0.5rem;
}

4
packages/trace-viewer/src/ui/attachmentsTab.tsx
View file

@ -41,7 +41,9 @@ const TextAttachment: React.FunctionComponent<TextAttachmentProps> = ({ attachme
};
}, [attachment]);
return <textarea aria-label={attachment.name} className="attachment-item__text" disabled value={text!}/>;
return <div aria-label={attachment.name} className="attachment-item__text">
{text!}
</div>;
};
export const AttachmentsTab: React.FunctionComponent<{

11
tests/playwright-test/ui-mode-test-attachments.spec.ts
View file

@ -25,6 +25,7 @@ test('should contain text attachment', async ({ runUITest }) => {
test('attach test', async () => {
await test.info().attach('note', { path: __filename });
await test.info().attach('🎭', { body: 'hi tester!', contentType: 'text/plain' });
await test.info().attach('escaped', { body: '<div>\\nFoo\\nBar\\n</div>', contentType: 'text/plain' });
});
`,
});
@ -32,13 +33,15 @@ test('should contain text attachment', async ({ runUITest }) => {
await page.getByTitle('Run all').click();
await expect(page.getByTestId('status-line')).toHaveText('1/1 passed (100%)');
await page.getByText('Attachments').click();
for (const { name, content } of [
{ name: 'note', content: 'attach test' },
{ name: '🎭', content: 'hi tester!' }
for (const { name, content, displayedAsText } of [
{ name: 'note', content: 'attach test', displayedAsText: false },
{ name: '🎭', content: 'hi tester!', displayedAsText: true },
{ name: 'escaped', content: '<div>\nFoo\nBar\n</div>', displayedAsText: true },
]) {
await page.getByText(`attach "${name}"`, { exact: true }).click();
const downloadPromise = page.waitForEvent('download');
await expect(page.getByLabel('🎭')).toHaveText('hi tester!');
if (displayedAsText)
await expect(page.getByLabel(name)).toHaveText(content);
await page.getByRole('link', { name: name }).click();
const download = await downloadPromise;
expect(download.suggestedFilename()).toBe(name);