"""181-1 B09 탭 두 층 — 위 탭 10 · 아래 탭 묶음(사용자 30번) · 줄 그리기 · 마지막 본 아래 탭.

- 위 탭 = `TAB_GROUPS`(`TABS` 19 키를 빠짐 · 겹침 없이 묶음) · `TABS`(엑셀 차례)는 그대로
- 줄 = 위 md · 아래 sm · 아래 탭 없는 위 탭 = 빈 보조 줄(B08 꼴)
"""

import json
import sys
from pathlib import Path

ROOT = Path(__file__).resolve().parents[2]
if str(ROOT) not in sys.path:
    sys.path.insert(0, str(ROOT))

from resources.tester.helper_b09_group_cards import TABS, run  # noqa: E402

BAR = "B09_Estimation/B09_Estimation_UI_TabBar.ts"

# 사용자 30번 — 위 탭 차례 = 지금 탭 차례(묶음 첫 자리) · 아래 = 글에 적힌 차례
EXPECTED = [
    ["연결 점검", ["check"]],
    ["공사원가계산서", ["cost"]],
    ["총괄설계내역서", ["total"]],
    ["설계내역서", ["bill"]],
    ["일위대가", ["dg_list", "dg"]],
    ["단가산출", ["sg_list", "sg"]],
    ["환율및기초자료", ["basis"]],
    ["중기", ["machine", "machine_blocks", "sum_machine", "expense", "sum_expense"]],
    ["재료", ["material", "compare", "sum_material"]],
    ["노무", ["labor", "sum_labor"]],
]


def test_묶음_표_사용자_30번과_같고_19_탭이_한_번씩():
    out = run(
        [TABS],
        "\nconsole.log(JSON.stringify({ groups: TAB_GROUPS, ids: TABS.map(([t]) => t),"
        " of: TABS.map(([t]) => groupOf(t)[0]) }));",
    )
    assert out["groups"] == EXPECTED
    flat = [t for _, tabs in out["groups"] for t in tabs]
    assert sorted(flat) == sorted(out["ids"]) and len(flat) == len(set(flat)) == 19
    # 위 탭 차례 = 엑셀 차례에서 묶음이 처음 나오는 자리
    firsts = list(dict.fromkeys(out["of"]))
    assert firsts == [g[0] for g in EXPECTED]
    assert len(firsts) == 10


def test_줄_그리기_두_층_빈_줄_마지막_본_아래_탭():
    out = run(
        [TABS, BAR],
        """
const picks = [];
const bars = createTabBars((t) => picks.push(t));
const view = () => ({
  top: bars.top.children.map((b) => [b.textContent, b.className, b.attrs['aria-selected'],
    b.dataset.b09Group, b.dataset.b09Tab ?? null]),
  sub: bars.sub.children.map((b) => [b.textContent, b.attrs['aria-selected'], b.dataset.b09Tab ?? null]),
  blank: bars.sub.classList.contains('b09-estimation__tabs--blank'),
  role: bars.sub.attrs.role,
});
bars.draw('dg');
const a = view();
bars.top.children[4].click();            // 켜진 위 탭 다시 누름 = 아무 일 없음
bars.sub.children[0].click();            // 일위대가목록표
bars.draw('compare');                    // 묶음을 넘는 이동 = 위 탭 따라 켜짐
const b = view();
bars.draw('sum_material');
bars.draw('dg');
bars.top.children[8].click();            // 재료 = 마지막 본 아래 탭(재료비수량금액집계표)
bars.top.children[7].click();            // 중기 = 본 적 없음 → 첫 아래 탭
bars.draw('cost');
const c = view();
bars.top.children[0].click();            // 연결 점검 = 단독 위 탭
bars.sub.children[0].click();            // 빈 줄 단추(숨김) = 누름 없음
console.log(JSON.stringify({ a, b, c, picks }));
""",
    )
    a, b, c = out["a"], out["b"], out["c"]
    assert len(a["top"]) == 10 and [t[0] for t in a["top"]][:5] == [
        "연결 점검", "공사원가계산서", "총괄설계내역서", "설계내역서", "일위대가"
    ]  # fmt: skip
    assert [t[2] for t in a["top"]] == ["false"] * 4 + ["true"] + ["false"] * 5
    assert all("ui-btn--ghost" in t[1] for t in a["top"] if t[2] == "false")
    assert a["sub"] == [["일위대가목록표", "false", "dg_list"], ["일위대가표", "true", "dg"]]
    assert not a["blank"] and a["role"] == "tablist"
    assert b["sub"] == [
        ["재료비목록표", "false", "material"],
        ["자재단가대비표", "true", "compare"],
        ["재료비수량금액집계표", "false", "sum_material"],
    ]  # fmt: skip
    assert b["top"][8][2] == "true" and b["top"][4][2] == "false"
    # 단독 위 탭 — 위 단추가 탭 키도 가짐 · 아래 줄 = 숨긴 단추 한 개
    assert c["blank"] and c["role"] == "presentation" and len(c["sub"]) == 1
    assert c["top"][1][3] == "cost" and c["top"][1][4] == "cost" and c["top"][4][4] is None
    assert out["picks"] == ["dg_list", "sum_material", "machine", "check"]


def test_잇기_쉘이_두_줄을_쓰고_CSS_빈_줄_규칙():
    shell = (ROOT / "B09_Estimation" / "B09_Estimation_UI_Shell.ts").read_text("utf-8")
    assert "createTabBars((tab) => show(tab))" in shell and "bars.draw(tab);" in shell
    assert "body.append(bars.top, bars.sub, panel);" in shell
    css = (ROOT / "B09_Estimation" / "B09_Estimation_UI_Page.css").read_text("utf-8")
    assert ".b09-estimation__tabs--blank > .ui-btn" in css and "visibility: hidden" in css