summaryrefslogtreecommitdiff
path: root/frontend/src/test-setup.ts
diff options
context:
space:
mode:
authorSomhairle H. Marisol <[email protected]>2026-09-18 08:26:47 +0800
committerSomhairle H. Marisol <[email protected]>2026-09-18 08:26:47 +0800
commit33cac3eef7d9962d8803cd812553549d6f555516 (patch)
tree77c4686a6aebc790814abc110291fb873b1d96f7 /frontend/src/test-setup.ts
parent60640dfa981e419cf86413c924fd26822bd42327 (diff)
downloadstrategy-lab-33cac3eef7d9962d8803cd812553549d6f555516.tar.gz
feat(frontend): 图表层从 echarts 迁移 layerchart(新长格式 Chart API)
[变更性质] 图表渲染引擎替换,渲染输出保持同等信息(曲线/图例/轴),删除 echarts 在后续页面迁移后正式退场。 [新增功能] 新 Chart.svelte 封装 layerchart LineChart,API 为长格式 data( {i, date, ...columns})+ series(key/label/value/color/dashed/area)。 [实现方案] 宽度语义与旧 echarts 包装一致:ResizeObserver 实测宿主宽度优先, width prop 只是初始/测试尺寸,640 为无布局回退——SVG 永远跟随宿主, 绝不粘滞桌面宽度。runes 模式的关键坑:measured 必须 $state,否则 RO 回调触发的宽度更新不会重渲染(旧 echarts 版本为命令式 API 无此问题)。 chartResize.test.ts 以 layerchart 真渲染重写 4 个合同用例:jsdom 真实 SVG、width prop 跨视口变更、无重挂载的 in-place RO 收缩、零布局宿主 RO 回调不抛错。test-setup.ts 增加 window.matchMedia shim(layerchart settings 上下文需要)并移除因此失效的 @ts-expect-error。 [影响范围] 回测结果/对比曲线等消费方在后续页面提交中切换到本 API;svelte-check 对 layerchart 复杂泛型以 as never 收口,0 error。
Diffstat (limited to 'frontend/src/test-setup.ts')
-rw-r--r--frontend/src/test-setup.ts16
1 files changed, 16 insertions, 0 deletions
diff --git a/frontend/src/test-setup.ts b/frontend/src/test-setup.ts
index cdd6071..10f9568 100644
--- a/frontend/src/test-setup.ts
+++ b/frontend/src/test-setup.ts
@@ -1,4 +1,20 @@
+// layerchart reads window.matchMedia (settings context, dark-mode aware
+// styling) in jsdom where no backend exists. Narrow shim for media queries
+// used by chart settings only.
+if (typeof window !== 'undefined' && !window.matchMedia) {
+ window.matchMedia = (query: string) => ({
+ matches: false,
+ media: query,
+ onchange: null,
+ addEventListener: () => {},
+ removeEventListener: () => {},
+ addListener: () => {},
+ removeListener: () => {},
+ dispatchEvent: () => false
+ });
+}
+
// jsdom does not implement Range.getClientRects, which CodeMirror's
// measurement layer calls for drawing decorations (diagnostics markers).
// Without it the suite emits an unhandled