Built in support for spell check suggestions

[jwheare]

Would make this a more attractive replacement for https://github.com/mixmaxhq/electron-editor-context-menu and should be simple enough to add.

e.g. https://github.com/mixmaxhq/electron-editor-context-menu/blob/d1703f7b7e4523af8c9c088d4a1efc06e2dc3b12/src/index.js#L93

---

IssueHunt Summary

nautatva has been rewarded.

Backers (Total: $100.00)

• issuehunt ($100.00)

Submitted pull Requests

• #94 Feature:Builtin support for spellcheck suggestions

---

Tips

• Checkout the Issuehunt explorer to discover more funded issues.
• Need some help from other developers? Add your repositories on IssueHunt to raise funds.

---

IssueHunt has been backed by the following sponsors. Become a sponsor

[sindresorhus]

👍 Interested in doing a pull request?

Should try to require electron-spellchecker and if it's a dependency, use it. We don't want that module as a direct dependency, as it's heavy and not everyone needs it. So we instead let people add it as a dependency if they need and it will just work.

[jwheare]

Yup, currently working on splicing it in with prepend. Will see about a more integrated PR once I've got that working. There's a bit of inter process fiddling required I think.

[jwheare]

I fetched up ripping out what I needed and removing this dependency in the end.

https://github.com/irccloud/irccloud-desktop/blob/54174cc142db1bf236f0196e55acaaf986f976b0/app/context_menu.js

The spelling suggestions integration is done with an ipcRenderer.send from the renderer process (where the spellcheck provider has to be registered)
https://github.com/irccloud/irccloud-desktop/blob/54174cc142db1bf236f0196e55acaaf986f976b0/app/preload.js#L17

---

A few other things to note that I added, in case you fancy extending this package in future with any of them, or if others are interested (not all possible with the current append/prepend hooks)

• Opening links in browser
• Link downloading
• Image URL copying
• Save as from Add a saveAs option to prompt a dialog instead of downloading immediately electron-dl#4
• Inspector changes mentioned in Add a showInspectElement option to allow manually toggling Inspect Element #10
• Services menu on macOS
• Added a short timeout before popping up the context menu, to allow for the selection change to register

[sindresorhus]

Cool. Thanks for the ideas. Some of that does make sense.

To make this module more easily extendable I'm thinking of a system where you can mix custom items with the provided ones:

require('electron-context-menu')({
    menu: x => [
        x.COPY,
        {
            title: 'foo'
        },
        x.INSPECT
    ]
});

Where x.COPY is a Symbol.

Continued in #14

Regardless of you using it, what do you think about it?

[jwheare]

Yeah that would be handy. If I could reuse your cut/copy/paste symbols and build the whole menu myself, while still using your separator filtering that'd be better. Just having more exports for the different stages would be a good start.

[djalmaaraujo]

There's no easy way to integrate https://github.com/electron-userland/electron-spellchecker with this module.

[sindresorhus]

@djalmaaraujo It is possible, it's just that electron-spellchecker is not very well documented. You could use: https://github.com/electron-userland/electron-spellchecker/blob/d457b6722b0748a6c2aa23f9a0fdac7d6d296fe0/src/spell-check-handler.js#L471

Relevant issue: electron-userland/electron-spellchecker#80

[djalmaaraujo]

@sindresorhus The docs are very bad indeed. This method you mentioned would check if a word is misspelled, but return the suggestions to this the context-menu, is a different thing. It's not related to this issue anyway. tks

[djalmaaraujo]

@sindresorhus I figured out by using one context menu for all the things (this module) and the other just for spellcheck:

In the electron-context-menu config, you can use:

shouldShowMenu: (event, params) => !params.misspelledWord,

And on the electron-spellchecker you can use:

let contextMenuListener = new ContextMenuListener((info) => {
  if (!info.misspelledWord) return;

  contextMenuBuilder.showPopupMenu(info);
});

Doing this one can exclude the other in the correct context.

@jwheare

[djalmaaraujo]

@sindresorhus With my answer above, I think you can call "built-in support" something that is true. :). I would close this issue.

[sindresorhus]

@djalmaaraujo That's not a proper solution though. I plan on having spell-checking integrated into this context menu.

[snene]

@djalmaaraujo Were you actually able to use both electron-context-menu and electron-spellchecker together and display the correct context menu using the solution you mentioned? I tried that and I am not able to.

When I right click on the misspelled word then first I get the application context menu and then I have to click again to get the spell checker context menu. Any help or pointers?

[djalmaaraujo]

@snene I used both, if I click on the text, I get the suggestions and IGNORE the next context-menu, so I don't end up having 2.

shouldShowMenu: (event, params) => !params.misspelledWord,

This will prevent electron-context-menu from opening the context-menu. Try to read again my previous comment and I think you will get the idea.

[snene]

Thanks @djalmaaraujo ! It worked for me too. It's a great workaround. I just needed to get the latest version of electron-context-menu. Thanks again!

[IssueHuntBot]

@IssueHunt has funded $100.00 to this issue.

---

• Submit pull request via IssueHunt to receive this reward.
• Want to contribute? Chip in to this issue via IssueHunt.
• Checkout the IssueHunt Issue Explorer to see more funded issues.
• Need help from developers? Add your repository on IssueHunt to raise funds.

[janat08]

So the original plan stands, detect if spell checker is loaded, and then show one or other?

[sindresorhus]

This should be easier to implement in Electron 8. There's now a spellcheck option in BrowserWindow (which indicates misspelled words with a red squiggly line) and https://github.com/electron/electron/pull/20897/files#diff-9b078be8f43e00e3b99edb5be31fa353R573 to get the suggested replacements.

Here's how it should look:

See: https://www.electronjs.org/blog/electron-8-0#highlight-features

[djalmaaraujo]

@buzinas @philfreo ☝️

[SterlingChin]

Watching this issue

[issuehunt-oss]

@sindresorhus has rewarded $90.00 to @nautatva. See it on IssueHunt

• 💰 Total deposit: $100.00
• 🎉 Repository reward(0%): $0.00
• 🔧 Service fee(10%): $10.00