37 lines
1.3 KiB
TypeScript
37 lines
1.3 KiB
TypeScript
// src/components/UserMenuSkeleton.test.tsx
|
|
import React from 'react';
|
|
import { render } from '@testing-library/react';
|
|
import { describe, it, expect } from 'vitest';
|
|
import { UserMenuSkeleton } from './UserMenuSkeleton';
|
|
|
|
describe('UserMenuSkeleton', () => {
|
|
it('should render without crashing', () => {
|
|
const { container } = render(<UserMenuSkeleton />);
|
|
expect(container.firstChild).toBeInTheDocument();
|
|
});
|
|
|
|
it('should have the main container with pulse animation', () => {
|
|
const { container } = render(<UserMenuSkeleton />);
|
|
expect(container.firstChild).toHaveClass('animate-pulse');
|
|
});
|
|
|
|
it('should render two child placeholder elements', () => {
|
|
const { container } = render(<UserMenuSkeleton />);
|
|
expect(container.firstChild?.childNodes.length).toBe(2);
|
|
});
|
|
|
|
it('should render a rectangular placeholder with correct styles', () => {
|
|
const { container } = render(<UserMenuSkeleton />);
|
|
expect(container.querySelector('.rounded-md')).toHaveClass(
|
|
'h-8 w-24 bg-gray-200 dark:bg-gray-700',
|
|
);
|
|
});
|
|
|
|
it('should render a circular placeholder with correct styles', () => {
|
|
const { container } = render(<UserMenuSkeleton />);
|
|
expect(container.querySelector('.rounded-full')).toHaveClass(
|
|
'h-10 w-10 bg-gray-200 dark:bg-gray-700',
|
|
);
|
|
});
|
|
});
|