Ionaru / Ionaru/easy-markdown-editor

Native spellcheck (nativeSpellcheck) doesn't work, has unnatural custom style, doesn't allow adding corrections to dictionary

Open
#617 4 comments 0 reactions 0 assignees View on GitHub
Bug
Dominant language
JavaScript
Stars
3.1k
Forks
363
PR merge metrics
No merged PRs in 30d

Description

Leaving the options empty or adding `spellChecker: false` and `nativeSpellchecker: true` should

1. make spelling mistakes appear as they would in [any ol' normal textarea](https://fishiecat.github.io/html-textarea-example/)
2. allow right clicking to add corrections to the browser spellchecker dictionary

EasyMDE doesn't. Unless [this 2020 comment](https://github.com/Ionaru/easy-markdown-editor/pull/143#issuecomment-599510773) is still valid.

**To Reproduce**

Below is the code based on and tested at https://stackblitz.com/edit/easymde :
```





EasyMDE demo



A spellink mistake.
Blueb erry wh ine.
Astount ing..

const easymde = new EasyMDE({

// START INSERTING


// END INSERTING
element: document.getElementById('my-text-area'),
sideBySideFullscreen: false
});

```

Paste the above into https://stackblitz.com/edit/easymde and add a space to the text area to trigger the spell check.

Then add
```
spellChecker: false,
nativeSpellchecker: true,
```
to the INSERTING commented area and trigger spellcheck again.

**Expected behavior**

1. I can add terms to the native spellchecker dictionary
2. The default, familiar browser style marking of spelling mistakes is used

Both are visible in [this ckeditor5 issue](https://github.com/ckeditor/ckeditor5/issues/9012)

Also here's a screenshot of both visible while writing this ticket:

> vvvvvvvvvvvvvvvvSCREENSHOTvvvvvvvvvvvvvvvv
> ![Image](https://github.com/user-attachments/assets/4abc9203-bd9e-4798-8a73-087880283b6c)
> ^^^^^^^^^^^^^SCREENSHOT^^^^^^^^^^^^^

**Actual behavior**

1. Adding terms to dictionary via context menu when right clicking on typos is not being offered
2. Nonstandard style to mark typos is used (pink background)

> vvvvvvvvvvvvvvvvSCREENSHOTvvvvvvvvvvvvvvvv
![Image](https://github.com/user-attachments/assets/7dd96f8b-8d1a-4d1e-98a2-136324e0c7fd)
> ^^^^^^^^^^^^^SCREENSHOT^^^^^^^^^^^^^

**Version information**
- Current CDN version
- Windows Chrome and Firefox

Contributor guide

Open the contributing guide

Research direction

Start with the provided StackBlitz reproduction and the EasyMDE configuration options `spellChecker` and `nativeSpellchecker`. Trace how those options affect the editor's browser spellcheck behavior, then verify that native typo styling and the dictionary context-menu action work in Chrome and Firefox.

Written by the indexing model from the issue text.

Assessment

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

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.