fix(preview): make task checkboxes work, and look like task checkboxes

[PathGao]

Fixes #148.

@arcadepro was right to reopen it, right that 2.6.7 was the last version that worked, and right again when he said the newer fixes only changed the colour. Four separate defects were sitting on this one gesture. Three of them arrived together in the comrak 0.18 → 0.54 upgrade (#426, shipped as 2.6.8), and only one of the three was ever fixed.

	what broke	fixed by
checkbox rendered disabled	comrak changed the task HTML	#320 / #345
the toggle wrote to the wrong line	#345 replaced an EOL-independent write-back with line arithmetic	here
task lists lost their styling	comrak stopped emitting the classes 15 CSS rules depend on	here
ticking re-rendered the document	the buffer write is enough to trigger the render effect	here

1. The toggle wrote to the wrong line

-  let count = 0;
-  raw.replace(/^(\s*[-*+] )\[( |x|X)\]/gm, (match, prefix) => {
-      if (count++ === index) …            // ordinal: EOL-independent
+  body.replace(/…/gm, (match, prefix, _state, offset) => {
+      const line = body.slice(0, offset).split('\n').length;   // line arithmetic

\s matches \r as well as \n, and JavaScript's /m ^ also matches at the position between a \r and its \n. With \s* greedy, a match can begin one character early — on the previous line's terminator — so the slice holds one \n too few and the task resolves to line N-1.

This is not only a CRLF bug, which is what the first version of this PR claimed. A blank line above the list is the other half of the condition, and that is how most people write a list. Measured against samples/stress-test.md before and after:

LF, list directly after prose      correct
LF, blank line above the list      the first task of each block is wrong
CRLF                               every task is wrong

The old document had 44 tasks and got 6 wrong. Every one of the six was the first task after a blank line.

On the last task of a list nothing matches sourceLine, the write is skipped, and the control snaps back — indistinguishable from a dead checkbox, which is what #148 reports. Everywhere else the off-by-one lands on a real task and silently rewrites the neighbour. Nobody filed that, because nobody can see it happen.

Fix: horizontal whitespace only, so a match can never begin before the line start. The Rust TASK_SOURCE_RE needs no change — it runs over markdown.lines(), already split.

2. Task lists lost their styling

styles.css has fifteen rules on li.task-list-item and ul.contains-task-list — the bullet suppression and the grid that puts the checkbox beside its text. comrak emits neither class unless render.tasklist_classes is set, and it defaults to off. All fifteen were dead: task lists rendered with the bullet still showing and the checkbox alone on a line above its text. This is what the reporter's screenshot shows.

Turning the option on moved the HTML under TASK_ITEM_RE, which anchored on <li data-sourcepos= immediately followed by <input type="checkbox". comrak now writes a class into both, so the pattern stopped matching and data-task-checkbox stopped being injected — the attribute the preview uses to find a checkbox at all. Six tests caught it. Both class groups are now optional, so flipping the option back fails a test rather than silently un-marking every checkbox.

That fixed half of it. comrak writes task-list-item only on the branch where it opens the <li> itself, which a plain task item does not take — so the <ul> got its class and the items got nothing, the bullet disappeared, and every rule that positions the checkbox stayed dead. processTaskItems now adds it, which is where the app already decides which items are really tasks.

3. Ticking re-rendered the whole document

toggleTaskCheckbox is careful not to re-render — it toggles task-done on the item and leaves the DOM alone. But writing the buffer is enough on its own: MarkdownViewer's render effect fires whenever rawContent stops matching _lastRenderedRawContent, so in split view every tick rebuilt the article to arrive at the DOM that was already on screen, and took the reader's scroll position with it. In a long document the view landed somewhere else entirely.

The write now records that the preview already matches — in the same synchronous block, because the effect checks that field and arms a 16ms timer before anything is awaited.

4. The stress document could not have caught any of this

samples/stress-test.md had two task shapes: a flat - list and one nested level. It now carries ordered 1., parenthesised 1), *, +, tasks in a blockquote, four levels of mixed nesting, adjacent runs, and a list with no blank line above it beside one with a blank line.

It also carries the shape from the reporter's own attachment: a task whose item is a dozen indented lines, every line an inline code span, most ending in two trailing spaces so each is a hard break. That is the shape where a checkbox and its text can be laid out apart from one another.

old document, old pattern:  44 tasks,  6 wrong
new document, old pattern:  76 tasks, 14 wrong
new document, new pattern:  76 tasks,  0 wrong

Diffed against markdown-syntax.md while in there, the document was also missing every wikilink, block id, video/audio embed, YouTube embed and ++inserted++ — so three features could have been broken with the stress test passing end to end. Added.

Why it survived two releases

All three previous fixes were verified on macOS, where the CRLF half cannot occur. And the suite could not see the rest: the only behavioural call of toggleTaskCheckbox lives in truncatedBufferGuard.test.ts and passes sourceLine: 1 — the one line number the bug cannot reach, because at offset 0 there is no preceding terminator for \s* to eat.

scripts/taskToggleLineEndings.test.ts drives the real document session over both line endings, with and without a blank line above the list, across every marker shape. Reverting the pattern fails six cases and leaves the LF-without-blank-line ones passing — so the fixtures reproduce the bug rather than merely asserting the fix.

Validation

• npm test 863 · npm run check 0 errors · cargo test 141 · npm audit 0 vulnerabilities
• Verified by reverting each fix in turn and watching the matching tests go red
• Tested by hand on macOS: every shape in the new document toggles, toggles only itself, and the view no longer jumps

Not verified: no run on Windows or Linux, and the rendering fixes are confirmed by screenshot on macOS only.

🤖 Generated with Claude Code