"""367-5 종단 판 접은 뒤 횡단 카드 누름 — 실제 브라우저(서버 없이 · 진짜 CSS).

B06 꼴(가운데 카드 칸 + 아래 종단 판)을 진짜 CSS 로 세우고 판을 펼쳤다 접은 **바로 뒤**
카드 자리 elementFromPoint = 카드. 높이 transition 이 있으면 그 순간 판이 아직 펼친 높이라
종단 판(`b05-route-profile__*`)이 누름을 받음(그려지지 않는 탭에선 전환이 시작도 안 해 그대로 멈춤).
"""

from pathlib import Path

ROOT = Path(__file__).resolve().parents[2]
CSS = [
    "ui_template/ui_template_theme.css",
    "A00_Common/design/design_page.css",
    "B05_Profile/B05_Profile_UI_Style.css",
    "B05_Profile/B05_Profile_UI_Style_MassHaul.css",
    "B06_Section/B06_Section_UI_Style_Cross.css",
]
HTML = """
<div class="design-page__main" data-view="cross" style="height:900px">
  <div class="design-page__center"><div class="design-page__view">
    <div class="b06-section"><div class="b06-section__cards">
      <div class="b06-cross-card" style="height:2000px"></div>
    </div></div>
  </div></div>
  <div class="design-page__profile">
    <section class="b05-route-profile" style="--b05-profile-height:600px">
      <div class="b05-route-profile__content">
        <div class="b05-route-profile__body-wrap"><div class="b05-route-profile__body"></div></div>
      </div>
    </section>
  </div>
</div>
"""
HIT = "document.elementFromPoint(400, 700).className"


def test_fold_releases_card_area_at_once():
    from playwright.sync_api import sync_playwright

    css = "\n".join((ROOT / p).read_text(encoding="utf-8") for p in CSS)
    with sync_playwright() as p:
        browser = p.chromium.launch(channel="msedge", headless=True)
        page = browser.new_page(viewport={"width": 1000, "height": 900})
        page.set_content(f"<style>body{{margin:0}}{css}</style>{HTML}")
        # 펼침 = 판이 카드 자리 아래쪽 600px 차지
        assert page.evaluate(HIT).startswith("b05-route-profile")
        # 접은 같은 순간 — 카드가 받음
        hit = page.evaluate(
            "(() => { document.querySelector('.b05-route-profile').classList.add('is-collapsed');"
            f" return {HIT}; }})()"
        )
        assert hit == "b06-cross-card"
        # 다시 펼침도 같은 순간 판이 받음(어느 쪽도 전환을 기다리지 않음)
        hit = page.evaluate(
            "(() => { document.querySelector('.b05-route-profile').classList.remove('is-collapsed');"
            f" return {HIT}; }})()"
        )
        assert hit.startswith("b05-route-profile")
        browser.close()


def test_profile_has_no_height_transition():
    css = (ROOT / "B05_Profile/B05_Profile_UI_Style.css").read_text(encoding="utf-8")
    assert "transition: height" not in css