import { describe, it, expect, afterEach } from 'vitest';
import { cleanup, render } from 'vitest-browser-svelte';
import * as m from '$lib/paraglide/messages.js';
import WorldBand from './WorldBand.svelte';
import { makeEntry } from './test-factories';

afterEach(() => cleanup());

function historical(overrides = {}) {
	return makeEntry({
		kind: 'EVENT',
		derived: false,
		type: 'HISTORICAL',
		title: 'Erster Weltkrieg',
		senderName: '',
		receiverName: '',
		precision: 'RANGE',
		eventDate: '1914-01-01',
		eventDateEnd: '1918-12-31',
		documentId: undefined,
		...overrides
	});
}

describe('WorldBand', () => {
	it('renders the historical title with the world glyph + "Weltgeschehen" cue (REQ-018)', () => {
		render(WorldBand, { entry: historical() });
		expect(document.body.textContent).toContain('Erster Weltkrieg');
		const hidden = document.querySelector('[aria-hidden="true"]');
		expect(hidden?.textContent).toBe('◍');
		const srOnly = document.querySelector('.sr-only');
		expect(srOnly?.textContent).toBe('Weltgeschehen');
	});

	it('renders a RANGE span pill 1914–1918 with a Zeitraum aria-label (REQ-009)', () => {
		render(WorldBand, { entry: historical() });
		const pill = document.querySelector('[data-testid="world-range"]');
		expect(pill).not.toBeNull();
		expect(pill?.textContent).toContain('1914–1918');
		expect(pill?.getAttribute('aria-label')).toBe('Zeitraum: 1914 bis 1918');
	});

	it('degrades a RANGE with no end to the start year, no span pill, no crash (REQ-010)', () => {
		render(WorldBand, { entry: historical({ eventDateEnd: undefined }) });
		expect(document.querySelector('[data-testid="world-range"]')).toBeNull();
		expect(document.body.textContent).toContain('Erster Weltkrieg');
		expect(document.body.textContent).toContain('1914');
	});

	it('appends the inline "· historisch" descriptor to a non-RANGE band (#833 REQ-009)', () => {
		render(WorldBand, {
			entry: historical({ precision: 'APPROX', eventDate: '1923-01-01', eventDateEnd: undefined })
		});
		expect(document.querySelector('[data-testid="world-range"]')).toBeNull();
		expect(document.body.textContent).toContain(m.timeline_layer_historical_suffix());
	});

	it('shows "· historisch" with a leading separator even when the band has no date (#833 REQ-009)', () => {
		render(WorldBand, {
			entry: historical({ precision: 'UNKNOWN', eventDate: undefined, eventDateEnd: undefined })
		});
		expect(document.querySelector('[data-testid="world-range"]')).toBeNull();
		expect(document.body.textContent).toContain(`· ${m.timeline_layer_historical_suffix()}`);
	});

	it('follows the RANGE span pill with inline "· historisch" text, not a second pill (#833 REQ-009)', () => {
		render(WorldBand, { entry: historical() });
		const pill = document.querySelector('[data-testid="world-range"]');
		expect(pill).not.toBeNull();
		// The #779 span pill + its Zeitraum aria-label are unchanged.
		expect(pill?.getAttribute('aria-label')).toBe('Zeitraum: 1914 bis 1918');
		// The descriptor is plain text outside the pill, not a second styled pill.
		expect(pill?.textContent).not.toContain(m.timeline_layer_historical_suffix());
		expect(document.body.textContent).toContain(m.timeline_layer_historical_suffix());
	});
});