luulam/AFFiNE
1
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

refactor(core): rename explorer to navigation-panel (#11876)

Browse Source
This commit is contained in:
EYHN
2025-04-22 12:47:35 +08:00
committed by GitHub
parent f918573ba8
commit e4d6833296
104 changed files with 913 additions and 769 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
tests/affine-mobile/e2e/explorer-favorite.spec.ts
View File

@@ -7,7 +7,9 @@ import { expandCollapsibleSection, pageBack } from './utils';
test('Create new doc in favorites', async ({ page }) => {
const section = await expandCollapsibleSection(page, 'favorites');
const newButton = section.getByTestId('explorer-bar-add-favorite-button');
const newButton = section.getByTestId(
'navigation-panel-bar-add-favorite-button'
);
await newButton.tap();
// const testTitleText = 'Test Favorited Doc';
@@ -19,7 +21,7 @@ test('Create new doc in favorites', async ({ page }) => {
await pageBack(page);
const section2 = await expandCollapsibleSection(page, 'favorites');
const node = section2.getByTestId(`explorer-doc-${docId}`);
const node = section2.getByTestId(`navigation-panel-doc-${docId}`);
await expect(node).toBeVisible();
// const label = node.getByText(testTitleText);

12
tests/affine-mobile/e2e/explorer-folder.spec.ts
View File

@@ -4,11 +4,13 @@ import { expect, type Locator, type Page } from '@playwright/test';
import {
expandCollapsibleSection,
getAttrOfActiveElement,
openExplorerNodeMenu,
openNavigationPanelNodeMenu,
} from './utils';
const locateFolder = async (scope: Page | Locator, name: string) => {
return scope.locator(`[data-role="explorer-folder"][aria-label="${name}"]`);
return scope.locator(
`[data-role="navigation-panel-folder"][aria-label="${name}"]`
);
};
/**
@@ -21,7 +23,7 @@ const isRenameInputFocused = async (page: Page) => {
const createRootFolder = async (page: Page, name: string) => {
const section = await expandCollapsibleSection(page, 'organize');
await section.getByTestId('explorer-bar-add-organize-button').tap();
await section.getByTestId('navigation-panel-bar-add-organize-button').tap();
const dialog = page.getByRole('dialog');
await expect(dialog).toBeVisible();
await isRenameInputFocused(page);
@@ -33,7 +35,7 @@ const createRootFolder = async (page: Page, name: string) => {
};
const createSubFolder = async (page: Page, parent: Locator, name: string) => {
const menu = await openExplorerNodeMenu(page, parent);
const menu = await openNavigationPanelNodeMenu(page, parent);
await menu.getByTestId('create-subfolder').tap();
const dialog = page.getByRole('dialog');
@@ -64,7 +66,7 @@ test('create a folder and rename it', async ({ page }) => {
const appendedName = ' Renamed';
const folder = await createRootFolder(page, originalName);
const menu = await openExplorerNodeMenu(page, folder);
const menu = await openNavigationPanelNodeMenu(page, folder);
await menu.getByTestId('rename-folder').tap();
await isRenameInputFocused(page);
await page.keyboard.type(appendedName);

26
tests/affine-mobile/e2e/explorer-tag.spec.ts
View File

@@ -4,15 +4,17 @@ import { expect, type Locator, type Page } from '@playwright/test';
import {
expandCollapsibleSection,
getAttrOfActiveElement,
openExplorerNodeMenu,
openNavigationPanelNodeMenu,
} from './utils';
async function locateTag(scope: Page | Locator, name: string) {
return scope.locator(`[data-role="explorer-tag"][aria-label="${name}"]`);
return scope.locator(
`[data-role="navigation-panel-tag"][aria-label="${name}"]`
);
}
async function getExplorerTagColor(tagNode: Locator) {
const icon = tagNode.getByTestId('explorer-tag-icon-dot');
async function getNavigationPanelTagColor(tagNode: Locator) {
const icon = tagNode.getByTestId('navigation-panel-tag-icon-dot');
await expect(icon).toBeVisible();
const color = await icon.evaluate(el => el.style.backgroundColor);
return color;
@@ -33,7 +35,7 @@ async function createRootTag(
color = 'var(--affine-palette-line-red)'
) {
const section = await expandCollapsibleSection(page, 'tags');
await section.getByTestId('explorer-add-tag-button').tap();
await section.getByTestId('navigation-panel-add-tag-button').tap();
const dialog = page.getByRole('dialog');
await expect(dialog).toBeVisible();
// input name
@@ -47,21 +49,21 @@ async function createRootTag(
const tag = await locateTag(section, name);
await expect(tag).toBeVisible();
// check tag color
const fill = await getExplorerTagColor(tag);
const fill = await getNavigationPanelTagColor(tag);
expect(fill).toEqual(color);
return tag;
}
test('create a tag from explorer', async ({ page }) => {
test('create a tag from navigation panel', async ({ page }) => {
await createRootTag(page, 'Test Tag');
});
test('rename a tag from explorer', async ({ page }) => {
test('rename a tag from navigation panel', async ({ page }) => {
const originalName = 'Test Tag';
const appendedName = ' Renamed';
const tag = await createRootTag(page, originalName);
const menu = await openExplorerNodeMenu(page, tag);
const menu = await openNavigationPanelNodeMenu(page, tag);
await menu.getByTestId('rename-tag').tap();
const focusedTestid = await getAttrOfActiveElement(page);
expect(focusedTestid).toEqual('rename-input');
@@ -72,16 +74,16 @@ test('rename a tag from explorer', async ({ page }) => {
await expect(renamedTag).toBeVisible();
});
test('change tag color from explorer', async ({ page }) => {
test('change tag color from navigation panel', async ({ page }) => {
const newColor = 'var(--affine-palette-line-green)';
const tagName = 'Test Tag';
const tag = await createRootTag(page, tagName);
const menu = await openExplorerNodeMenu(page, tag);
const menu = await openNavigationPanelNodeMenu(page, tag);
await menu.getByTestId('rename-tag').tap();
await changeTagColor(menu, newColor);
await menu.getByTestId('rename-confirm').tap();
const updatedTag = await locateTag(page, tagName);
const fill = await getExplorerTagColor(updatedTag);
const fill = await getNavigationPanelTagColor(updatedTag);
expect(fill).toEqual(newColor);
});

9
tests/affine-mobile/e2e/utils.ts
View File

@@ -1,8 +1,8 @@
/* eslint-disable unicorn/prefer-dom-node-dataset */
import { expect, type Locator, type Page } from '@playwright/test';
export async function expandCollapsibleSection(page: Page, name: string) {
const divider = page.locator(`[data-collapsible]:has-text("${name}")`);
// oxlint-disable-next-line prefer-dom-node-dataset
if ((await divider.getAttribute('data-collapsed')) === 'true') {
await divider.click();
}
@@ -32,10 +32,10 @@ export async function getAttrOfActiveElement(
}
/**
* Open the context menu of an explorer node
* Open the context menu of an navigation panel node
* @returns Menu Locator
*/
export async function openExplorerNodeMenu(page: Page, node: Locator) {
export async function openNavigationPanelNodeMenu(page: Page, node: Locator) {
await node.getByTestId('menu-trigger').tap();
const menu = page.getByRole('dialog');
await expect(menu).toBeVisible();
@@ -49,7 +49,8 @@ export async function openTab(
const tab = page.locator('#app-tabs').getByRole('tab', { name });
await expect(tab).toBeVisible();
await tab.click();
// eslint-disable-next-line unicorn/prefer-dom-node-dataset
// oxlint-disable-next-line prefer-dom-node-dataset
const isActive = await tab.getAttribute('data-active');
expect(isActive).toBe('true');
}