Files
portfolio/app/__tests__/components/Hero.test.tsx
T
denshooter 96ec2d867f feat: plakat redesign phase 1 (tokens, fonts, poster hero, header) (#74)
- New design tokens: signal red, ink and paper as RGB channels; ink and paper
  swap roles in dark mode so every component inverts cleanly
- Fonts via next/font: Bricolage Grotesque (with wdth/opsz axes), Geist,
  Geist Mono; drop Inter and Playfair
- Poster hero: kicker, giant DK0 wordmark that reacts to pointer distance
  (weight and width through a damped spring, desktop only, off for reduced
  motion), claim as h1, intro with thesis countdown, marquee strip
- Header in poster style: transparent over the red hero, paper strip with
  ink rule when scrolled or on subpages; drawer menu restyled
- Remove wavy SVG separators, CSS shader gradient, background blobs and
  unused providers that caused the pink/purple bands between sections
- Drop the global p/span/div color override so colors inherit properly
- New hero texts in de/en, tests and i18n key check updated

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-10-15 23:48:39 +02:00

41 lines
1.7 KiB
TypeScript

import { render, screen } from '@testing-library/react';
import Hero from '@/app/components/Hero';
// Mock next-intl/server
jest.mock('next-intl/server', () => ({
getTranslations: () =>
Promise.resolve((key: string, values?: { days?: number }) => {
const messages: Record<string, string> = {
kicker: 'Dennis Konkol — Osnabrück, Germany',
claim: 'I self-host half my life. The rest I code.',
intro: "IT admin in Osnabrück and master's student.",
countdown: `${values?.days ?? 0} days to go.`,
ctaWork: 'See projects',
ctaContact: 'Write me',
};
return messages[key] || key;
}),
}));
describe('Hero', () => {
it('renders the poster hero with claim, intro and calls to action', async () => {
const HeroResolved = await Hero({ locale: 'en' });
render(HeroResolved);
expect(screen.getByRole('heading', { level: 1 })).toHaveTextContent('I self-host half my life. The rest I code.');
expect(screen.getByText('Dennis Konkol — Osnabrück, Germany')).toBeInTheDocument();
expect(screen.getByText(/IT admin in Osnabrück/)).toBeInTheDocument();
expect(screen.getByRole('link', { name: /See projects/ })).toHaveAttribute('href', '#projects');
expect(screen.getByRole('link', { name: 'Write me' })).toHaveAttribute('href', '#contact');
});
it('renders the DK0 wordmark as decoration hidden from assistive tech', async () => {
const HeroResolved = await Hero({ locale: 'en' });
const { container } = render(HeroResolved);
const wordmark = container.querySelector('[aria-hidden="true"].font-display');
expect(wordmark).not.toBeNull();
expect(wordmark).toHaveTextContent('DK0');
});
});