wehub-resource-sync
070959e133
landing-page-staging / Deploy landing page to staging (push) Has been skipped
landing-page-ci / Validate landing page (push) Failing after 4s
visual-baseline / Capture visual baselines (push) Has been cancelled
bake-plugin-previews / Bake plugin previews (push) Has been cancelled
102 lines
3.5 KiB
TypeScript
102 lines
3.5 KiB
TypeScript
// @vitest-environment jsdom
|
|
|
|
import { cleanup, fireEvent, render, screen } from '@testing-library/react';
|
|
import type { HostEditor, HostEditorsResponse } from '@open-design/contracts';
|
|
import { afterEach, describe, expect, it, vi } from 'vitest';
|
|
|
|
import { HandoffButton } from '../../src/components/HandoffButton';
|
|
import { I18nProvider, type Locale } from '../../src/i18n';
|
|
import { readExpandedIndexCss } from '../helpers/read-expanded-css';
|
|
|
|
afterEach(() => {
|
|
cleanup();
|
|
vi.restoreAllMocks();
|
|
vi.unstubAllGlobals();
|
|
window.localStorage.clear();
|
|
});
|
|
|
|
function stubEditors(editors: HostEditor[], platform: HostEditorsResponse['platform'] = 'darwin') {
|
|
vi.stubGlobal('fetch', vi.fn<typeof fetch>(async (input) => {
|
|
if (String(input) === '/api/editors') {
|
|
return new Response(JSON.stringify({ editors, platform }), {
|
|
status: 200,
|
|
headers: { 'content-type': 'application/json' },
|
|
});
|
|
}
|
|
throw new Error(`unexpected fetch ${String(input)}`);
|
|
}));
|
|
}
|
|
|
|
function renderLocalized(locale: Locale) {
|
|
render(
|
|
<I18nProvider initial={locale}>
|
|
<HandoffButton projectId="project-1" />
|
|
</I18nProvider>,
|
|
);
|
|
}
|
|
|
|
describe('HandoffButton i18n', () => {
|
|
it('keeps the header trigger as an icon-sized split control', () => {
|
|
const css = readExpandedIndexCss();
|
|
|
|
expect(css).toContain('.app .handoff-split');
|
|
expect(css).toContain('border: 1px solid transparent;');
|
|
expect(css).toContain('.app .handoff-trigger');
|
|
expect(css).toContain('width: 32px;');
|
|
expect(css).toContain('height: 30px;');
|
|
expect(css).toContain('.app .handoff-caret');
|
|
expect(css).toContain('width: 24px;');
|
|
});
|
|
|
|
it('makes the selected CLI framework visibly distinct', () => {
|
|
const css = readExpandedIndexCss();
|
|
|
|
expect(css).toContain('.app .handoff-framework-chip.active');
|
|
expect(css).toContain('color: var(--accent-strong);');
|
|
expect(css).toContain('font-weight: 700;');
|
|
expect(css).toContain('box-shadow:');
|
|
});
|
|
|
|
it('localizes the primary handoff label', async () => {
|
|
stubEditors([{ id: 'finder', label: 'Finder', available: true }]);
|
|
|
|
renderLocalized('en');
|
|
|
|
const trigger = await screen.findByTestId('handoff-trigger');
|
|
expect(trigger.getAttribute('title')).toBe('Open in Finder');
|
|
expect(trigger.querySelector('.handoff-trigger-label')?.classList.contains('sr-only')).toBe(true);
|
|
});
|
|
|
|
it('does not show the preferred editor row as selected', async () => {
|
|
window.localStorage.setItem('open-design:preferred-editor', 'cursor');
|
|
stubEditors([
|
|
{ id: 'cursor', label: 'Cursor', available: true },
|
|
{ id: 'finder', label: 'Finder', available: true },
|
|
]);
|
|
|
|
renderLocalized('en');
|
|
|
|
fireEvent.click(await screen.findByTestId('handoff-caret'));
|
|
const cursorRow = await screen.findByTestId('handoff-menu-item-cursor');
|
|
|
|
expect(cursorRow.className).not.toContain('active');
|
|
expect(cursorRow.getAttribute('aria-current')).toBeNull();
|
|
});
|
|
|
|
it('localizes the unavailable editor section', async () => {
|
|
stubEditors([
|
|
{ id: 'finder', label: 'Finder', available: true },
|
|
{ id: 'cursor', label: 'Cursor', available: false },
|
|
]);
|
|
|
|
renderLocalized('zh-CN');
|
|
|
|
fireEvent.click(await screen.findByTestId('handoff-caret'));
|
|
|
|
expect(await screen.findAllByText('未安装')).toHaveLength(1);
|
|
expect(screen.getByTestId('handoff-menu-item-cursor').textContent).toBe('Cursor');
|
|
expect(screen.getByTestId('handoff-menu-item-cursor').getAttribute('title'))
|
|
.toBe('Cursor - 未在 $PATH 中检测到');
|
|
});
|
|
});
|