// @vitest-environment jsdom
import { cleanup, fireEvent, render, screen } from '@testing-library/react';
import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
import { en } from '../i18n/en';
import { ResultView } from './ResultView';

const { downloadImage } = vi.hoisted( () => ( { downloadImage: vi.fn() } ) );
vi.mock( '../imageUtils', () => ( { downloadImage } ) );

describe( 'ResultView', () => {
	beforeEach( () => {
		downloadImage.mockReset();
		vi.spyOn( Date, 'now' ).mockReturnValue( 1234 );
	} );

	afterEach( () => {
		cleanup();
		vi.restoreAllMocks();
	} );

	it( 'switches between result and comparison and runs all shopper actions', () => {
		const onTryAnother = vi.fn();
		const onClose = vi.fn();
		render(
			<ResultView
				resultImage="data:image/png;base64,result"
				originalClothingImage="data:image/png;base64,garment"
				productTitle="Blue Dress"
				onTryAnother={ onTryAnother }
				onClose={ onClose }
				t={ en.result }
			/>
		);

		expect( screen.getByRole( 'img', { name: 'Result' } ) ).toBeTruthy();
		fireEvent.click( screen.getByRole( 'button', { name: 'Compare' } ) );
		expect( screen.getByRole( 'img', { name: 'Original' } ).getAttribute( 'src' ) ).toContain( 'garment' );
		expect( screen.getByRole( 'img', { name: 'Try-On' } ).getAttribute( 'src' ) ).toContain( 'result' );
		fireEvent.click( screen.getByRole( 'button', { name: 'Result' } ) );
		fireEvent.click( screen.getByRole( 'button', { name: 'Download' } ) );
		fireEvent.click( screen.getByRole( 'button', { name: 'Try Different Photo' } ) );
		fireEvent.click( screen.getByRole( 'button', { name: 'Continue Shopping' } ) );

		expect( downloadImage ).toHaveBeenCalledWith(
			'data:image/png;base64,result',
			'virtual-tryon-blue-dress-1234.png'
		);
		expect( onTryAnother ).toHaveBeenCalledOnce();
		expect( onClose ).toHaveBeenCalledOnce();
		expect( screen.getByText( 'Trying on: Blue Dress' ) ).toBeTruthy();
	} );

	it( 'renders the result-only variant and uses the fallback filename', () => {
		render(
			<ResultView
				resultImage="result"
				onTryAnother={ vi.fn() }
				onClose={ vi.fn() }
				t={ en.result }
			/>
		);

		expect( screen.queryByRole( 'button', { name: 'Compare' } ) ).toBeNull();
		fireEvent.click( screen.getByRole( 'button', { name: 'Download' } ) );
		expect( downloadImage ).toHaveBeenCalledWith( 'result', 'virtual-tryon-result-1234.png' );
	} );
} );