eomsangdonandClaude Opus 5.5
d70b66f57e
- 등록 모달 [+ 줄] · 같은 이름 합침 없앰 · 기준위치 = 항목 · 목적지 없음 · 「고침」 → 「수정」 - 다이어그램 · 표 폭 전체 · 틀 높이 고정 · 틀 비율 그림 범위 · 처음 배율 = 상자 범위 맞춤 - 카카오 지도 높이 어디서나 480px - 도로 구분 = 선 자리(거래처 → 기준점 2차포장 · 기준점 → 시점 1차포장 · 그 밖 포장 · 비포장만 고름) · 파이썬 · TS 짝 Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01LLCk2y5xE8YGVgjbTntWsY
88 lines
3.8 KiB
Python
88 lines
3.8 KiB
Python
"""244-8 B08 거리이정표 다이어그램 영역 스크롤 없앰(사용자 135번).
|
|
|
|
틀 = overflow hidden · 그림 = 틀 안 맞춤(높이 48vh 넘으면 좁힘) · 휠 = 줌만.
|
|
휠은 공용 `A00_Common/b_svg_zoom_pan.ts` 와 다이어그램 틀 듣개를 node 로 돌려
|
|
진짜 wheel 사건(cancelable)을 보내 기본동작(스크롤)이 막히는지 · 배율이 바뀌는지 잼.
|
|
"""
|
|
|
|
import json
|
|
import re
|
|
import subprocess
|
|
from pathlib import Path
|
|
|
|
ROOT = Path(__file__).resolve().parents[2]
|
|
IMPORTS = re.compile(r"^import[^;]*;\n", re.MULTILINE)
|
|
DIAGRAM = "B08_Quantity/B08_Quantity_UI_Milestone_Diagram.ts"
|
|
|
|
|
|
def _read(rel):
|
|
return (ROOT / rel).read_text(encoding="utf-8")
|
|
|
|
|
|
def _node(script):
|
|
src = IMPORTS.sub("", _read("A00_Common/b_svg_zoom_pan.ts"))
|
|
result = subprocess.run(
|
|
["node", "--experimental-strip-types", "--no-warnings",
|
|
"--input-type=module-typescript", "-e", src + "\n" + script],
|
|
capture_output=True, text=True, encoding="utf-8", timeout=60,
|
|
) # fmt: skip
|
|
assert result.returncode == 0, result.stderr
|
|
return json.loads(result.stdout)
|
|
|
|
|
|
def test_틀_스크롤_없음_그림_맞춤():
|
|
css = _read("B08_Quantity/B08_Quantity_UI_Milestone.css")
|
|
block = css[css.index("\n.b08-milestone__diagram {") :]
|
|
block = block[: block.index("}")]
|
|
assert "overflow: hidden;" in block and "overflow: auto" not in block
|
|
assert "max-height" not in block # 높이는 그림이 맞춤 — 틀이 자르지 않음
|
|
ui = _read(DIAGRAM)
|
|
# 149 틀 = 폭 전체 · 높이 고정(CSS) · 그림 범위를 틀 비율로 넓힘(화면 px ↔ 그림 좌표 가로세로 같음)
|
|
assert "const scale = Math.max(lw / fw, lh / fh);" in ui
|
|
assert "height: clamp(420px, 58vh, 760px);" in _read(
|
|
"B08_Quantity/B08_Quantity_UI_Milestone.css"
|
|
)
|
|
|
|
|
|
def test_휠_진짜_사건_줌_스크롤_막음():
|
|
ui = _read(DIAGRAM)
|
|
line = next(ln.strip() for ln in ui.splitlines() if 'host.addEventListener("wheel"' in ln)
|
|
got = _node(
|
|
"""
|
|
const W = 600, H = 400;
|
|
class Svg extends EventTarget {
|
|
classList = { add() {}, remove() {} };
|
|
getBoundingClientRect() { return { left: 0, top: 0, width: W, height: H }; }
|
|
}
|
|
function wheel(target: EventTarget, deltaY: number) {
|
|
const ev = new Event("wheel", { cancelable: true, bubbles: true });
|
|
for (const [k, v] of Object.entries({ deltaY, clientX: 300, clientY: 200 }))
|
|
Object.defineProperty(ev, k, { value: v });
|
|
target.dispatchEvent(ev);
|
|
return ev.defaultPrevented;
|
|
}
|
|
const svg = new Svg();
|
|
const layer = { t: "", setAttribute(_k: string, v: string) { this.t = v; } };
|
|
attachSvgZoomPan({ svg: svg as any, layer: layer as any, widthPx: W, heightPx: H,
|
|
pad: { left: 0, right: 0, top: 0, bottom: 0 }, wheelZoom: true });
|
|
const svgIn = wheel(svg, 100);
|
|
const zoomIn = layer.t;
|
|
const svgOut = wheel(svg, -100);
|
|
const zoomOut = layer.t;
|
|
// 틀 듣개(그림 밖 여백 · 단추 줄) — 소스 줄 그대로 돌림 · passive 면 preventDefault 무시됨
|
|
const host = new EventTarget();
|
|
let opts: unknown = null;
|
|
const add = host.addEventListener.bind(host);
|
|
host.addEventListener = (t: string, f: any, o: any) => { opts = o; add(t, f, o); };
|
|
LINE
|
|
const hostBlocked = wheel(host, 100);
|
|
console.log(JSON.stringify({ svgIn, zoomIn, svgOut, zoomOut, hostBlocked, opts }));
|
|
""".replace("LINE", line)
|
|
)
|
|
# 그림 위 휠 = 줌(커서 자리 붙잡음) · 기본동작(스크롤) 막힘 = 스크롤 위치 안 바뀜
|
|
assert got["svgIn"] is True and got["zoomIn"].endswith(" scale(1.15)")
|
|
assert got["zoomIn"].startswith("translate(-45 -29.99") # 커서(300, 200) 제자리
|
|
assert got["svgOut"] is True and got["zoomOut"] != got["zoomIn"] # 밀면 축소
|
|
# 그림 밖 틀 위 휠도 페이지 스크롤로 안 샘
|
|
assert got["hostBlocked"] is True and got["opts"] == {"passive": False}
|