Jayden/AFFiNE-Mirror
1
0
Fork 0
mirror of https://github.com/toeverything/AFFiNE.git synced 2026-02-28 03:12:19 +08:00
Code Issues Packages Projects Releases Wiki Activity

refactor(core): side bar resizing (#5280)

Browse Source 
Rewrite sidebar panel using a customized react-resizable-panels version that supports sidebar pixel sizing (not using flex percentages).

Now the left & right sidebar using the same `ResizePanel` impl.

fix https://github.com/toeverything/AFFiNE/issues/5271
fix TOV-163
fix TOV-146
fix TOV-168
fix TOV-109
fix TOV-165
This commit is contained in:
Peng Xiao
2023-12-13 07:52:01 +00:00
parent 2a9a6855f4
commit ce64685176
16 changed files with 406 additions and 386 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
tests/affine-local/e2e/layout.spec.ts
View File

@@ -34,7 +34,10 @@ test('Click resizer can close sidebar', async ({ page }) => {
const sliderBarArea = page.getByTestId('sliderBar-inner');
await expect(sliderBarArea).toBeVisible();
await page.getByTestId('app-sidebar-resizer').click();
await page
.getByTestId('app-sidebar-wrapper')
.getByTestId('resize-handle')
.click();
await expect(sliderBarArea).not.toBeInViewport();
});
@@ -44,7 +47,9 @@ test('Drag resizer can resize sidebar', async ({ page }) => {
const sliderBarArea = page.getByTestId('sliderBar-inner');
await expect(sliderBarArea).toBeVisible();
const sliderResizer = page.getByTestId('app-sidebar-resizer');
const sliderResizer = page
.getByTestId('app-sidebar-wrapper')
.getByTestId('resize-handle');
await sliderResizer.hover();
await page.mouse.down();
await page.mouse.move(400, 300, {

14
tests/affine-local/e2e/quick-search.spec.ts
View File

@@ -7,7 +7,7 @@ import {
waitForEditorLoad,
} from '@affine-test/kit/utils/page-logic';
import { clickSideBarAllPageButton } from '@affine-test/kit/utils/sidebar';
import { expect, type Page } from '@playwright/test';
import { expect, type Locator, type Page } from '@playwright/test';
const openQuickSearchByShortcut = async (page: Page, checkVisible = true) => {
await withCtrlOrMeta(page, () => page.keyboard.press('k', { delay: 50 }));
@@ -50,10 +50,9 @@ async function assertTitle(page: Page, text: string) {
}
}
async function checkElementIsInView(page: Page, searchText: string) {
const element = page.getByText(searchText);
async function checkElementIsInView(page: Page, locator: Locator) {
// check if the element is in view
const elementRect = await element.boundingBox();
const elementRect = await locator.boundingBox();
const viewportHeight = page.viewportSize()?.height;
if (!elementRect || !viewportHeight) {
@@ -401,7 +400,7 @@ test('can use cmdk to search page content and scroll to it, then the block will
await page.keyboard.press('Enter', { delay: 10 });
}
await page.keyboard.insertText('123456');
const textBlock = page.getByText('123456');
const textBlock = page.locator('editor-container').getByText('123456');
await expect(textBlock).toBeVisible();
await clickSideBarAllPageButton(page);
await openQuickSearchByShortcut(page);
@@ -413,7 +412,10 @@ test('can use cmdk to search page content and scroll to it, then the block will
]);
await page.locator('[cmdk-item] [data-testid=cmdk-label]').first().click();
await waitForScrollToFinish(page);
const isVisitable = await checkElementIsInView(page, '123456');
const isVisitable = await checkElementIsInView(
page,
page.locator('editor-container').getByText('123456')
);
expect(isVisitable).toBe(true);
const selectionElement = page.locator('affine-block-selection');
await expect(selectionElement).toBeVisible();