'''
new = '''
'''
-[[mutation]]
-label = "C6 the next arrow's rail offset applies at phone width"
-file = "booth/templates/view.html"
-test = "tests/test_flow_browser.py::test_the_next_arrow_clears_the_rail_only_beside_it"
-old = ''' .vprev{left:0}.vnext{right:0}
- @media (min-width:901px){.vnext{right:360px}}
-'''
-new = ''' .vprev{left:0}.vnext{right:360px}
-'''
-
[[mutation]]
label = "resolver: an entry that cannot be stat'd raises out of booth_items"
file = "booth/items.py"
diff --git a/tests/mutations/r2c.toml b/tests/mutations/r2c.toml
index c98b0ef..f71857c 100644
--- a/tests/mutations/r2c.toml
+++ b/tests/mutations/r2c.toml
@@ -75,10 +75,10 @@ file = "booth/templates/view.html"
test = "tests/test_flow_browser.py::test_the_arrows_sit_just_outside_the_picture_and_clamp_to_the_stage"
old = '''
var p = drawn();
- if (!p) return;'''
+ if (!p) {'''
new = '''
var p = null;
- if (!p) return;'''
+ if (!p) {'''
[[mutation]]
label = "S3 the arrows track the file's natural width, not the drawn picture"
@@ -124,7 +124,7 @@ label = "S4 no drag threshold (a jittery click pans)"
file = "booth/templates/view.html"
test = "tests/test_flow_browser.py::test_in_one_to_one_a_drag_pans_and_the_picture_cannot_be_dragged_away"
old = '''
- if (Math.abs(dx) < 4 && Math.abs(dy) < 4) return;'''
+ if (dx * dx + dy * dy < 16) return; /* under 4px in all: a click */'''
new = '''
'''
@@ -152,3 +152,198 @@ old = '''
.review-body > .reveal{position:absolute;top:14px;left:14px;z-index:5;'''
new = '''
.review-body > .reveal{position:absolute;top:14px;left:14px;z-index:-1;'''
+
+# ---- the heid code-review fold ("VΓGUNDR")
+
+[[mutation]]
+label = "1:1 centres a large picture (its start side can never be scrolled to)"
+file = "booth/templates/base.html"
+test = "tests/test_flow_browser.py::test_in_one_to_one_every_pixel_of_a_large_picture_is_reachable"
+old = '''
+ .stage-one .vstage.is-img{overflow:auto;padding:0;justify-content:flex-start;align-items:flex-start}'''
+new = '''
+ .stage-one .vstage.is-img{overflow:auto;padding:0}'''
+
+[[mutation]]
+label = "a buttonless hover continues a press released outside the stage"
+file = "booth/templates/view.html"
+test = "tests/test_flow_browser.py::test_a_pan_holds_past_the_stage_edge_and_never_starts_on_a_hover"
+old = '''
+ if (!(e.buttons & 1)) { endDrag(); return; }'''
+new = '''
+'''
+
+[[mutation]]
+label = "no pointer capture (a pan dies at the stage's edge)"
+file = "booth/templates/view.html"
+test = "tests/test_flow_browser.py::test_a_pan_holds_past_the_stage_edge_and_never_starts_on_a_hover"
+old = '''
+ try { stage.setPointerCapture(drag.id); } catch (x) {}'''
+new = '''
+'''
+
+[[mutation]]
+label = "stacked, the arrows' fallback centres on stage AND rail"
+file = "booth/templates/view.html"
+test = "tests/test_flow_browser.py::test_before_placement_the_arrows_never_sit_over_the_rail_on_a_narrow_screen"
+old = '''
+ @media (max-width:900px){.vnav{top:30vh}}'''
+new = '''
+'''
+
+[[mutation]]
+label = "Fit shifts the picture off-centre (object-position), cropping it"
+file = "booth/templates/base.html"
+test = "tests/test_flow_browser.py::test_fit_fills_the_stage_up_or_down"
+old = '''
+ .vstage.is-img img{width:100%;height:100%;object-fit:contain;'''
+new = '''
+ .vstage.is-img img{width:100%;height:100%;object-fit:contain;object-position:-100px 50%;'''
+
+[[mutation]]
+label = "the arrows are not centred on the stage"
+file = "booth/templates/view.html"
+test = "tests/test_flow_browser.py::test_the_arrows_sit_just_outside_the_picture_and_clamp_to_the_stage"
+old = '''
+ a.style.top = (s.top - o.top + s.height / 2) + 'px';'''
+new = '''
+ a.style.top = (s.top - o.top + s.height / 4) + 'px';'''
+
+[[mutation]]
+label = "a booth.fit read that throws raises out of the head script"
+file = "booth/templates/base.html"
+test = "tests/test_flow_browser.py::test_the_mode_persists_across_prev_next_and_never_flashes"
+old = '''
+ try {
+ if (localStorage.getItem('booth.fit') === 'one') d.classList.add('stage-one');
+ } catch (e) {}'''
+new = '''
+ if (localStorage.getItem('booth.fit') === 'one') d.classList.add('stage-one');'''
+
+[[mutation]]
+label = "the drag threshold is per axis, not total (a 3,3 diagonal pans nothing)"
+file = "booth/templates/view.html"
+test = "tests/test_flow_browser.py::test_in_one_to_one_a_drag_pans_and_the_picture_cannot_be_dragged_away"
+old = '''
+ if (dx * dx + dy * dy < 16) return; /* under 4px in all: a click */'''
+new = '''
+ if (Math.abs(dx) < 4 && Math.abs(dy) < 4) return;'''
+
+# ---- the heid bug-hunt fold ("ΓREKJUR"). Accepted, not rowed: no `touch-action`
+# (on touch the stage scrolls natively and the pan yields on pointercancel);
+# dragstart preventDefault beside draggable=false (defence in depth, one layer
+# alone holds).
+
+[[mutation]]
+label = "the stage reveal shows with scripts off (and does nothing)"
+file = "booth/templates/view.html"
+test = "tests/test_flow_browser.py::test_the_stage_reveal_never_shows_without_js_and_keeps_the_fit_shadow"
+old = '''aria-label="reveal {{ file }}" hidden>'''
+new = '''aria-label="reveal {{ file }}">'''
+
+[[mutation]]
+label = "a revealed review picture loses Fit's shadow"
+file = "booth/templates/base.html"
+test = "tests/test_flow_browser.py::test_the_stage_reveal_never_shows_without_js_and_keeps_the_fit_shadow"
+old = '''
+ .review .vstage.is-img.is-blurred.revealed img,.reveal-all .review .vstage.is-img.is-blurred img{'''
+new = '''
+ .review .vstage.is-img.is-blurred.revealed-OFF img,.reveal-all .review .vstage.is-img.is-blurred img{'''
+
+[[mutation]]
+label = "a stage mode chosen in another tab does not reach this one"
+file = "booth/templates/view.html"
+test = "tests/test_flow_browser.py::test_a_stage_mode_chosen_in_one_tab_moves_the_others"
+old = '''
+ if (e.key !== 'booth.fit' && e.key !== null) return;'''
+new = '''
+ return;'''
+
+[[mutation]]
+label = "the drag threshold drops to 3px"
+file = "booth/templates/view.html"
+test = "tests/test_flow_browser.py::test_in_one_to_one_a_drag_pans_and_the_picture_cannot_be_dragged_away"
+old = '''
+ if (dx * dx + dy * dy < 16) return; /* under 4px in all: a click */'''
+new = '''
+ if (dx * dx + dy * dy < 9) return; /* under 4px in all: a click */'''
+
+[[mutation]]
+label = "a storage write that throws cuts the click short (buttons never update)"
+file = "booth/templates/view.html"
+test = "tests/test_flow_browser.py::test_the_mode_persists_across_prev_next_and_never_flashes"
+old = '''
+ try {
+ if (one) localStorage.setItem('booth.fit', 'one'); else localStorage.removeItem('booth.fit');
+ } catch (e) {}'''
+new = '''
+ if (one) localStorage.setItem('booth.fit', 'one'); else localStorage.removeItem('booth.fit');'''
+
+[[mutation]]
+label = "the Fit button's pressed state is never drawn"
+file = "booth/templates/view.html"
+test = "tests/test_flow_browser.py::test_the_mode_persists_across_prev_next_and_never_flashes"
+old = '''
+ bFit.setAttribute('aria-pressed', one ? 'false' : 'true');'''
+new = '''
+'''
+
+# ---- groa's retry supplement (code review)
+
+[[mutation]]
+label = "S1 Fit loses its drop shadow"
+file = "booth/templates/base.html"
+test = "tests/test_flow_browser.py::test_fit_fills_the_stage_up_or_down"
+old = '''
+ .vstage.is-img img{width:100%;height:100%;object-fit:contain;
+ filter:drop-shadow(0 10px 24px rgb(0 0 0 / .32))}'''
+new = '''
+ .vstage.is-img img{width:100%;height:100%;object-fit:contain}'''
+
+[[mutation]]
+label = "S2 the toggle hides, on load, for a picture larger than the stage"
+file = "booth/templates/view.html"
+test = "tests/test_flow_browser.py::test_the_toggle_shows_for_every_picture_and_never_without_js"
+old = '''
+ function settle() { place(); pannable(); }'''
+new = '''
+ function settle() { place(); pannable(); if (img) document.getElementById('vtoggle').hidden = img.naturalWidth > stage.clientWidth; }'''
+
+[[mutation]]
+label = "S2 choosing Fit stores a word instead of forgetting 1:1"
+file = "booth/templates/view.html"
+test = "tests/test_flow_browser.py::test_the_mode_persists_across_prev_next_and_never_flashes"
+old = '''
+ if (one) localStorage.setItem('booth.fit', 'one'); else localStorage.removeItem('booth.fit');'''
+new = '''
+ if (one) localStorage.setItem('booth.fit', 'one'); else localStorage.setItem('booth.fit', 'fit');'''
+
+[[mutation]]
+label = "S4 pan only when BOTH axes overflow"
+file = "booth/templates/view.html"
+test = "tests/test_flow_browser.py::test_a_picture_that_overflows_one_axis_pans_along_it"
+old = '''
+ (stage.scrollWidth > stage.clientWidth || stage.scrollHeight > stage.clientHeight);'''
+new = '''
+ (stage.scrollWidth > stage.clientWidth && stage.scrollHeight > stage.clientHeight);'''
+
+# ---- groa's retry supplement (bug hunt): classic scrollbars
+
+[[mutation]]
+label = "a press on the stage's scrollbar starts a pan"
+file = "booth/templates/view.html"
+test = "tests/test_flow_browser.py::test_a_classic_scrollbar_is_neither_under_an_arrow_nor_a_pan"
+old = '''
+ if (e.clientX - r.left - stage.clientLeft >= stage.clientWidth ||
+ e.clientY - r.top - stage.clientTop >= stage.clientHeight) return;'''
+new = '''
+'''
+
+[[mutation]]
+label = "the arrows clamp to the border box (the next one sits under a classic scrollbar)"
+file = "booth/templates/view.html"
+test = "tests/test_flow_browser.py::test_a_classic_scrollbar_is_neither_under_an_arrow_nor_a_pan"
+old = '''
+ var cl = s.left + stage.clientLeft, cr = cl + stage.clientWidth;'''
+new = '''
+ var cl = s.left, cr = s.right;'''
diff --git a/tests/test_flow_browser.py b/tests/test_flow_browser.py
index aabd780..18f5882 100644
--- a/tests/test_flow_browser.py
+++ b/tests/test_flow_browser.py
@@ -522,7 +522,8 @@ def test_reveal_all_reveals_every_blurred_surface_and_survives_the_next_page(bro
ctx.close()
assert all("blur" in f for f in before), before
assert after == ["none", "none"], after
- assert review[:2] == ["none", "none"] and "blur again" in review[2], review
+ # revealed = no blur left; the review stage keeps Fit's drop shadow (r2c)
+ assert "blur(" not in review[0] and review[1] == "none" and "blur again" in review[2], review
assert "blur" in again, again
@@ -1100,7 +1101,8 @@ _GEOM = """() => {
const k = Math.min(box.w / nw, box.h / nh), dw = nw * k;
return {stage: r(st), inner: {w: st.clientWidth - parseFloat(cs.paddingLeft) - parseFloat(cs.paddingRight),
h: st.clientHeight - parseFloat(cs.paddingTop) - parseFloat(cs.paddingBottom)},
- img: box, nat: [nw, nh], fit: getComputedStyle(img).objectFit, scale: k,
+ img: box, nat: [nw, nh], fit: getComputedStyle(img).objectFit, pos: getComputedStyle(img).objectPosition, scale: k,
+ filter: getComputedStyle(img).filter,
drawn: {l: box.l + (box.w - dw) / 2, r: box.l + (box.w + dw) / 2},
prev: document.querySelector('.vnav.vprev') && r(document.querySelector('.vnav.vprev')),
next: document.querySelector('.vnav.vnext') && r(document.querySelector('.vnav.vnext')),
@@ -1134,7 +1136,8 @@ def test_fit_fills_the_stage_up_or_down(browser, live):
page.close()
for name, (fit, one) in got.items():
assert abs(fit["img"]["w"] - fit["inner"]["w"]) <= 1 and abs(fit["img"]["h"] - fit["inner"]["h"]) <= 1, (name, fit)
- assert fit["fit"] == "contain", (name, fit["fit"])
+ assert fit["fit"] == "contain" and fit["pos"] == "50% 50%", (name, fit["fit"], fit["pos"])
+ assert fit["filter"].startswith("drop-shadow"), ("the shadow follows the picture's pixels", fit["filter"])
assert [round(one["img"]["w"]), round(one["img"]["h"])] == one["nat"], (name, one["img"], one["nat"])
assert got["small.png"][0]["scale"] > 1.5 # enlarged
assert got["big.png"][0]["scale"] < 1 # reduced
@@ -1144,11 +1147,13 @@ def test_the_toggle_shows_for_every_picture_and_never_without_js(browser, live):
"""r2c S2: the per-picture hide is gone β a picture that fits at natural
size still gets Fit | 1:1. Audio gets none. Without JS it never shows."""
base, root = live
- b = _stage_set(root, {"small.png": (200, 100)})
+ b = _stage_set(root, {"small.png": (200, 100), "large.png": (3000, 2000)})
(b / "t.mp3").write_bytes(b"ID3")
page = browser.new_page(viewport={"width": 1400, "height": 900})
_load(page, f"{base}/b/g/view?f=small.png")
pic = page.locator("#vtoggle").is_visible()
+ _load(page, f"{base}/b/g/view?f=large.png")
+ pic = pic and page.locator("#vtoggle").is_visible() # every picture, small or large
page.goto(f"{base}/b/g/view?f=t.mp3", wait_until="networkidle")
audio = page.locator("#vtoggle").count()
page.close()
@@ -1190,20 +1195,31 @@ def test_the_mode_persists_across_prev_next_and_never_flashes(browser, live):
_load(page, page.url)
at_parse = page.evaluate("window.__stageOne")
pressed = page.locator("#btn-one").get_attribute("aria-pressed")
+ fit_pressed = page.locator("#btn-fit").get_attribute("aria-pressed")
+ # choosing Fit FORGETS 1:1 (removes the key; it does not store some other word)
+ page.locator("#btn-fit").click()
+ forgot = page.evaluate("localStorage.getItem('booth.fit')")
page.evaluate("localStorage.setItem('booth.fit', 'zoom')")
page.reload(wait_until="networkidle")
stray = page.evaluate("window.__stageOne")
ctx.close()
ctx = browser.new_context(viewport={"width": 1400, "height": 900})
page = ctx.new_page()
- page.add_init_script("Storage.prototype.setItem = function () { throw new Error('quota'); };")
+ errors = []
+ page.on("pageerror", lambda e: errors.append(str(e)))
+ page.add_init_script("""Storage.prototype.setItem = function () { throw new Error('quota'); };
+ Storage.prototype.getItem = function () { throw new Error('denied'); };""")
_load(page, f"{base}/b/g/view?f=a.png")
+ unreadable = page.evaluate("document.documentElement.classList.contains('stage-one')")
page.locator("#btn-one").click()
applied = page.evaluate("document.documentElement.classList.contains('stage-one')")
+ applied_pressed = page.locator("#btn-one").get_attribute("aria-pressed")
ctx.close()
+ assert unreadable is False and errors == [], (unreadable, errors)
+ assert applied_pressed == "true", "a write that throws must not cut the click short"
assert first is False and stored == "one", (first, stored)
- assert at_parse is True and pressed == "true", (at_parse, pressed)
- assert stray is False and applied is True, (stray, applied)
+ assert at_parse is True and pressed == "true" and fit_pressed == "false", (at_parse, pressed, fit_pressed)
+ assert stray is False and applied is True and forgot is None, (stray, applied, forgot)
def test_the_arrows_sit_just_outside_the_picture_and_clamp_to_the_stage(browser, live):
@@ -1233,6 +1249,9 @@ def test_the_arrows_sit_just_outside_the_picture_and_clamp_to_the_stage(browser,
assert abs(g["next"]["l"] - (g["drawn"]["r"] + 8)) <= 2, (g["drawn"], g["next"])
for g in (tall, wide, resized):
assert g["prev"]["l"] >= g["stage"]["l"] and g["next"]["r"] <= g["stage"]["r"], g
+ mid = (g["stage"]["t"] + g["stage"]["b"]) / 2
+ for a in (g["prev"], g["next"]):
+ assert abs((a["t"] + a["b"]) / 2 - mid) <= 2, ("not centred on the stage", a, mid)
assert g["next"]["r"] <= g["rail"]["l"], "an arrow over the rail"
assert abs(wide["prev"]["l"] - (wide["stage"]["l"] + 8)) <= 2 and abs(wide["next"]["r"] - (wide["stage"]["r"] - 8)) <= 2, wide
@@ -1263,6 +1282,13 @@ def test_in_one_to_one_a_drag_pans_and_the_picture_cannot_be_dragged_away(browse
panned = scroll()
page.mouse.move(cx, cy); page.mouse.down(); page.mouse.move(cx + 2, cy + 1, steps=2); page.mouse.up()
jitter = scroll()
+ # the threshold is 4px of TOTAL movement: (3, 2) is 3.6px and pans nothing;
+ # a (3, 3) diagonal is 4.24px, so it pans
+ page.mouse.move(cx, cy); page.mouse.down(); page.mouse.move(cx + 3, cy + 2, steps=1); page.mouse.up()
+ under = scroll()
+ page.mouse.move(cx, cy); page.mouse.down(); page.mouse.move(cx + 3, cy + 3, steps=1); page.mouse.up()
+ diagonal = scroll()
+ page.evaluate("document.getElementById('vstage').scrollTo(420, 440)")
# the stage's reveal sits over the stage, not in its scrolled content: at any
# scroll it is in view, a click on it reveals, and a drag from it pans nothing
btn = page.locator("#vreveal").bounding_box()
@@ -1278,5 +1304,198 @@ def test_in_one_to_one_a_drag_pans_and_the_picture_cannot_be_dragged_away(browse
assert cursor == "grab", cursor
assert panned == [420, 440], panned
assert jitter == [420, 440] and dragged_from_button == [420, 440], (jitter, dragged_from_button)
+ assert under == [420, 440] and diagonal == [417, 437], (under, diagonal)
assert revealed and after_button == [420, 440], (revealed, after_button)
assert draggable is False
+
+
+def test_in_one_to_one_every_pixel_of_a_large_picture_is_reachable(browser, live):
+ """heid code-review (kimi; confirmed by measurement): the 1:1 stage kept the
+ flex CENTRING while adding overflow β a picture larger than the stage
+ overflowed BOTH sides, and the start side cannot be scrolled to. A 3000px
+ picture hid its leftmost 980px for good. At scroll (0, 0) the picture's
+ top-left is the stage's; at the far scroll its bottom-right is. A picture
+ smaller than the stage is still centred."""
+ base, root = live
+ _stage_set(root, {"a-huge.png": (3000, 3000), "b-small.png": (200, 100)})
+ page = browser.new_page(viewport={"width": 1400, "height": 900})
+ _load(page, f"{base}/b/g/view?f=a-huge.png")
+ page.locator("#btn-one").click()
+ page.wait_for_timeout(150)
+ edges = """(to) => { const s = document.getElementById('vstage');
+ s.scrollTo(to === 'start' ? 0 : s.scrollWidth, to === 'start' ? 0 : s.scrollHeight);
+ const sr = s.getBoundingClientRect(), ir = document.getElementById('vimg').getBoundingClientRect();
+ return to === 'start' ? [Math.round(ir.left - sr.left), Math.round(ir.top - sr.top)]
+ : [Math.round(sr.left + s.clientWidth - ir.right), Math.round(sr.top + s.clientHeight - ir.bottom)]; }"""
+ start, end = page.evaluate(edges, "start"), page.evaluate(edges, "end")
+ _load(page, f"{base}/b/g/view?f=b-small.png")
+ small = page.evaluate("""() => { const s = document.getElementById('vstage'), sr = s.getBoundingClientRect(),
+ ir = document.getElementById('vimg').getBoundingClientRect();
+ return [Math.round((ir.left - sr.left) - (sr.left + s.clientWidth - ir.right)),
+ Math.round((ir.top - sr.top) - (sr.top + s.clientHeight - ir.bottom))]; }""")
+ page.close()
+ assert start == [0, 0] and end == [0, 0], (start, end)
+ assert all(abs(v) <= 1 for v in small), small # centred: equal margins both sides
+
+
+def test_a_pan_holds_past_the_stage_edge_and_never_starts_on_a_hover(browser, live):
+ """heid code-review (hulda, kimi): pointer capture was in no test β a drag
+ carried past the stage's edge must keep panning β and a press released
+ OUTSIDE the stage before the drag began left the drag armed, so a later
+ buttonless hover panned. Capture holds the gesture; no button, no pan."""
+ base, root = live
+ _stage_set(root, {"huge.png": (3000, 3000)})
+ page = browser.new_page(viewport={"width": 1400, "height": 900})
+ _load(page, f"{base}/b/g/view?f=huge.png")
+ page.locator("#btn-one").click()
+ page.evaluate("document.getElementById('vstage').scrollTo(1500, 1500)")
+ scroll = lambda: page.evaluate("[document.getElementById('vstage').scrollLeft, document.getElementById('vstage').scrollTop]")
+ st = page.locator("#vstage").bounding_box()
+ cx, cy = st["x"] + st["width"] / 2, st["y"] + st["height"] / 2
+ # 1. carried far past the stage's right edge (over the rail): still panning
+ page.mouse.move(cx, cy); page.mouse.down()
+ page.mouse.move(cx + 40, cy, steps=2)
+ page.mouse.move(cx + st["width"] / 2 + 250, cy, steps=12)
+ page.mouse.up()
+ past_edge = scroll()
+ # 2. pressed, then out of the stage in one jump, released outside, re-entered with no button
+ page.evaluate("document.getElementById('vstage').scrollTo(1500, 1500)")
+ page.mouse.move(cx, cy); page.mouse.down()
+ page.mouse.move(st["x"] + st["width"] + 150, cy, steps=1)
+ page.mouse.up()
+ page.mouse.move(cx + 60, cy + 40, steps=6)
+ hover = scroll()
+ page.close()
+ expected = 1500 - (st["width"] / 2 + 250)
+ assert abs(past_edge[0] - expected) <= 2 and past_edge[1] == 1500, (past_edge, expected)
+ assert hover == [1500, 1500], hover
+
+
+def test_before_placement_the_arrows_never_sit_over_the_rail_on_a_narrow_screen(browser, live):
+ """heid code-review (hulda): stacked (<=900px), the arrows' CSS spot β
+ their place with JS off, while loading, or after a failed load β centred
+ on the stage AND the rail below it. Now it is the stage's centre. And a
+ picture that fails to load leaves the arrows at that spot, unplaced."""
+ base, root = live
+ from booth.marks import write_note
+ b = _stage_set(root, {"a.png": (1600, 1200), "c.png": (1600, 1200)})
+ (b / "b-broken.png").write_bytes(b"\x89PNG\r\n\x1a\nnot really")
+ # a rail TALLER than the stage β the only case where centring on stage AND
+ # rail lands below the stage; a short rail hid the bug (this test's first
+ # draft was vacuous against removing the fix)
+ for i in range(14):
+ write_note(b, "a.png", f"note {i}: " + "a longer observation about this picture " * 3)
+ ctx = browser.new_context(java_script_enabled=False, viewport={"width": 390, "height": 844})
+ page = ctx.new_page()
+ page.goto(f"{base}/b/g/view?f=a.png", wait_until="networkidle")
+ nojs = page.evaluate(_GEOM.replace("img.naturalWidth", "(img.naturalWidth || 1)").replace("img.naturalHeight", "(img.naturalHeight || 1)"))
+ ctx.close()
+ page = browser.new_page(viewport={"width": 1400, "height": 900})
+ errors = []
+ page.on("pageerror", lambda e: errors.append(str(e)))
+ page.goto(f"{base}/b/g/view?f=b-broken.png", wait_until="networkidle")
+ page.wait_for_timeout(300)
+ broken = page.evaluate("[...document.querySelectorAll('.vnav')].map(a => a.classList.contains('is-placed'))")
+ page.close()
+ for a in (nojs["prev"], nojs["next"]):
+ assert a["b"] <= nojs["stage"]["b"] and a["t"] >= nojs["stage"]["t"], ("over the rail", a, nojs["stage"])
+ assert broken == [False, False] and errors == [], (broken, errors)
+
+
+def test_the_stage_reveal_never_shows_without_js_and_keeps_the_fit_shadow(browser, live):
+ """heid bug-hunt (hulda, regin): the stage's reveal rendered visible with
+ scripts off and did nothing; and a revealed picture lost Fit's shadow."""
+ from booth.app import set_blurred
+ base, root = live
+ b = _stage_set(root, {"a.png": (800, 600)})
+ set_blurred(b, "a.png", True)
+ ctx = browser.new_context(java_script_enabled=False)
+ page = ctx.new_page()
+ page.goto(f"{base}/b/g/view?f=a.png", wait_until="networkidle")
+ nojs = page.locator("#vreveal").is_visible()
+ ctx.close()
+ page = browser.new_page(viewport={"width": 1400, "height": 900})
+ _load(page, f"{base}/b/g/view?f=a.png")
+ page.locator("#vreveal").click()
+ page.wait_for_timeout(400)
+ shadow = page.evaluate("getComputedStyle(document.getElementById('vimg')).filter")
+ page.close()
+ assert not nojs
+ assert shadow.startswith("drop-shadow"), shadow
+
+
+def test_a_stage_mode_chosen_in_one_tab_moves_the_others(browser, live):
+ """heid bug-hunt (regin): the theme follows a choice made in another tab;
+ the stage mode did not."""
+ base, root = live
+ _stage_set(root, {"a.png": (1600, 1200)})
+ ctx = browser.new_context(viewport={"width": 1400, "height": 900})
+ a, b = ctx.new_page(), ctx.new_page()
+ _load(a, f"{base}/b/g/view?f=a.png")
+ _load(b, f"{base}/b/g/view?f=a.png")
+ a.locator("#btn-one").click()
+ b.wait_for_function("document.documentElement.classList.contains('stage-one')", timeout=5000)
+ pressed = b.locator("#btn-one").get_attribute("aria-pressed")
+ ctx.close()
+ assert pressed == "true"
+
+
+def test_a_picture_that_overflows_one_axis_pans_along_it(browser, live):
+ """heid code-review supplement (groa): 'overflows EITHER axis' was untested;
+ requiring both would pass everything else. A wide, short picture in 1:1 β
+ wider than the stage, shorter than it β pans horizontally."""
+ base, root = live
+ _stage_set(root, {"wide.png": (3000, 200)})
+ page = browser.new_page(viewport={"width": 1400, "height": 900})
+ _load(page, f"{base}/b/g/view?f=wide.png")
+ page.locator("#btn-one").click()
+ page.evaluate("document.getElementById('vstage').scrollTo(800, 0)")
+ st = page.locator("#vstage").bounding_box()
+ cx, cy = st["x"] + st["width"] / 2, st["y"] + st["height"] / 2
+ page.mouse.move(cx, cy); page.mouse.down(); page.mouse.move(cx + 100, cy, steps=6); page.mouse.up()
+ got = page.evaluate("[document.getElementById('vstage').scrollLeft, document.getElementById('vstage').classList.contains('can-pan')]")
+ page.close()
+ assert got == [700, True], got
+
+
+_CLASSIC_SCROLLBARS = "#vstage::-webkit-scrollbar{width:15px;height:15px;background:#888}"
+
+
+def test_a_classic_scrollbar_is_neither_under_an_arrow_nor_a_pan(browser, live):
+ """heid bug-hunt supplement (groa): with classic scrollbars the next arrow
+ clamped against the stage's BORDER box and sat under the vertical bar, and
+ a press on the bar started a pan that fought the thumb backwards. Headless
+ Chromium draws overlay bars (no gutter), so this test forces a 15px classic
+ one β and asserts the gutter is real before it trusts a single measure."""
+ base, root = live
+ _stage_set(root, {"huge.png": (3000, 3000), "z.png": (3000, 3000)})
+ # Playwright launches headless Chromium with --hide-scrollbars, which hides
+ # even a styled bar: this test needs a browser without it
+ bars = browser.browser_type.launch(args=OFFLINE, ignore_default_args=["--hide-scrollbars"])
+ page = bars.new_page(viewport={"width": 1400, "height": 900})
+ page.add_init_script(f"document.addEventListener('DOMContentLoaded', () => {{ const st = document.createElement('style'); st.textContent = {_CLASSIC_SCROLLBARS!r}; document.head.appendChild(st); }});")
+ page.goto(f"{base}/b/g/view?f=huge.png", wait_until="networkidle")
+ page.wait_for_function("document.getElementById('vimg').naturalWidth > 0")
+ page.locator("#btn-one").click()
+ # `complete` can be true before the 3000px picture is LAID OUT; scrolling
+ # before then clamps to 0 (this test's first draft flaked 1 in 3 on it)
+ page.wait_for_function("(s => s.scrollWidth - s.clientWidth > 1500)(document.getElementById('vstage'))")
+ g = page.evaluate("""() => { const s = document.getElementById('vstage'), r = s.getBoundingClientRect(),
+ n = document.querySelector('.vnext').getBoundingClientRect();
+ return {gutter: s.offsetWidth - s.clientWidth, client_right: r.left + s.clientLeft + s.clientWidth,
+ next_right: n.right, r: {x: r.left, y: r.top, w: r.width, h: r.height}}; }""")
+ page.evaluate("document.getElementById('vstage').scrollTo(800, 800)")
+ # A press ON the vertical scrollbar, dragged sideways, dispatched as pointer
+ # events so the test measures OUR handler and not Chromium's native bar
+ # (real-mouse drags on the bar flaked 1 in 6 on native track behaviour that
+ # never reproduced standalone in 14 tries): no pan may move the picture.
+ left = page.evaluate("""() => { const s = document.getElementById('vstage'), r = s.getBoundingClientRect();
+ const x = r.left + r.width - 6, y = r.top + r.height / 2;
+ const ev = (t, dx, b) => s.dispatchEvent(new PointerEvent(t, {bubbles: true, pointerId: 7, button: 0,
+ buttons: b, clientX: x + dx, clientY: y, isPrimary: true}));
+ ev('pointerdown', 0, 1); ev('pointermove', -40, 1); ev('pointermove', -80, 1); ev('pointerup', -80, 0);
+ return s.scrollLeft; }""")
+ bars.close()
+ assert g["gutter"] >= 15, ("the forced classic scrollbar is not in effect", g)
+ assert g["next_right"] <= g["client_right"] - 8 + 1, g
+ assert left == 800, left