frappe / frappe/draw

Eraser hard-splits strokes instead of rubbing them out smoothly (MS Paint-style)

Open
#569 0 comments 0 reactions 0 assignees View on GitHub
Dominant language
JavaScript
Stars
21
Forks
13
Avg merge
2d 18h
Merged PRs (30d)
24

Description

## Reported via manual QA

The eraser doesn't feel like a rubber — it breaks lines/drawings apart rather than smoothly erasing through them. Expected behavior: like MS Paint's eraser, which rubs out ink cleanly under the cursor without leaving the stroke visually fractured/glitchy.

## Current behavior

`frontend/src/diagram/eraser.js` — `eraseStrokes` / `splitStrokeByErase` (roughly lines 121-193): the eraser disk is geometrically **subtracted** from a stroke's path. Any point run the disk touches is cut out, and each surviving contiguous run of points becomes a brand-new, separate stroke object (via `makeStroke(run, ...)`). This is a hard geometric split, not a soft rub — which is exactly what reads as "breaking" the drawing: a single stroke erased in the middle becomes two independent stroke objects with a hard gap, and the erase boundary/tip shape is whatever the disk-vs-polyline intersection produces, not necessarily a soft edge.

Driven from `frontend/src/composables/useWhiteboardInteraction.js` — `beginErase` (~line 169) / `eraseStep` (~line 306), with `radius = ui.state.eraserSize`.

## Expected behavior

Erasing should feel like rubbing something out — the eraser should remove ink cleanly along its path with a soft, round tip (matching the eraser cursor size), without producing visible "breaks" or artifacts in the remaining strokes. Reference: MS Paint's eraser tool.

## Where to look

- `frontend/src/diagram/eraser.js` — the split/subtraction algorithm (`eraseStrokes`, `splitStrokeByErase`)
- `frontend/src/composables/useWhiteboardInteraction.js` — `beginErase`, `eraseStep` (erase gesture driver)

Contributor guide

Open the contributing guide

Research direction

Start with frontend/src/diagram/eraser.js, focusing on eraseStrokes and splitStrokeByErase, then trace how beginErase and eraseStep in frontend/src/composables/useWhiteboardInteraction.js drive the gesture. Compare the current subtraction and stroke-splitting behavior with the MS Paint-style expectation. Done means erasing follows the cursor with a round tip and does not leave visibly fractured strokes or artifacts.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript
Domain
computer-graphics, frontend
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Active
Clarity
Mostly clear
Newbie friendliness
48/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.