Files
fotospiel-app/resources/js/guest/pages/__tests__/UploadPageNavVisibility.test.tsx
2025-12-21 12:37:20 +01:00

98 lines
2.5 KiB
TypeScript

import React from 'react';
import { describe, expect, it, vi, beforeEach } from 'vitest';
import { render, waitFor } from '@testing-library/react';
import UploadPage from '../UploadPage';
vi.mock('react-router-dom', () => ({
useNavigate: () => vi.fn(),
useParams: () => ({ token: 'demo' }),
useSearchParams: () => [new URLSearchParams(), vi.fn()],
}));
vi.mock('../../hooks/useGuestTaskProgress', () => ({
useGuestTaskProgress: () => ({
markCompleted: vi.fn(),
}),
}));
vi.mock('../../context/GuestIdentityContext', () => ({
useGuestIdentity: () => ({
name: 'Guest',
}),
}));
vi.mock('../../hooks/useEventData', () => ({
useEventData: () => ({
event: {
guest_upload_visibility: 'immediate',
demo_read_only: false,
engagement_mode: 'photo_only',
},
}),
}));
vi.mock('../../context/EventStatsContext', () => ({
useEventStats: () => ({
latestPhotoAt: null,
onlineGuests: 2,
}),
}));
vi.mock('../../context/EventBrandingContext', () => ({
useEventBranding: () => ({
branding: {
primaryColor: '#f43f5e',
secondaryColor: '#fb7185',
buttons: { radius: 12 },
typography: {},
fontFamily: 'Montserrat',
},
}),
}));
vi.mock('../../i18n/useTranslation', () => ({
useTranslation: () => ({
t: (key: string, fallback?: string) => fallback ?? key,
locale: 'de',
}),
}));
vi.mock('../../services/eventApi', () => ({
getEventPackage: vi.fn().mockResolvedValue(null),
}));
vi.mock('../../services/photosApi', () => ({
uploadPhoto: vi.fn(),
}));
describe('UploadPage bottom nav visibility', () => {
beforeEach(() => {
document.body.classList.remove('guest-nav-visible');
document.body.classList.remove('guest-immersive');
Object.defineProperty(window, 'scrollY', { value: 0, writable: true, configurable: true });
vi.spyOn(window, 'requestAnimationFrame').mockImplementation((cb) => {
cb(0);
return 0;
});
vi.spyOn(window, 'cancelAnimationFrame').mockImplementation(() => {});
});
it('toggles the nav visibility based on scroll position', async () => {
render(<UploadPage />);
expect(document.body.classList.contains('guest-nav-visible')).toBe(false);
window.scrollY = 120;
window.dispatchEvent(new Event('scroll'));
await waitFor(() => {
expect(document.body.classList.contains('guest-nav-visible')).toBe(true);
});
window.scrollY = 0;
window.dispatchEvent(new Event('scroll'));
await waitFor(() => {
expect(document.body.classList.contains('guest-nav-visible')).toBe(false);
});
});
});