Group the two visibility switches, and put the drawing tools back where they belong

"Zeichnung" and "Randnotizen" are two halves of one question — how much of your
own work do you want to see right now — and they sat at opposite ends of the
toolbar, each beside the tool that made them. They are now one pair in one shape
at the right-hand end. Each still appears only once there is something of its
kind to hide, so the pair can be lopsided, which is honest.

The drawing tools had drifted past the pin controls as those were added, so
switching to Zeichnen made them appear somewhere other than where the eye
already was. They follow the button that turns them on again.

A separator no longer carries a ×. It sat a few pixels from the label you click
to rename, putting the gesture that tidies the list next to the one that destroys
part of it — so removal is a right-click behind a confirmation that says the
notes are not affected, which is how everything else in that list is acted on.

218 unit tests, 237 browser checks across eleven suites. The toolbar checks
compare measured positions rather than presence, since the complaint was about
where things were, not whether they existed.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This commit is contained in:
marcandClaude Opus 5 committed 2026-08-11 01:24:25 +02:00
1 parent 4c1b632029
commit 0a7cf26b28
6 files changed
+208 -104

No files matched your search

+21 -3
View File
@@ -187,9 +187,27 @@ try {
await p.waitForTimeout(800);
check((await p.locator("[data-separator]").count()) === 1, "and back on the way in");
await p.locator("[data-separator] button[aria-label=\"Remove separator\"]").click();
await p.waitForTimeout(1800);
check((await p.locator("[data-separator]").count()) === 0, "a separator can be removed again");
/* Removing is a right-click behind a confirmation. The × used to sit a few
pixels from the label you click to rename, so tidying the list and
destroying part of it were neighbouring gestures. */
check(
(await p.locator('[data-separator] button[aria-label="Remove separator"]').count()) === 0,
"there is no delete button sitting next to the rename target"
);
await p.locator("[data-separator]").click({ button: "right" });
await p.waitForTimeout(600);
await p.getByText("Trenner entfernen").click();
await p.waitForTimeout(600);
check(
/Notizen bleiben/.test(await p.locator("body").innerText()),
"right-clicking it asks first, and says the notes are not affected"
);
await p.getByRole("button", { name: "Entfernen" }).click();
await p.waitForTimeout(2000);
check((await p.locator("[data-separator]").count()) === 0, "and then it is gone");
check((await titles()).length === 3, "with every note still there", (await titles()).join(", "));
/* ── exporting a note and importing it back ── */
await p.locator("[data-note-row]").filter({ hasText: "Beta" }).first().click();
+59 -1
View File
@@ -704,7 +704,65 @@ try {
await p.keyboard.press("Escape");
await p.waitForTimeout(600);
/* ── showing and hiding them ── */
/* ── the two visibility switches, together at the end of the bar ── */
// Drawings and margin notes are two halves of one question — how much of your
// own work do you want to see — and they used to sit at opposite ends of the
// toolbar, each beside the tool that made them.
// Each switch appears only when there is something of its kind to hide, so a
// stroke goes back on the page first — the pair is the point here.
await p.locator("[data-pdf-mode]").click();
await p.waitForTimeout(600);
const inkPage = await p.locator('[data-pdf-page="1"]').boundingBox();
await p.mouse.move(inkPage.x + 60, inkPage.y + 300);
await p.mouse.down();
await p.mouse.move(inkPage.x + 160, inkPage.y + 330, { steps: 8 });
await p.mouse.up();
await p.waitForTimeout(2000);
await p.locator("[data-pdf-mode]").click();
await p.waitForTimeout(700);
const barOrder = await p.evaluate(() => {
const bar = document.querySelector("[data-pdf-mode]")?.parentElement;
if (!bar) return null;
const at = (sel) => {
const el = document.querySelector(sel);
return el ? el.getBoundingClientRect().left : null;
};
return {
draw: at("[data-pdf-mode]"),
pin: at("[data-pdf-pin-mode]"),
ink: at("[data-pdf-hide-ink]"),
pins: at("[data-pdf-show-pins]"),
barRight: bar.getBoundingClientRect().right,
};
});
check(
barOrder.ink > barOrder.pin && barOrder.pins > barOrder.ink,
"both switches sit past the tools, side by side",
JSON.stringify(barOrder)
);
check(
barOrder.barRight - barOrder.pins < 160,
"at the right-hand end of the bar",
`${Math.round(barOrder.barRight - barOrder.pins)}px from the edge`
);
/* The drawing tools belong to the button that turns them on. */
await p.locator("[data-pdf-mode]").click();
await p.waitForTimeout(700);
const toolAt = await p.evaluate(() => ({
draw: document.querySelector("[data-pdf-mode]").getBoundingClientRect().right,
firstTool: document.querySelector('[data-pdf-tool="pen"]').getBoundingClientRect().left,
pin: document.querySelector("[data-pdf-pin-mode]").getBoundingClientRect().left,
}));
check(
toolAt.firstTool > toolAt.draw && toolAt.firstTool < toolAt.pin,
"and the drawing tools appear right beside Zeichnen, not past everything else",
JSON.stringify(toolAt)
);
await p.locator("[data-pdf-mode]").click();
await p.waitForTimeout(700);
check((await p.locator("[data-pdf-show-pins]").count()) === 1, "the margin notes can be hidden");
await p.locator("[data-pdf-show-pins]").click();
await p.waitForTimeout(1200);