// @ts-nocheck
import { describe, expect, it, vi } from 'vitest';
import { mount, unmount } from 'svelte';
import Sparkline from '../components/Sparkline.svelte';

// Leader round2: 项目列表每行内嵌迷你权益缩略图——
// 用最近一个回测 equity 的首尾点画 sparkline SVG；
// 无数据就整个组件留空（不渲染 svg）。

describe('Sparkline (real render)', () => {
  it('renders an svg with a first→last polyline when handed endpoints', async () => {
    const host = document.createElement('div');
    const inst = mount(Sparkline, {
      target: host,
      props: { first: 100, last: 90, up: false, ariaLabel: '最近回测权益缩略' }
    });
    await new Promise((r) => setTimeout(r, 50));
    const svg = host.querySelector('svg');
    expect(svg, 'sparkline must be a real svg element').toBeTruthy();
    const path = svg.querySelector('path, polyline');
    expect(path).toBeTruthy();
    const d = (path.getAttribute('d') || path.getAttribute('points')) ?? '';
    // polyline from left edge to right edge: both endpoints present in geometry
    expect(d).toContain('0'); // first x
    const coordsCount = d.trim().split(/[\s,L,M]+/).filter(Boolean).length;
    expect(coordsCount).toBeGreaterThanOrEqual(4); // 2 points × (x,y)
    unmount(inst);
    host.remove();
  });

  it('renders NOTHING (no svg) for missing data — 留空不渲染', async () => {
    const host = document.createElement('div');
    const inst = mount(Sparkline, { target: host, props: { first: null, last: null, ariaLabel: 'x' } });
    await new Promise((r) => setTimeout(r, 50));
    expect(host.querySelector('svg')).toBeNull();
    expect(host.textContent.trim()).toBe('');
    unmount(inst);
    host.remove();
  });

  it('方向语义：down 变红（危险色），up 变绿（成功色）', async () => {
    const down = document.createElement('div');
    const inst1 = mount(Sparkline, {
      target: down,
      props: { first: 100, last: 90, up: false, ariaLabel: 'x' }
    });
    await new Promise((r) => setTimeout(r, 30));
    const downColor = down.querySelector('path, polyline')?.getAttribute('stroke') ?? '';
    unmount(inst1);
    down.remove();

    const up = document.createElement('div');
    const inst2 = mount(Sparkline, {
      target: up,
      props: { first: 100, last: 130, up: true, ariaLabel: 'x' }
    });
    await new Promise((r) => setTimeout(r, 30));
    const upColor = up.querySelector('path, polyline')?.getAttribute('stroke') ?? '';
    unmount(inst2);
    up.remove();

    expect(downColor).not.toBe('');
    expect(upColor).not.toBe('');
    expect(downColor).not.toBe(upColor);
  });
});