Merge current dev and refresh PR #6741 from the 7011 integration

tests/test_editor_toolbar_flyout_hint.py

@@ -0,0 +1,54 @@
+"""Toolbar flyout affordances: the "more tools" corner triangle must survive
+face re-renders, and brush-preset rows in the brush flyout show a tip glyph.
+
+The triangle hint used to be injected into the slot FACE element, so any
+`setInner(face, id)` re-render (e.g. after picking a flyout member) wiped it and
+the slot looked like a single tool. It now lives on the slot wrapper, and the
+brush-preset rows carry a soft/hard/pixel disc reflecting the preset tip.
+"""
+
+from pathlib import Path
+import re
+
+ROOT = Path(__file__).resolve().parents[1]
+TOOLBAR = (ROOT / "static/js/editor/build/toolbar.js").read_text(encoding="utf-8")
+CSS = (ROOT / "static/css/13-image-editor.css").read_text(encoding="utf-8")
+SW = (ROOT / "static/sw.js").read_text(encoding="utf-8")
+
+
+def test_flyout_triangle_is_on_the_slot_not_the_face():
+    assert "slotEl.insertAdjacentHTML('beforeend', '<span class=\"ge-tool-flyout-tri\" aria-hidden=\"true\"></span>');" in TOOLBAR
+    assert "const tri = slotEl.querySelector('.ge-tool-flyout-tri');" in TOOLBAR
+    # the hint must not be re-injected into the face (which setInner replaces)
+    assert "face.insertAdjacentHTML('beforeend', '<span class=\"ge-tool-flyout-tri\"" not in TOOLBAR
+
+
+def test_flyout_triangle_css_is_visible():
+    # The element is a generous transparent hit area; the visible mark is
+    # painted by ::after so it stays easy to click despite being small.
+    i = CSS.index(".ge-tool-flyout-tri {")
+    block = CSS[i:i + 460]
+    assert "width: 18px;" in block
+    assert "height: 18px;" in block
+    j = CSS.index(".ge-tool-flyout-tri::after {")
+    mark = CSS[j:j + 420]
+    assert "border-left: 7px solid transparent;" in mark
+    assert "border-bottom: 7px solid var(--fg-muted, currentColor);" in mark
+    assert "opacity: 0.7;" in mark
+
+
+def test_brush_preset_rows_have_a_tip_icon():
+    assert "const soft = typeof preset.softness === 'number' ? preset.softness : 100;" in TOOLBAR
+    assert "const presetIcon = preset.pixel" in TOOLBAR
+    assert '<span class="ge-tool-icon">${presetIcon}</span><span class="ge-tool-flyout-label">${preset.name}</span>' in TOOLBAR
+
+
+def test_flyout_is_clamped_inside_the_viewport():
+    assert "const maxLeft = Math.max(4, window.innerWidth - fw - 4);" in TOOLBAR
+    assert "const maxTop = Math.max(4, window.innerHeight - fh - 4);" in TOOLBAR
+    assert "if (viewLeft > maxLeft) flyout.style.left = (maxLeft - cbX) + 'px';" in TOOLBAR
+    assert "if (viewTop > maxTop) flyout.style.top = (maxTop - cbY) + 'px';" in TOOLBAR
+
+
+def test_sw_cache_name_bumped():
+    assert re.search(r"odysseus-v\d+-pr40-editor-precache", SW)