Skip to main content

SpellChecker

Electron has built-in support for Chromium's spellchecker since Electron 8. On Windows and Linux this is powered by Hunspell dictionaries, and on macOS it makes use of the native spellchecker APIs.

How to enable the spellchecker?​

For Electron 9 and higher the spellchecker is enabled by default. For Electron 8 you need to enable it in webPreferences.

const myWindow = new BrowserWindow({
  webPreferences: {
    spellcheck: true
  }
})

How to set the languages the spellchecker uses?​

On macOS as we use the native APIs there is no way to set the language that the spellchecker uses. By default on macOS the native spellchecker will automatically detect the language being used for you.

For Windows and Linux there are a few Electron APIs you should use to set the languages for the spellchecker.

// Sets the spellchecker to check English US and French
myWindow.webContents.session.setSpellCheckerLanguages(['en-US', 'fr'])

// An array of all available language codes
const possibleLanguages = myWindow.webContents.session.availableSpellCheckerLanguages

By default the spellchecker will enable the language matching the current OS locale.

How do I put the results of the spellchecker in my context menu?​

All the required information to generate a context menu is provided in the context-menu event on each webContents instance. A small example of how to make a context menu with this information is provided below.

const { Menu, MenuItem } = require('electron')

myWindow.webContents.on('context-menu', (event, params) => {
  const menu = new Menu()

  // Add each spelling suggestion
  for (const suggestion of params.dictionarySuggestions) {
    menu.append(new MenuItem({
      label: suggestion,
      click: () => myWindow.webContents.replaceMisspelling(suggestion)
    }))
  }

  // Allow users to add the misspelled word to the dictionary
  if (params.misspelledWord) {
    menu.append(
      new MenuItem({
        label: 'Add to dictionary',
        click: () => myWindow.webContents.session.addWordToSpellCheckerDictionary(params.misspelledWord)
      })
    )
  }

  menu.popup()
})

Does the spellchecker use any Google services?