mirror of
https://github.com/toeverything/AFFiNE.git
synced 2026-07-20 19:46:32 +08:00
Fangdun Tsai
a71904e641
Closes: [BS-3549](https://linear.app/affine-design/issue/BS-3549/附件-toolbar-上添加-replace-action) [Screen Recording 2025-06-04 at 15.37.40.mov <span class="graphite__hidden">(uploaded via Graphite)</span> <img class="graphite__hidden" src="https://app.graphite.dev/api/v1/graphite/video/thumbnail/8ypiIKZXudF5a0tIgIzf/480c8690-7ec9-4188-92fd-ee3339afb558.mov" />](https://app.graphite.dev/media/video/8ypiIKZXudF5a0tIgIzf/480c8690-7ec9-4188-92fd-ee3339afb558.mov) <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **New Features** - Added the ability to replace attachments directly from the toolbar, allowing users to select and update files seamlessly. - **Bug Fixes** - Improved handling when replacing embedded attachments with unsupported file types, ensuring the view falls back to a card view as needed. - **Tests** - Introduced end-to-end tests to verify attachment replacement and correct UI behavior in both standard and edgeless editing modes. <!-- end of auto-generated comment: release notes by coderabbit.ai -->
119 lines
3.6 KiB
TypeScript
119 lines
3.6 KiB
TypeScript
import { test } from '@affine-test/kit/playwright';
|
|
import {
|
|
importAttachment,
|
|
importFile,
|
|
} from '@affine-test/kit/utils/attachment';
|
|
import {
|
|
clickEdgelessModeButton,
|
|
clickView,
|
|
locateToolbar,
|
|
toViewCoord,
|
|
} from '@affine-test/kit/utils/editor';
|
|
import { openHomePage } from '@affine-test/kit/utils/load-page';
|
|
import {
|
|
clickNewPageButton,
|
|
getBlockSuiteEditorTitle,
|
|
waitForEmptyEditor,
|
|
} from '@affine-test/kit/utils/page-logic';
|
|
import { expect } from '@playwright/test';
|
|
|
|
test.beforeEach(async ({ page }) => {
|
|
await openHomePage(page);
|
|
await clickNewPageButton(page);
|
|
await waitForEmptyEditor(page);
|
|
});
|
|
|
|
test.describe('Replaces attachment', () => {
|
|
test('should replace attachment in page', async ({ page }) => {
|
|
const title = getBlockSuiteEditorTitle(page);
|
|
await title.click();
|
|
await page.keyboard.press('Enter');
|
|
|
|
await importAttachment(page, 'lorem-ipsum.pdf');
|
|
|
|
const attachment = page.locator('affine-attachment').first();
|
|
await attachment.click();
|
|
|
|
const name = attachment.locator('.affine-attachment-content-title-text');
|
|
|
|
await expect(name).toHaveText('lorem-ipsum.pdf');
|
|
|
|
const toolbar = locateToolbar(page);
|
|
const replaceButton = toolbar.getByLabel('Replace attachment');
|
|
|
|
await importFile(page, 'v1-color-palettes-snapshot.zip', async () => {
|
|
await replaceButton.click({ delay: 50 });
|
|
});
|
|
|
|
await expect(attachment).toBeVisible();
|
|
|
|
await expect(name).toHaveText('v1-color-palettes-snapshot.zip');
|
|
});
|
|
|
|
test('should replace attachment in edgeless', async ({ page }) => {
|
|
await clickEdgelessModeButton(page);
|
|
|
|
const button = page.locator('edgeless-mindmap-tool-button');
|
|
await button.click();
|
|
|
|
const menu = page.locator('edgeless-mindmap-menu');
|
|
const mediaItem = menu.locator('.media-item');
|
|
await mediaItem.click();
|
|
|
|
await importFile(page, 'lorem-ipsum.pdf', async () => {
|
|
await toViewCoord(page, [100, 250]);
|
|
await clickView(page, [100, 250]);
|
|
});
|
|
|
|
const attachment = page.locator('affine-edgeless-attachment').first();
|
|
await attachment.click();
|
|
|
|
const name = attachment.locator('.affine-attachment-content-title-text');
|
|
|
|
await expect(name).toHaveText('lorem-ipsum.pdf');
|
|
|
|
const toolbar = locateToolbar(page);
|
|
const replaceButton = toolbar.getByLabel('Replace attachment');
|
|
|
|
await importFile(page, 'v1-color-palettes-snapshot.zip', async () => {
|
|
await replaceButton.click({ delay: 50 });
|
|
});
|
|
|
|
await expect(attachment).toBeVisible();
|
|
|
|
await expect(name).toHaveText('v1-color-palettes-snapshot.zip');
|
|
});
|
|
|
|
test('should fall back to card view when file type does not support embed view', async ({
|
|
page,
|
|
}) => {
|
|
const title = getBlockSuiteEditorTitle(page);
|
|
await title.click();
|
|
await page.keyboard.press('Enter');
|
|
|
|
await importAttachment(page, 'lorem-ipsum.pdf');
|
|
|
|
const attachment = page.locator('affine-attachment').first();
|
|
await attachment.click();
|
|
|
|
const toolbar = locateToolbar(page);
|
|
|
|
// Switches to embed view
|
|
await toolbar.getByLabel('Switch view').click();
|
|
await toolbar.getByLabel('Embed view').click();
|
|
|
|
const portal = attachment.locator('lit-react-portal');
|
|
await expect(portal).toBeVisible();
|
|
|
|
const replaceButton = toolbar.getByLabel('Replace attachment');
|
|
await importFile(page, 'v1-color-palettes-snapshot.zip', async () => {
|
|
await replaceButton.click({ delay: 50 });
|
|
});
|
|
|
|
await expect(portal).toBeHidden();
|
|
|
|
const name = attachment.locator('.affine-attachment-content-title-text');
|
|
await expect(name).toHaveText('v1-color-palettes-snapshot.zip');
|
|
});
|
|
});
|