93 lines
2.7 KiB
TypeScript
93 lines
2.7 KiB
TypeScript
import React from 'react';
|
|
import { describe, expect, it, vi } from 'vitest';
|
|
import { render } from '@testing-library/react';
|
|
|
|
vi.mock('react-i18next', () => ({
|
|
useTranslation: () => ({ t: (key: string, fallback?: string) => fallback ?? key, i18n: { language: 'en-GB' } }),
|
|
}));
|
|
|
|
vi.mock('@tamagui/react-native-web-lite', () => ({
|
|
Pressable: ({ children, onPress, ...props }: { children: React.ReactNode; onPress?: () => void }) => (
|
|
<button type="button" onClick={onPress} {...props}>
|
|
{children}
|
|
</button>
|
|
),
|
|
}));
|
|
|
|
vi.mock('tamagui', () => {
|
|
const Stack = ({ children, ...props }: { children: React.ReactNode }) => <div {...props}>{children}</div>;
|
|
const Text = ({ children, ...props }: { children: React.ReactNode }) => <span {...props}>{children}</span>;
|
|
const Switch = ({ children }: { children?: React.ReactNode }) => <div>{children}</div>;
|
|
Switch.Thumb = () => <div />;
|
|
|
|
const ListItem = ({ title, iconAfter, ...props }: { title?: React.ReactNode; iconAfter?: React.ReactNode }) => (
|
|
<div {...props}>
|
|
{title}
|
|
{iconAfter}
|
|
</div>
|
|
);
|
|
|
|
const YGroup: any = ({ children }: { children: React.ReactNode }) => <div>{children}</div>;
|
|
YGroup.Item = ({ children }: { children: React.ReactNode }) => <div>{children}</div>;
|
|
|
|
return {
|
|
XStack: Stack,
|
|
YStack: Stack,
|
|
SizableText: Text,
|
|
ListItem,
|
|
YGroup,
|
|
Switch,
|
|
Separator: ({ children }: { children?: React.ReactNode }) => <div>{children}</div>,
|
|
};
|
|
});
|
|
|
|
vi.mock('../FormControls', () => ({
|
|
MobileSelect: ({ children }: { children: React.ReactNode }) => <select>{children}</select>,
|
|
}));
|
|
|
|
vi.mock('@/hooks/use-appearance', () => ({
|
|
useAppearance: () => ({
|
|
appearance: 'system',
|
|
resolved: 'light',
|
|
updateAppearance: vi.fn(),
|
|
}),
|
|
}));
|
|
|
|
vi.mock('../../theme', () => ({
|
|
useAdminTheme: () => ({
|
|
overlay: 'rgba(0,0,0,0.3)',
|
|
surface: '#ffffff',
|
|
border: '#e5e7eb',
|
|
textStrong: '#111827',
|
|
muted: '#6b7280',
|
|
surfaceMuted: '#f3f4f6',
|
|
accentSoft: '#fef2f2',
|
|
primary: '#FF5A5F',
|
|
glassShadow: 'rgba(15,23,42,0.14)',
|
|
shadow: 'rgba(0,0,0,0.12)',
|
|
}),
|
|
}));
|
|
|
|
import { UserMenuSheet } from '../UserMenuSheet';
|
|
|
|
const baseProps = {
|
|
onClose: vi.fn(),
|
|
user: { name: 'Ada Lovelace', email: 'ada@example.com' },
|
|
isMember: false,
|
|
navigate: vi.fn(),
|
|
};
|
|
|
|
describe('UserMenuSheet', () => {
|
|
it('slides in when open', () => {
|
|
const { getByTestId } = render(<UserMenuSheet {...baseProps} open={true} />);
|
|
|
|
expect(getByTestId('user-menu-sheet-panel').style.transform).toBe('translateX(0px)');
|
|
});
|
|
|
|
it('slides out when closed', () => {
|
|
const { getByTestId } = render(<UserMenuSheet {...baseProps} open={false} />);
|
|
|
|
expect(getByTestId('user-menu-sheet-panel').style.transform).toMatch(/translateX\(\d+px\)/);
|
|
});
|
|
});
|