import test from 'node:test';
import assert from 'node:assert/strict';

import { drawLucideIcon } from '../vr180player/dom/icons.js';

function createCanvasContextRecorder() {
	const calls = [];
	return {
		calls,
		beginPath() {
			calls.push(['beginPath']);
		},
		closePath() {
			calls.push(['closePath']);
		},
		lineTo(x, y) {
			calls.push(['lineTo', x, y]);
		},
		moveTo(x, y) {
			calls.push(['moveTo', x, y]);
		},
		restore() {
			calls.push(['restore']);
		},
		save() {
			calls.push(['save']);
		},
		scale(x, y) {
			calls.push(['scale', x, y]);
		},
		stroke() {
			calls.push(['stroke']);
		},
		translate(x, y) {
			calls.push(['translate', x, y]);
		},
		set lineCap(value) {
			calls.push(['lineCap', value]);
		},
		set lineJoin(value) {
			calls.push(['lineJoin', value]);
		},
		set lineWidth(value) {
			calls.push(['lineWidth', value]);
		},
		set strokeStyle(value) {
			calls.push(['strokeStyle', value]);
		}
	};
}

test('drawLucideIcon renders space-separated polygon points for the play icon', () => {
	const ctx = createCanvasContextRecorder();

	drawLucideIcon(ctx, 'play', 0, 0, 24);

	assert.deepEqual(
		ctx.calls.filter(([name]) => name === 'moveTo' || name === 'lineTo' || name === 'closePath'),
		[
			['moveTo', 6, 3],
			['lineTo', 20, 12],
			['lineTo', 6, 21],
			['lineTo', 6, 3],
			['closePath']
		]
	);
});