docs: add market csv and layout design notes

2026-04-23 14:37:14 +08:00
parent 233de28713
commit 24e8a3ba9a
4 changed files with 238 additions and 0 deletions
@@ -0,0 +1,61 @@
+# Market Scrollable Plugin Columns Implementation Plan
+
+> **For agentic workers:** REQUIRED SUB-SKILL: Use superpowers:subagent-driven-development (recommended) or superpowers:executing-plans to implement this plan task-by-task. Steps use checkbox (`- [ ]`) syntax for tracking.
+
+**Goal:** Move plugin-generated market columns out of the right sticky area and into the horizontally scrollable middle area.
+
+**Architecture:** Keep Xingtu's native left and right sticky sections intact. Add a dedicated non-sticky plugin section for the injected columns and continue rendering row state through the existing `MarketRowDom` abstraction.
+
+**Tech Stack:** TypeScript, Vitest, jsdom
+
+---
+
+### Task 1: Lock The Intended Layout In Tests
+
+**Files:**
+- Modify: `tests/market-dom-sync.test.ts`
+- Modify: `tests/market-content-entry.test.ts`
+
+- [ ] **Step 1: Write failing tests for the layout boundary**
+
+Add assertions that:
+- the right sticky header/body widths remain native after plugin columns are added
+- plugin columns live in a dedicated non-sticky section instead of the right sticky section
+
+- [ ] **Step 2: Run tests to verify they fail**
+
+Run: `npm test -- tests/market-dom-sync.test.ts tests/market-content-entry.test.ts`
+
+- [ ] **Step 3: Implement the minimal layout changes**
+
+Update the div-grid sync path so plugin columns are inserted into a separate scrollable section.
+
+- [ ] **Step 4: Re-run the same tests**
+
+Run: `npm test -- tests/market-dom-sync.test.ts tests/market-content-entry.test.ts`
+
+- [ ] **Step 5: Commit**
+
+```bash
+git add tests/market-dom-sync.test.ts tests/market-content-entry.test.ts src/content/market/dom-sync.ts
+git commit -m "feat: move market plugin columns into scrollable section"
+```
+
+### Task 2: Verify No Export Regression
+
+**Files:**
+- Verify only: `src/content/market/index.ts`
+- Verify only: `src/content/market/export-range-controller.ts`
+- Verify only: `tests/full-scan-controller.test.ts`
+
+- [ ] **Step 1: Run export-related regression tests**
+
+Run: `npm test -- tests/full-scan-controller.test.ts`
+
+- [ ] **Step 2: Run build**
+
+Run: `npm run build`
+
+- [ ] **Step 3: Report any unrelated failures separately**
+
+Do not broaden the scope unless a new failure is caused by the layout change.