@opendata-ai/openchart-engine 8.0.0-rc.9 → 8.0.0

package/src/__tests__/mark-keys.test.ts

@@ -1,294 +0,0 @@
-/**
- * Integration tests for mark key stamping across chart types.
- *
- * Verifies that compileChart() stamps stable `key` fields on marks
- * for data-update transitions. Each chart type has its own keying
- * strategy; these tests verify the end-to-end pipeline.
- */
-
-import type { ChartSpec } from '@opendata-ai/openchart-core';
-import { describe, expect, it } from 'vitest';
-import { compileChart } from '../compile';
-
-const dims = { width: 600, height: 400 };
-
-// ---------------------------------------------------------------------------
-// Column chart keys
-// ---------------------------------------------------------------------------
-
-describe('column chart mark keys', () => {
-  it('stamps unique keys on simple column marks', () => {
-    const spec: ChartSpec = {
-      mark: 'bar',
-      data: [
-        { category: 'A', value: 10 },
-        { category: 'B', value: 20 },
-        { category: 'C', value: 30 },
-      ],
-      encoding: {
-        x: { field: 'category', type: 'nominal' },
-        y: { field: 'value', type: 'quantitative' },
-      },
-    };
-    const layout = compileChart(spec, dims);
-    const rects = layout.marks.filter((m) => m.type === 'rect');
-    expect(rects.length).toBe(3);
-
-    for (const m of rects) {
-      expect((m as { key?: string }).key).toBeDefined();
-    }
-
-    const keys = rects.map((m) => (m as { key?: string }).key);
-    expect(new Set(keys).size).toBe(3);
-  });
-
-  it('deduplicates keys for duplicate category values', () => {
-    const spec: ChartSpec = {
-      mark: 'bar',
-      data: [
-        { category: 'A', value: 10 },
-        { category: 'A', value: 20 },
-        { category: 'B', value: 30 },
-      ],
-      encoding: {
-        x: { field: 'category', type: 'nominal' },
-        y: { field: 'value', type: 'quantitative' },
-      },
-    };
-    const layout = compileChart(spec, dims);
-    const rects = layout.marks.filter((m) => m.type === 'rect');
-    const keys = rects.map((m) => (m as { key?: string }).key);
-    // All keys must be unique even with duplicate categories
-    expect(new Set(keys).size).toBe(keys.length);
-  });
-
-  it('stamps keys on grouped columns', () => {
-    const spec: ChartSpec = {
-      mark: 'bar',
-      data: [
-        { category: 'Q1', series: 'Revenue', value: 100 },
-        { category: 'Q1', series: 'Cost', value: 60 },
-        { category: 'Q2', series: 'Revenue', value: 150 },
-        { category: 'Q2', series: 'Cost', value: 90 },
-      ],
-      encoding: {
-        x: { field: 'category', type: 'nominal' },
-        y: { field: 'value', type: 'quantitative' },
-        color: { field: 'series', type: 'nominal' },
-      },
-    };
-    const layout = compileChart(spec, dims);
-    const rects = layout.marks.filter((m) => m.type === 'rect');
-    expect(rects.length).toBeGreaterThanOrEqual(4);
-
-    const keys = rects.map((m) => (m as { key?: string }).key);
-    for (const k of keys) {
-      expect(k).toBeDefined();
-    }
-    expect(new Set(keys).size).toBe(keys.length);
-  });
-});
-
-// ---------------------------------------------------------------------------
-// Bar chart keys
-// ---------------------------------------------------------------------------
-
-describe('bar chart mark keys', () => {
-  it('stamps unique keys on horizontal bar marks', () => {
-    const spec: ChartSpec = {
-      mark: 'bar',
-      data: [
-        { name: 'Alpha', value: 10 },
-        { name: 'Beta', value: 30 },
-        { name: 'Gamma', value: 20 },
-      ],
-      encoding: {
-        x: { field: 'value', type: 'quantitative' },
-        y: { field: 'name', type: 'nominal' },
-      },
-    };
-    const layout = compileChart(spec, dims);
-    const rects = layout.marks.filter((m) => m.type === 'rect');
-    const keys = rects.map((m) => (m as { key?: string }).key);
-    for (const k of keys) {
-      expect(k).toBeDefined();
-    }
-    expect(new Set(keys).size).toBe(keys.length);
-  });
-});
-
-// ---------------------------------------------------------------------------
-// Line chart keys
-// ---------------------------------------------------------------------------
-
-describe('line chart mark keys', () => {
-  it('stamps key on line marks for multi-series', () => {
-    const spec: ChartSpec = {
-      mark: 'line',
-      data: [
-        { date: '2020-01-01', value: 10, country: 'US' },
-        { date: '2021-01-01', value: 40, country: 'US' },
-        { date: '2020-01-01', value: 15, country: 'UK' },
-        { date: '2021-01-01', value: 35, country: 'UK' },
-      ],
-      encoding: {
-        x: { field: 'date', type: 'temporal' },
-        y: { field: 'value', type: 'quantitative' },
-        color: { field: 'country', type: 'nominal' },
-      },
-    };
-    const layout = compileChart(spec, dims);
-    const lines = layout.marks.filter((m) => m.type === 'line');
-    expect(lines.length).toBe(2);
-
-    const keys = lines.map((m) => (m as { key?: string }).key);
-    for (const k of keys) {
-      expect(k).toBeDefined();
-    }
-    expect(new Set(keys).size).toBe(2);
-  });
-
-  it('stamps pointKeys on line marks with temporal x', () => {
-    const spec: ChartSpec = {
-      mark: 'line',
-      data: [
-        { date: '2020-01-01', value: 10 },
-        { date: '2021-01-01', value: 40 },
-        { date: '2022-01-01', value: 25 },
-      ],
-      encoding: {
-        x: { field: 'date', type: 'temporal' },
-        y: { field: 'value', type: 'quantitative' },
-      },
-    };
-    const layout = compileChart(spec, dims);
-    const lines = layout.marks.filter((m) => m.type === 'line');
-    expect(lines.length).toBe(1);
-
-    const line = lines[0] as { pointKeys?: string[] };
-    expect(line.pointKeys).toBeDefined();
-    expect(line.pointKeys!.length).toBe(3);
-
-    // Each point key should be a unique, defined string
-    for (const pk of line.pointKeys!) {
-      expect(pk).toBeDefined();
-      expect(typeof pk).toBe('string');
-    }
-    expect(new Set(line.pointKeys!).size).toBe(3);
-  });
-});
-
-// ---------------------------------------------------------------------------
-// Scatter chart keys
-// ---------------------------------------------------------------------------
-
-describe('scatter chart mark keys', () => {
-  it('stamps keys on scatter point marks', () => {
-    const spec: ChartSpec = {
-      mark: 'point',
-      data: [
-        { x: 10, y: 20, label: 'A' },
-        { x: 30, y: 40, label: 'B' },
-        { x: 50, y: 60, label: 'C' },
-      ],
-      encoding: {
-        x: { field: 'x', type: 'quantitative' },
-        y: { field: 'y', type: 'quantitative' },
-      },
-    };
-    const layout = compileChart(spec, dims);
-    const points = layout.marks.filter((m) => m.type === 'point');
-    expect(points.length).toBe(3);
-
-    const keys = points.map((m) => (m as { key?: string }).key);
-    for (const k of keys) {
-      expect(k).toBeDefined();
-    }
-    expect(new Set(keys).size).toBe(3);
-  });
-
-  it('uses encoding.key field when specified', () => {
-    const spec: ChartSpec = {
-      mark: 'point',
-      data: [
-        { x: 10, y: 20, id: 'item-1' },
-        { x: 30, y: 40, id: 'item-2' },
-        { x: 50, y: 60, id: 'item-3' },
-      ],
-      encoding: {
-        x: { field: 'x', type: 'quantitative' },
-        y: { field: 'y', type: 'quantitative' },
-        key: { field: 'id' },
-      },
-    };
-    const layout = compileChart(spec, dims);
-    const points = layout.marks.filter((m) => m.type === 'point');
-    const keys = points.map((m) => (m as { key?: string }).key);
-
-    expect(keys).toContain('item-1');
-    expect(keys).toContain('item-2');
-    expect(keys).toContain('item-3');
-  });
-});
-
-// ---------------------------------------------------------------------------
-// Pie chart keys
-// ---------------------------------------------------------------------------
-
-describe('pie chart mark keys', () => {
-  it('stamps keys on arc marks', () => {
-    const spec: ChartSpec = {
-      mark: 'arc',
-      data: [
-        { category: 'Desktop', share: 60 },
-        { category: 'Mobile', share: 30 },
-        { category: 'Tablet', share: 10 },
-      ],
-      encoding: {
-        y: { field: 'share', type: 'quantitative' },
-        color: { field: 'category', type: 'nominal' },
-      },
-    };
-    const layout = compileChart(spec, dims);
-    const arcs = layout.marks.filter((m) => m.type === 'arc');
-    expect(arcs.length).toBe(3);
-
-    const keys = arcs.map((m) => (m as { key?: string }).key);
-    for (const k of keys) {
-      expect(k).toBeDefined();
-    }
-    expect(new Set(keys).size).toBe(3);
-  });
-});
-
-// ---------------------------------------------------------------------------
-// Area chart keys
-// ---------------------------------------------------------------------------
-
-describe('area chart mark keys', () => {
-  it('stamps key on area marks', () => {
-    const spec: ChartSpec = {
-      mark: 'area',
-      data: [
-        { date: '2020-01-01', value: 10, series: 'A' },
-        { date: '2021-01-01', value: 40, series: 'A' },
-        { date: '2020-01-01', value: 15, series: 'B' },
-        { date: '2021-01-01', value: 35, series: 'B' },
-      ],
-      encoding: {
-        x: { field: 'date', type: 'temporal' },
-        y: { field: 'value', type: 'quantitative' },
-        color: { field: 'series', type: 'nominal' },
-      },
-    };
-    const layout = compileChart(spec, dims);
-    const areas = layout.marks.filter((m) => m.type === 'area');
-    expect(areas.length).toBe(2);
-
-    const keys = areas.map((m) => (m as { key?: string }).key);
-    for (const k of keys) {
-      expect(k).toBeDefined();
-    }
-    expect(new Set(keys).size).toBe(2);
-  });
-});

package/src/__tests__/ranking-recipes.test.ts

@@ -1,260 +0,0 @@
-/**
- * Integration tests for the slope + bump chart recipes (plan 14).
- *
- * These are the exact specs published on docs/ranking-and-change.md and
- * pinned as visual fixtures in examples/src/testing/fixtures-ranking.stories.tsx.
- * They use only public spec surface: if a test here needs a private flag to
- * pass, the recipe is broken.
- */
-
-import type { ChartSpec, LineMark, PointMark } from '@opendata-ai/openchart-core';
-import { describe, expect, it } from 'vitest';
-
-import { compileChart } from '../compile';
-
-// ---------------------------------------------------------------------------
-// Recipe specs (keep byte-identical to docs/ranking-and-change.md)
-// ---------------------------------------------------------------------------
-
-const slopeMarketShareSpec: ChartSpec = {
-  mark: 'line',
-  data: [
-    { year: '2019', brand: 'Samsung', share: 0.216 },
-    { year: '2024', brand: 'Samsung', share: 0.19 },
-    { year: '2019', brand: 'Huawei', share: 0.176 },
-    { year: '2024', brand: 'Huawei', share: 0.043 },
-    { year: '2019', brand: 'Apple', share: 0.139 },
-    { year: '2024', brand: 'Apple', share: 0.187 },
-    { year: '2019', brand: 'Xiaomi', share: 0.092 },
-    { year: '2024', brand: 'Xiaomi', share: 0.136 },
-    { year: '2019', brand: 'Oppo', share: 0.083 },
-    { year: '2024', brand: 'Oppo', share: 0.087 },
-  ],
-  encoding: {
-    x: { field: 'year', type: 'ordinal' },
-    y: {
-      field: 'share',
-      type: 'quantitative',
-      axis: false,
-      scale: { zero: false },
-    },
-    color: { field: 'brand', type: 'nominal' },
-  },
-  endpointLabels: {
-    ends: 'both',
-    content: 'label value',
-    format: '.0%',
-  },
-  legend: { show: false },
-  chrome: {
-    title: 'Apple and Xiaomi Split What Huawei Lost',
-    subtitle: 'Share of global smartphone shipments, 2019 vs 2024',
-    source: 'Source: IDC Worldwide Quarterly Mobile Phone Tracker',
-  },
-};
-
-const bumpConstructorsSpec: ChartSpec = {
-  mark: { type: 'line', interpolate: 'monotone', point: true },
-  data: [
-    { season: '2019', team: 'Mercedes', position: 1 },
-    { season: '2020', team: 'Mercedes', position: 1 },
-    { season: '2021', team: 'Mercedes', position: 1 },
-    { season: '2022', team: 'Mercedes', position: 3 },
-    { season: '2023', team: 'Mercedes', position: 2 },
-    { season: '2024', team: 'Mercedes', position: 4 },
-    { season: '2019', team: 'Red Bull', position: 3 },
-    { season: '2020', team: 'Red Bull', position: 2 },
-    { season: '2021', team: 'Red Bull', position: 2 },
-    { season: '2022', team: 'Red Bull', position: 1 },
-    { season: '2023', team: 'Red Bull', position: 1 },
-    { season: '2024', team: 'Red Bull', position: 3 },
-    { season: '2019', team: 'Ferrari', position: 2 },
-    { season: '2020', team: 'Ferrari', position: 6 },
-    { season: '2021', team: 'Ferrari', position: 3 },
-    { season: '2022', team: 'Ferrari', position: 2 },
-    { season: '2023', team: 'Ferrari', position: 3 },
-    { season: '2024', team: 'Ferrari', position: 2 },
-    { season: '2019', team: 'McLaren', position: 4 },
-    { season: '2020', team: 'McLaren', position: 3 },
-    { season: '2021', team: 'McLaren', position: 4 },
-    { season: '2022', team: 'McLaren', position: 5 },
-    { season: '2023', team: 'McLaren', position: 4 },
-    { season: '2024', team: 'McLaren', position: 1 },
-    { season: '2019', team: 'Alpine', position: 5 },
-    { season: '2020', team: 'Alpine', position: 5 },
-    { season: '2021', team: 'Alpine', position: 5 },
-    { season: '2022', team: 'Alpine', position: 4 },
-    { season: '2023', team: 'Alpine', position: 6 },
-    { season: '2024', team: 'Alpine', position: 6 },
-  ],
-  encoding: {
-    x: { field: 'season', type: 'ordinal' },
-    y: {
-      field: 'position',
-      type: 'quantitative',
-      scale: { reverse: true, zero: false },
-      axis: { values: [1, 2, 3, 4, 5, 6], format: 'ordinal' },
-    },
-    color: { field: 'team', type: 'nominal' },
-  },
-  endpointLabels: {
-    ends: 'both',
-    content: 'label',
-    showMarker: false,
-  },
-  legend: { show: false },
-  chrome: {
-    title: 'McLaren Went From Midfield to Champions',
-    subtitle: 'Formula 1 constructors championship, final position by season',
-    source: 'Source: FIA official standings',
-  },
-};
-
-// ---------------------------------------------------------------------------
-// Slope recipe
-// ---------------------------------------------------------------------------
-
-describe('slope chart recipe', () => {
-  it('renders both-end labels for all five series', () => {
-    const layout = compileChart(slopeMarketShareSpec, { width: 640, height: 420 });
-
-    expect(layout.endpointLabels?.entries).toHaveLength(5);
-    expect(layout.endpointLabels?.leading).toHaveLength(5);
-  });
-
-  it("composes 'name value' on one line at both ends", () => {
-    const layout = compileChart(slopeMarketShareSpec, { width: 640, height: 420 });
-
-    const left = layout.endpointLabels!.leading!.find((e) => e.seriesKey === 'Samsung');
-    expect(left!.labelLines[0]).toBe('Samsung 22%');
-    expect(left!.value).toBe('');
-
-    const right = layout.endpointLabels!.entries.find((e) => e.seriesKey === 'Samsung');
-    expect(right!.labelLines[0]).toBe('Samsung 19%');
-    expect(right!.value).toBe('');
-  });
-
-  it('renders no y axis and no gridlines', () => {
-    const layout = compileChart(slopeMarketShareSpec, { width: 640, height: 420 });
-
-    expect(layout.axes.y).toBeUndefined();
-  });
-
-  it('orders labels by value at each end (Huawei falls from 2nd to last)', () => {
-    const layout = compileChart(slopeMarketShareSpec, { width: 640, height: 420 });
-
-    const byY = (a: { labelY: number }, b: { labelY: number }) => a.labelY - b.labelY;
-    const leftOrder = [...layout.endpointLabels!.leading!].sort(byY).map((e) => e.seriesKey);
-    expect(leftOrder).toEqual(['Samsung', 'Huawei', 'Apple', 'Xiaomi', 'Oppo']);
-
-    const rightOrder = [...layout.endpointLabels!.entries].sort(byY).map((e) => e.seriesKey);
-    expect(rightOrder).toEqual(['Samsung', 'Apple', 'Xiaomi', 'Oppo', 'Huawei']);
-  });
-
-  it('keeps both-end labels and a positive plot area at 320px (compact breakpoint)', () => {
-    const layout = compileChart(slopeMarketShareSpec, { width: 320, height: 360 });
-
-    expect(layout.endpointLabels?.entries).toHaveLength(5);
-    expect(layout.endpointLabels?.leading).toHaveLength(5);
-    expect(layout.area.width).toBeGreaterThan(0);
-    // Both label columns fit inside the 320px canvas.
-    expect(layout.endpointLabels!.leadingBounds!.x).toBeGreaterThanOrEqual(0);
-    expect(
-      layout.endpointLabels!.bounds.x + layout.endpointLabels!.bounds.width,
-    ).toBeLessThanOrEqual(320);
-  });
-});
-
-// ---------------------------------------------------------------------------
-// Bump recipe
-// ---------------------------------------------------------------------------
-
-describe('bump chart recipe', () => {
-  it('puts rank 1 at the top via scale.reverse', () => {
-    const layout = compileChart(bumpConstructorsSpec, { width: 640, height: 460 });
-
-    const ticks = layout.axes.y!.ticks;
-    const first = ticks.find((t) => t.value === 1);
-    const last = ticks.find((t) => t.value === 6);
-    expect(first).toBeDefined();
-    expect(last).toBeDefined();
-    expect(first!.position).toBeLessThan(last!.position);
-  });
-
-  it('labels rank ticks as ordinals, 1st through 6th top to bottom', () => {
-    const layout = compileChart(bumpConstructorsSpec, { width: 640, height: 460 });
-
-    const labels = [...layout.axes.y!.ticks]
-      .sort((a, b) => a.position - b.position)
-      .map((t) => t.label);
-    expect(labels).toEqual(['1st', '2nd', '3rd', '4th', '5th', '6th']);
-  });
-
-  it('draws a point marker at every step of every series', () => {
-    const layout = compileChart(bumpConstructorsSpec, { width: 640, height: 460 });
-
-    const points = layout.marks.filter(
-      (m): m is PointMark => m.type === 'point' && m.opacity !== 0,
-    );
-    // 5 teams x 6 seasons.
-    expect(points).toHaveLength(30);
-  });
-
-  it('orders both-end name labels by rank at each end', () => {
-    const layout = compileChart(bumpConstructorsSpec, { width: 640, height: 460 });
-
-    const byY = (a: { labelY: number }, b: { labelY: number }) => a.labelY - b.labelY;
-    // 2019: Mercedes 1st, Ferrari 2nd, Red Bull 3rd, McLaren 4th, Alpine 5th.
-    const leftOrder = [...layout.endpointLabels!.leading!].sort(byY).map((e) => e.seriesKey);
-    expect(leftOrder).toEqual(['Mercedes', 'Ferrari', 'Red Bull', 'McLaren', 'Alpine']);
-    // 2024: McLaren 1st, Ferrari 2nd, Red Bull 3rd, Mercedes 4th, Alpine 6th.
-    const rightOrder = [...layout.endpointLabels!.entries].sort(byY).map((e) => e.seriesKey);
-    expect(rightOrder).toEqual(['McLaren', 'Ferrari', 'Red Bull', 'Mercedes', 'Alpine']);
-  });
-
-  it('renders name-only labels (no value line)', () => {
-    const layout = compileChart(bumpConstructorsSpec, { width: 640, height: 460 });
-
-    for (const entry of layout.endpointLabels!.entries) {
-      expect(entry.labelLines).toEqual([entry.seriesKey]);
-      expect(entry.value).toBe('');
-    }
-  });
-
-  it('maps tied ranks to the same y (ties share a row)', () => {
-    const tieSpec: ChartSpec = {
-      ...bumpConstructorsSpec,
-      data: [
-        { season: '2023', team: 'A', position: 1 },
-        { season: '2024', team: 'A', position: 2 },
-        { season: '2023', team: 'B', position: 2 },
-        { season: '2024', team: 'B', position: 2 },
-        { season: '2023', team: 'C', position: 3 },
-        { season: '2024', team: 'C', position: 1 },
-      ],
-      encoding: {
-        ...bumpConstructorsSpec.encoding,
-        y: {
-          field: 'position',
-          type: 'quantitative',
-          scale: { reverse: true, zero: false },
-          axis: { values: [1, 2, 3], format: 'ordinal' },
-        },
-      },
-    };
-    const layout = compileChart(tieSpec, { width: 640, height: 400 });
-
-    const lines = layout.marks.filter(
-      (m): m is LineMark => m.type === 'line' && m.seriesKey != null,
-    );
-    const lastY = (key: string) => {
-      const mark = lines.find((m) => m.seriesKey === key)!;
-      const pts = mark.dataPoints ?? [];
-      return pts[pts.length - 1]!.y;
-    };
-    // A and B tie for 2nd in 2024: identical y.
-    expect(lastY('A')).toBeCloseTo(lastY('B'), 6);
-    // C is 1st, above the tied pair (smaller y = higher rank).
-    expect(lastY('C')).toBeLessThan(lastY('A'));
-  });
-});

package/src/__tests__/rotation.test.ts

@@ -1,83 +0,0 @@
-import { describe, expect, it } from 'vitest';
-import { bandLabelStride, resolveBandTickAngle } from '../layout/axes/rotation';
-
-// Geometry cheat sheet at the default 11px tick font:
-// - ribbon thickness = 11 * 1.2 + 4 = 17.2px (perpendicular room one label needs)
-// - at -45°, ribbon separation = spacing * 0.707, so the -45 → -90 flip sits
-//   near spacing ≈ 24.3px
-// - at -90°, separation = spacing, so the stride safety net starts below
-//   spacing ≈ 17.2px
-
-describe('resolveBandTickAngle', () => {
-  it('returns the explicit angle untouched', () => {
-    expect(resolveBandTickAngle(-30, 100, 20, 5, 50, 11)).toBe(-30);
-    expect(resolveBandTickAngle(0, 100, 20, 5, 50, 11)).toBe(0);
-  });
-
-  it('never rotates a single label', () => {
-    expect(resolveBandTickAngle(undefined, 100, 20, 1, 50, 11)).toBeUndefined();
-  });
-
-  it('stays flat when the widest label fits its band', () => {
-    expect(resolveBandTickAngle(undefined, 17, 20, 5, 30, 11)).toBeUndefined();
-  });
-
-  it('picks -45 when diagonal ribbons clear one line height', () => {
-    // separation = 25 * sin45 ≈ 17.7 >= 17.2
-    expect(resolveBandTickAngle(undefined, 40, 20, 5, 25, 11)).toBe(-45);
-  });
-
-  it('escalates to -90 when diagonal ribbons would touch', () => {
-    // separation = 24 * sin45 ≈ 17.0 < 17.2, and 24px along-text clearance
-    // cannot fit a 40px label; vertical separation 24 >= 17.2 fits.
-    expect(resolveBandTickAngle(undefined, 40, 20, 5, 24, 11)).toBe(-90);
-  });
-
-  it('keeps -45 for short labels that clear end-to-end along the text direction', () => {
-    // Ribbons touch (24 * sin45 < 17.2) but a 10px label clears via the
-    // 17px along-text offset — finite segments slide past each other.
-    expect(resolveBandTickAngle(undefined, 10, 8, 5, 24, 11)).toBe(-45);
-  });
-
-  it('refuses -90 for labels longer than the rotated-extent cap', () => {
-    // A 150px label projected vertically exceeds the 120px reservation cap
-    // and would clip into the source line; stay at -45 and let the stride
-    // safety net thin instead.
-    expect(resolveBandTickAngle(undefined, 150, 20, 5, 20, 11)).toBe(-45);
-  });
-});
-
-describe('bandLabelStride', () => {
-  it('returns 1 for degenerate spacing', () => {
-    expect(bandLabelStride(50, -45, 11, 0)).toBe(1);
-    expect(bandLabelStride(50, -45, 11, -5)).toBe(1);
-  });
-
-  it('drives the flat stride by label width', () => {
-    // (50 + 4) / 20 → every 3rd label
-    expect(bandLabelStride(50, undefined, 11, 20)).toBe(3);
-    expect(bandLabelStride(10, undefined, 11, 20)).toBe(1);
-  });
-
-  it('keeps every label when vertical separation fits', () => {
-    expect(bandLabelStride(50, -90, 11, 20)).toBe(1);
-  });
-
-  it('thins vertical labels only at tiny steps', () => {
-    // separation 7 < 17.2 → ceil(17.2 / 7) = 3
-    expect(bandLabelStride(50, -90, 11, 7)).toBe(3);
-  });
-
-  it('does not thin a shallow explicit angle whose labels clear end-to-end', () => {
-    // labelAngle -20 at 50px spacing: ribbon separation 17.1 barely misses
-    // one line height, but the 47px along-text offset clears a 30px label.
-    // The old span model dropped every other label here.
-    expect(bandLabelStride(30, -20, 11, 50)).toBe(1);
-  });
-
-  it('thins a shallow explicit angle when labels overlap by both routes', () => {
-    // labelAngle -20 at 30px spacing with 60px labels: separation 10.3 needs
-    // stride 2, along-text clearance 28.2 needs stride 3 → ribbons win.
-    expect(bandLabelStride(60, -20, 11, 30)).toBe(2);
-  });
-});