wangxuming/makelore
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(canvas): restore left project sidebar

Browse Source
This commit is contained in:
inman
2026-09-07 14:31:43 +08:00
parent 918f8f80dc
commit b95f1b4df5
8 changed files with 116 additions and 62 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
tests/e2e/image-workspace-v2.spec.ts
View File

@@ -352,7 +352,8 @@ test.describe('AI Design V2 workspace', () => {
await page.getByTestId('ai-module-option-painting').click();
await expect(page.getByTestId('image-workspace')).toBeVisible();
await expect(page.getByTestId('image-workspace-conversation')).toBeVisible();
await expect(page.getByTestId('image-workspace-works-rail')).toBeVisible();
await expect(page.getByTestId('sidebar-image-workspace')).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: '制作方案' })).toBeVisible();
await expect(page.getByRole('textbox', { name: '创作提示词' })).toHaveValue(
@@ -365,30 +366,31 @@ test.describe('AI Design V2 workspace', () => {
const layout = await page.evaluate(() => {
const conversation = document.querySelector('[data-testid="image-workspace-conversation"]')
?.getBoundingClientRect();
const worksRail = document.querySelector('[data-testid="image-workspace-works-rail"]')
const projectSidebar = document.querySelector('[data-testid="sidebar"]')
?.getBoundingClientRect();
return conversation && worksRail
return conversation && projectSidebar
? {
conversationHeight: conversation.height,
railHeight: worksRail.height,
topGap: Math.abs(conversation.top - worksRail.top),
conversationWidth: conversation.width,
railWidth: worksRail.width,
sidebarWidth: projectSidebar.width,
horizontalGap: Math.abs(projectSidebar.right - conversation.left),
}
: null;
});
expect(layout).not.toBeNull();
expect(layout!.conversationHeight).toBeGreaterThan(300);
expect(Math.abs(layout!.conversationHeight - layout!.railHeight)).toBeLessThanOrEqual(1);
expect(layout!.topGap).toBeLessThanOrEqual(1);
expect(layout!.conversationWidth).toBeGreaterThan(layout!.railWidth);
expect(layout!.sidebarWidth).toBe(256);
expect(layout!.horizontalGap).toBeLessThanOrEqual(1);
expect(layout!.conversationWidth).toBeGreaterThan(600);
const desktopViewport = page.viewportSize();
await page.setViewportSize({ width: 375, height: 800 });
await expect(page.getByTestId('sidebar')).toBeHidden();
await expect(page.getByTestId('image-workspace-conversation')).toBeVisible();
await expect(page.getByTestId('youth-creation-card')).toBeVisible();
await page.getByRole('button', { name: '作品', exact: true }).click();
await expect(page.getByTestId('image-workspace-works-rail')).toBeVisible();
await expect(page.getByRole('dialog')).toHaveClass(/left-0/);
await page.keyboard.press('Escape');
await page.setViewportSize({ width: 768, height: 800 });
@@ -396,7 +398,8 @@ test.describe('AI Design V2 workspace', () => {
await expect(page.getByRole('button', { name: '作品', exact: true })).toBeVisible();
await page.setViewportSize(desktopViewport ?? { width: 1280, height: 800 });
await expect(page.getByTestId('image-workspace-works-rail')).toBeVisible();
await expect(page.getByTestId('sidebar-image-workspace')).toBeVisible();
await expect(page.getByTestId('image-workspace-works-rail')).toHaveCount(0);
await page.getByRole('combobox', { name: '画幅' }).selectOption('16:9');
await expect(page.getByRole('combobox', { name: '画幅' })).toHaveValue('16:9');

19
tests/unit/image-canvas-page.test.tsx
View File

@@ -125,16 +125,12 @@ describe('AI Design Canvas page', () => {
expect(screen.queryByText(/规格版本|编译器|生成策略|字段决策/)).not.toBeInTheDocument();
});
it('renders the Workspace list as a full-height right Works rail on desktop', () => {
it('leaves desktop Workspace navigation to the shared left project sidebar', () => {
setViewport(true);
prepareWorkspace();
render(<ImageCanvas />);
const rail = screen.getByTestId('image-workspace-works-rail');
expect(rail).toBeInTheDocument();
expect(within(rail).getByRole('heading', { name: '我的作品' })).toBeInTheDocument();
expect(within(rail).getByRole('button', { name: '打开作品 咖啡机新品主视觉' })).toBeInTheDocument();
expect(within(rail).getByRole('button', { name: '新建作品' })).toBeInTheDocument();
expect(screen.queryByTestId('image-workspace-works-rail')).not.toBeInTheDocument();
expect(screen.queryByRole('button', { name: '作品' })).not.toBeInTheDocument();
});
@@ -146,16 +142,19 @@ describe('AI Design Canvas page', () => {
render(<ImageCanvas />);
expect(screen.getByText(/制作方案已准备好，确认前仍可修改/)).toBeInTheDocument();
expect(within(screen.getByTestId('image-workspace-works-rail')).getByText('待确认')).toBeInTheDocument();
expect(screen.queryByTestId('image-workspace-works-rail')).not.toBeInTheDocument();
});
it('opens the Works rail as a right sheet on compact layouts', () => {
it('opens the Works rail as a left sheet on compact layouts', () => {
prepareWorkspace();
render(<ImageCanvas />);
fireEvent.click(screen.getByRole('button', { name: '作品' }));
expect(screen.getByTestId('image-workspace-works-rail')).toBeInTheDocument();
expect(within(screen.getByTestId('image-workspace-works-rail')).getByRole('heading', { name: '我的作品' })).toBeInTheDocument();
const rail = screen.getByTestId('image-workspace-works-rail');
expect(rail).toBeInTheDocument();
expect(within(rail).getByRole('heading', { name: '我的作品' })).toBeInTheDocument();
expect(rail.closest('[role="dialog"]')).toHaveClass('left-0');
expect(rail.closest('[role="dialog"]')).not.toHaveClass('right-0');
});
it('shows one unfinished assistant reply incrementally and replaces it with the canonical turn', async () => {

13
tests/unit/main-layout-module-gate.test.tsx
View File

@@ -7,19 +7,18 @@ import { useSettingsStore } from '@/stores/settings';
const routeRenderMock = vi.hoisted(() => vi.fn());
vi.mock('@/components/layout/Sidebar', () => ({
Sidebar: ({ sidebarCollapsedOverride }: { sidebarCollapsedOverride?: boolean }) => (
<aside data-testid="sidebar-stub" data-sidebar-collapsed={sidebarCollapsedOverride === undefined ? 'unset' : String(sidebarCollapsedOverride)} />
Sidebar: ({ hideOnCompact = false }: { hideOnCompact?: boolean }) => (
<aside data-testid="sidebar-stub" data-hide-on-compact={String(hideOnCompact)} />
),
}));
vi.mock('@/components/layout/TitleBar', () => ({
TitleBar: ({ integrated = false, overlay = false, showSidebarControls = true, pageTitle, sidebarCollapsedOverride }: { integrated?: boolean; overlay?: boolean; showSidebarControls?: boolean; pageTitle?: string; sidebarCollapsedOverride?: boolean }) => (
TitleBar: ({ integrated = false, overlay = false, showSidebarControls = true, pageTitle }: { integrated?: boolean; overlay?: boolean; showSidebarControls?: boolean; pageTitle?: string }) => (
<header
data-testid="titlebar-stub"
data-integrated={integrated ? 'true' : 'false'}
data-overlay={overlay ? 'true' : 'false'}
data-sidebar-controls={showSidebarControls ? 'true' : 'false'}
data-page-title={pageTitle ?? ''}
data-sidebar-collapsed={sidebarCollapsedOverride === undefined ? 'unset' : String(sidebarCollapsedOverride)}
/>
),
}));
@@ -54,14 +53,14 @@ describe('MainLayout module isolation', () => {
expect(screen.queryByTestId('project-initialization-gate')).not.toBeInTheDocument();
});
it('uses the full-height workspace shell for AI painting', () => {
it('uses the full-height workspace shell with the shared left project sidebar for AI painting', () => {
renderLayout('/image-canvas');
expect(screen.getByTestId('main-content')).toHaveClass('basis-0', 'h-full', 'overflow-hidden', 'p-0');
expect(screen.getByTestId('main-content')).not.toHaveClass('p-5', 'sm:p-6');
expect(screen.getByTestId('titlebar-stub')).toHaveAttribute('data-overlay', 'true');
expect(screen.getByTestId('titlebar-stub')).toHaveAttribute('data-sidebar-controls', 'false');
expect(screen.queryByTestId('sidebar-stub')).not.toBeInTheDocument();
expect(screen.getByTestId('titlebar-stub')).toHaveAttribute('data-sidebar-controls', 'true');
expect(screen.getByTestId('sidebar-stub')).toHaveAttribute('data-hide-on-compact', 'true');
});
it('does not overlay the local project initialization gate on AI hardware', () => {