Tooltips in the Notebooks chooser

From the development repository at e819bc4.

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>

tests/test_end_to_end.py

@@ -916,6 +916,64 @@ class EndToEndTest(unittest.TestCase):
         time.sleep(0.8)
         self.assertEqual(showing(), "Write on the page. O")
 
+        # In the Notebooks chooser, a page card's tooltip gives the facts
+        # about the page, headed by its first text (nearest the top, then
+        # the left), and a notebook's gives its facts; both shown inside
+        # the dialog, which is above everything else.
+        notebook = self.notebooks / "Reader notebook"
+        notebook.mkdir(parents=True, exist_ok=True)
+        (notebook / "2026_10_01_01.svg").write_text(
+            '<?xml version="1.0"?><svg xmlns="http://www.w3.org/2000/svg" data-kokkoja="1" data-page="abcdefghijkl" data-number="1" data-base="2970 2100" '
+            'viewBox="0 0 2970 2100"><rect width="2970" height="2100" fill="#fff"/>'
+            '<g data-layer="a" data-name="Anna"><g data-stroke="s" data-width="7" data-points="10 10 0.5 20 20 0.5" '
+            'stroke="#000000" fill="none"><path d="M10 10 L20 20"/></g>'
+            '<g data-text="t2" data-x="100" data-y="900" data-width="" data-height="" data-size="35" '
+            'data-font="sans-serif" data-box="300 50"><desc>Lower text</desc>'
+            '<text fill="#000000"><tspan>Lower text</tspan></text></g>'
+            '<g data-text="t1" data-x="500" data-y="200" data-width="" data-height="" data-size="35" '
+            'data-font="sans-serif" data-box="500 50"><desc>Übung 12: der Dativ</desc>'
+            '<text fill="#000000"><tspan>Übung 12: der Dativ</tspan></text></g></g></svg>')
+        (notebook / "2026_10_03_01.svg").write_text(
+            '<?xml version="1.0"?><svg xmlns="http://www.w3.org/2000/svg" data-kokkoja="1" data-page="abcdefghijkl" data-number="1" data-base="2970 2100" '
+            'viewBox="0 0 2970 2100"><rect width="2970" height="2100" fill="#fff"/></svg>')
+        firefox.run("document.getElementById('load_notebook_page').click();")
+        self.wait_until_true(lambda: firefox.run("""
+            return [...document.querySelectorAll('#chooser_notebooks button.notebook_pick')].map((b) => b.textContent);
+        """), lambda names: "Reader notebook" in names, "the chooser to list the notebooks")
+        firefox.run("""
+            [...document.querySelectorAll('#chooser_notebooks button.notebook_pick')]
+              .find((b) => b.textContent === 'Reader notebook').click();
+        """)
+        self.wait_until_true(lambda: firefox.run("""
+            return [...document.querySelectorAll('#chooser_pages .page_card')].map((c) => c.dataset.help);
+        """), lambda helps: len(helps) == 2 and all("Sheet" in h for h in helps), "the cards' tooltips to be made")
+        helps = firefox.run("return [...document.querySelectorAll('#chooser_pages .page_card')].map((c) => c.dataset.help);")
+        self.assertEqual(helps[0].split("\n")[0], "Übung 12: der Dativ")
+        self.assertIn("Written by Anna", helps[0])
+        self.assertIn("1 stroke, 2 text blocks", helps[0])
+        self.assertIn("Sheet 29.7 × 21.0 cm", helps[0])
+        self.assertRegex(helps[0], r"Last changed \S+ at \d")
+        self.assertEqual(helps[1].split("\n")[0], "Last changed " + helps[1].split("\n")[0][13:])
+        self.assertIn("Nothing on it", helps[1])
+        self.wait_until_true(lambda: firefox.run("""
+            return [...document.querySelectorAll('#chooser_notebooks button.notebook_pick')]
+              .find((b) => b.textContent === 'Reader notebook').dataset.help;
+        """), lambda help: "kept pages" in help, "the notebook's tooltip to be made")
+        self.assertIn("2 kept pages, from 2026-10-01 to 2026-10-03", firefox.run("""
+            return [...document.querySelectorAll('#chooser_notebooks button.notebook_pick')]
+              .find((b) => b.textContent === 'Reader notebook').dataset.help;
+        """))
+        firefox.run("""
+            document.querySelector('#chooser_pages .page_card')
+              .dispatchEvent(new PointerEvent('pointerover', {bubbles: true, pointerType: 'mouse'}));
+        """)
+        time.sleep(1.3)
+        self.assertEqual(firefox.run("""
+            const t = document.querySelector('dialog[open] .tooltip');
+            return t && !t.hidden ? t.textContent.split('\\n')[0] : null;
+        """), "Übung 12: der Dativ")
+        firefox.run("document.getElementById('chooser_close').click();")
+
     def test_hide_rectangles(self):
         """The teacher's requests of 2026-10-08: a Hide rectangle covers part
         of the page in white for everyone, marked by blue corners."""
@@ -1656,11 +1714,12 @@ class EndToEndTest(unittest.TestCase):
             const box = tip.getBoundingClientRect();
             return {text: tip.textContent, below: box.top > button.bottom, left: box.left, buttonLeft: button.left};
         """)
-        # Two seconds of rest before the tooltip shows (one until 2026-10-06).
+        # One second in the button before the tooltip shows (two until
+        # 2026-10-11, one until 2026-10-06).
         firefox.hover("#new_page")
-        time.sleep(1.2)
+        time.sleep(0.5)
         self.assertIsNone(tooltip())
-        time.sleep(1.3)
+        time.sleep(0.8)
         shown = tooltip()
         self.assertEqual(shown["text"], firefox.run(
             "return document.getElementById('new_page').getAttribute('data-help');"))