fix(canvas): align workspace headers

This commit is contained in:
inman
2026-09-07 15:36:48 +08:00
parent a705253261
commit 0619327fbe
5 changed files with 32 additions and 33 deletions

View File

@@ -355,7 +355,7 @@ test.describe('AI Design V2 workspace', () => {
await expect(page.getByTestId('sidebar-image-workspace')).toBeVisible();
await expect(page.getByTestId('image-workspace-history-rail')).toBeVisible();
await expect(page.getByTestId('image-workspace-works-rail')).toHaveCount(0);
await expect(page.getByRole('heading', { name: '和 AI 一起完善创作' })).toBeVisible();
await expect(page.getByRole('heading', { name: '和 AI 一起完善创作' })).toHaveCount(0);
await expect(page.getByRole('heading', { name: '制作方案' })).toBeVisible();
await expect(page.getByRole('textbox', { name: '创作提示词' })).toHaveValue(
'把便携咖啡机呈现为城市通勤中的精密工具',
@@ -373,7 +373,11 @@ test.describe('AI Design V2 workspace', () => {
?.getBoundingClientRect();
const historyRail = document.querySelector('[data-testid="image-workspace-history-rail"]')
?.getBoundingClientRect();
return conversation && projectSidebar && workspace && historyRail
const workspaceHeader = document.querySelector('[data-testid="image-workspace-header"]')
?.getBoundingClientRect();
const historyHeader = document.querySelector('[data-testid="image-workspace-history-header"]')
?.getBoundingClientRect();
return conversation && projectSidebar && workspace && historyRail && workspaceHeader && historyHeader
? {
conversationHeight: conversation.height,
conversationWidth: conversation.width,
@@ -384,6 +388,10 @@ test.describe('AI Design V2 workspace', () => {
historyTopGap: Math.abs(workspace.top - historyRail.top),
historyBottomGap: Math.abs(workspace.bottom - historyRail.bottom),
historyHorizontalGap: Math.abs(conversation.right - historyRail.left),
workspaceHeaderHeight: workspaceHeader.height,
historyHeaderHeight: historyHeader.height,
headerTopGap: Math.abs(workspaceHeader.top - historyHeader.top),
headerBottomGap: Math.abs(workspaceHeader.bottom - historyHeader.bottom),
}
: null;
});
@@ -396,6 +404,10 @@ test.describe('AI Design V2 workspace', () => {
expect(layout!.historyTopGap).toBeLessThanOrEqual(1);
expect(layout!.historyBottomGap).toBeLessThanOrEqual(1);
expect(layout!.historyHorizontalGap).toBeLessThanOrEqual(1);
expect(layout!.workspaceHeaderHeight).toBe(64);
expect(layout!.historyHeaderHeight).toBe(64);
expect(layout!.headerTopGap).toBeLessThanOrEqual(1);
expect(layout!.headerBottomGap).toBeLessThanOrEqual(1);
expect(layout!.conversationWidth).toBeGreaterThan(600);
const desktopViewport = page.viewportSize();

View File

@@ -115,7 +115,7 @@ describe('AI Design Canvas page', () => {
render(<ImageCanvas />);
const conversation = screen.getByTestId('image-workspace-conversation');
expect(within(conversation).getByRole('heading', { name: '和 AI 一起完善创作' })).toBeInTheDocument();
expect(within(conversation).queryByRole('heading', { name: '和 AI 一起完善创作' })).not.toBeInTheDocument();
expect(within(conversation).getByRole('heading', { name: '制作方案' })).toBeInTheDocument();
expect(within(conversation).getByRole('textbox', { name: '创作提示词' })).toHaveValue(
'把便携咖啡机呈现为城市通勤中的精密工具',
@@ -132,6 +132,8 @@ describe('AI Design Canvas page', () => {
const historyRail = screen.getByTestId('image-workspace-history-rail');
expect(historyRail).toHaveClass('h-full', 'border-l');
expect(screen.getByTestId('image-workspace-header')).toHaveClass('h-16');
expect(screen.getByTestId('image-workspace-history-header')).toHaveClass('h-16');
expect(within(historyRail).getByRole('heading', { name: '历史作品' })).toBeInTheDocument();
expect(within(historyRail).getByText('还没有历史作品')).toBeInTheDocument();
expect(screen.queryByTestId('image-workspace-works-rail')).not.toBeInTheDocument();