<ul dir="auto">
<li>Electron version: Latest</li>
<li>Operating system: OSX, Windows</li>
</ul>
<p dir="auto">I've been rebuilding the spellchecker for <a href="www.notion.so/desktop">notion.so</a> and I thought I would compile some of the quirks I ran into.</p>
<p dir="auto">The de facto solution right now is to use <a href="https://github.com/electron-userland/electron-spellchecker">electron-spellchecker</a> and we've been using it for the past year, but recently the language auto-detect stopped working on Mac. Probably a recent OS update or something. Slack has language select in their settings menu so I'd imagine fixing this issue isn't such a high priority for them (I believe the maintainer works there ;).</p>
<p dir="auto">So I went about building my own solution that uses <a href="https://github.com/dachev/node-cld">node-cld</a> to detect the language on <code class="notranslate">selectionchange</code> events and <a href="https://github.com/atom/node-spellchecker">node-spellchecker</a> to access native spellcheck APIs on MacOS and Window 8+. Here are some feature requests:</p>
<ul dir="auto">
<li>
<p dir="auto">Async <a href="https://github.com/electron/electron/blob/master/docs/api/web-frame.md#webframesetspellcheckproviderlanguage-autocorrectword-provider"><code class="notranslate">webFrame.setSpellCheckProvider</code></a> <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="264038860" data-permission-text="Title is private" data-url="https://github.com/electron/electron/issues/10734" data-hovercard-type="issue" data-hovercard-url="/electron/electron/issues/10734/hovercard" href="https://github.com/electron/electron/issues/10734">#10734</a> -- if we could throttle spellcheck to wait for users to stop typing, there would be a lot less jank and feel a lot more performant.</p>
</li>
<li>
<p dir="auto"><code class="notranslate">webFrame.checkSpelling(elm: HTMLElement)</code> -- currently, a user has to move their selection through an editable element before the spellchecker will run. It would be nice if we could trigger this manually.</p>
</li>
<li>
<p dir="auto"><a href="https://github.com/electron/electron/blob/master/docs/api/web-contents.md#contentsreplacemisspellingtext"><code class="notranslate">webContents.replaceMisspelling</code></a> doesn't remove misspelling underline -- The <code class="notranslate">webFrame.checkSpelling</code> API could be a simple workaround to fix this.</p>
</li>
<li>
<p dir="auto">Multi-language support is not quite possible because the <a href="https://github.com/electron/electron/blob/master/docs/api/web-frame.md#webframesetspellcheckproviderlanguage-autocorrectword-provider"><code class="notranslate">webFrame.setSpellCheckProvider</code></a> API only lets you check one word at a time. Thus you cannot have multiple languages in the same input because it needs to decide on only one language. One solution is for the API to pass the entire textContent and return a list of selections that are misspelled.</p>
</li>
<li>
<p dir="auto">Tangentially related: <code class="notranslate">node-spellchecker</code> has <code class="notranslate">Add to Dictionary</code> and <code class="notranslate">Remove from Dictionary</code> support, but it doesn't have <code class="notranslate">isAddedToDictionary</code> so its hard to know when to show the <code class="notranslate">Remove from Dictionary</code> option in the context menu.</p>
</li>
</ul>
<p dir="auto">Finally, I just want to highlight how good the Google Chrome spellchecker is. It handles language detection with multiple languages in the same input. Its asynchronous and non-blocking. It has all the native dictionary support. If we were able to pull the Google Chrome spellchecker into Chromium, then all the Electron-based note taking apps and email clients would benefit greatly. <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="113271622" data-permission-text="Title is private" data-url="https://github.com/electron/electron/issues/3211" data-hovercard-type="issue" data-hovercard-url="/electron/electron/issues/3211/hovercard" href="https://github.com/electron/electron/issues/3211">#3211</a></p>
<p dir="auto">CC: <a class="user-mention notranslate" data-hovercard-type="user" data-hovercard-url="/users/paulcbetts/hovercard" data-octo-click="hovercard-link-click" data-octo-dimensions="link_type:self" href="https://github.com/paulcbetts">@paulcbetts</a></p>
<p dir="auto">Thanks!</p>
<p dir="auto">On OS X apart from the basic spell-checking it also provides a "Spelling and Grammar" menu that allows some more advanced operations:<br>
<a target="_blank" rel="noopener noreferrer nofollow" href="https://cloud.githubusercontent.com/assets/639601/10719716/bff72fd4-7bc8-11e5-9b97-980e9a75dd91.png"><img width="666" alt="screen shot 2015-10-26 at 10 02 39 am" src="https://cloud.githubusercontent.com/assets/639601/10719716/bff72fd4-7bc8-11e5-9b97-980e9a75dd91.png" style="max-width: 100%;"></a></p>
<p dir="auto">Chrome browser has implemented most of the features, we should find a way to make Electron apps use it without any pain.</p>