mirror of
https://github.com/AmanTahiliani/box-box.git
synced 2026-08-08 04:06:18 -04:00
AmanTahiliani
02a84f67b4
Consolidate the Race Story section into a cohesive timeline surface: custom chapter-strip scrolling with active-card sync, unified segmented playback controls, chapter bands on the position graph with decimated axes and de-collided labels, map toggle gated by an on-mount replay/outline probe, and shared empty-state cards. Adds vitest coverage and visual snapshots. Note: replay/outline queries now probe on mount (not only when Map opens) so the toggle can be hidden before users hit a dead panel. Co-authored-by: Cursor <cursoragent@cursor.com>
58 lines
1.6 KiB
TypeScript
58 lines
1.6 KiB
TypeScript
import { describe, expect, it } from 'vitest'
|
|
import { render, screen } from '@testing-library/react'
|
|
import { ReplayTrackMap } from '../components/ReplayTrackMap'
|
|
import type { EnrichedResult, ReplayFramesResponse, TrackOutline } from '../types'
|
|
|
|
const outline: TrackOutline = {
|
|
circuit_key: 1,
|
|
bounds: { minX: 0, maxX: 100, minY: 0, maxY: 100 },
|
|
points: [
|
|
{ x: 0, y: 0 },
|
|
{ x: 1, y: 0 },
|
|
{ x: 1, y: 1 },
|
|
],
|
|
}
|
|
|
|
const replay: ReplayFramesResponse = {
|
|
session_key: 99,
|
|
interval_ms: 5000,
|
|
start_time: '2025-05-25T13:00:00Z',
|
|
frames: [
|
|
{ t: 0, cars: { '1': { x: 0, y: 0 } } },
|
|
{ t: 5000, cars: { '1': { x: 50, y: 50 } } },
|
|
],
|
|
}
|
|
|
|
const results: EnrichedResult[] = [
|
|
{
|
|
driver_number: 1,
|
|
position: 1,
|
|
name_acronym: 'VER',
|
|
full_name: 'Max Verstappen',
|
|
team_name: 'Red Bull Racing',
|
|
team_colour: '3671C6',
|
|
dnf: false,
|
|
dns: false,
|
|
dsq: false,
|
|
duration: null,
|
|
gap_to_leader: null,
|
|
number_of_laps: 78,
|
|
points: 25,
|
|
session_key: 99,
|
|
meeting_key: 1,
|
|
},
|
|
]
|
|
|
|
describe('ReplayTrackMap', () => {
|
|
it('renders an empty-state card when replay frames are missing', () => {
|
|
render(<ReplayTrackMap outline={outline} replay={{ ...replay, frames: [] }} tMs={0} drivers={[]} results={results} />)
|
|
expect(screen.getByTestId('replay-map-no-frames')).toBeInTheDocument()
|
|
expect(screen.getByText('Historical GPS unavailable')).toBeInTheDocument()
|
|
})
|
|
|
|
it('renders car labels from result metadata', () => {
|
|
render(<ReplayTrackMap outline={outline} replay={replay} tMs={2500} drivers={[]} results={results} />)
|
|
expect(screen.getByLabelText(/VER replay position/i)).toBeInTheDocument()
|
|
})
|
|
})
|