Introduction#

Last year, I have written a post on how to edit texts inside the browser using Vim/Nvim or browser extensions that have Vim emulations. However, none of them is good enough, since they are either not convenient to use or lacking features compared to real Neovim empowered by various plugins.

Firenvim is another project that aims to solve the problem and has done a great job. Thanks to Neovim’s remote UI architecture¹, firenvim activate a Neovim instance in the background and acts as a remote UI client for Neovim. Thus, you can use the full power of Neovim and its plugins inside your browser without any compromises.

Install#

To use firenvim, first we need to install it as a Neovim plugin using a plugin manager, for example, with vim-plug:

Plug 'glacambre/firenvim', { 'do': { _ -> firenvim#install(0) } }

If you use packer.nvim, the following works:

use({
  "glacambre/firenvim",
  run = function() fn["firenvim#install"](0) end,
  opt = true,
  setup = [[vim.cmd('packadd firenvim')]],
})

The above setting works for Windows and Linux. For macOS, due to the reason that $PATH variable is changed inside browser, we need to run the following command on the command line:

nvim --headless -c "call firenvim#install(0, 'export PATH=\"$PATH\"')" -c quit

After that, we need to install firenvim extension for Firefox or Chrome.

Now, restart your browser. Click a text area and firenvim should be able to automatically take over the text area and start a neovim instance.

Custom settings#

Firenvim provides the variable g:started_by_firenvim when it starts a neovim instance. So you can use this variable to set conditional options and settings for firenvim. For example, set laststatus to zero, and do not show ruler, since the text area is already very small.

You can also customize the filetype created for each website, as per the doc here.

My custom settings for firenvim are as follows:

if exists('g:started_by_firenvim') && g:started_by_firenvim
  " general config for firenvim
  let g:firenvim_config = {
      \ 'globalSettings': {
          \ 'alt': 'all',
      \  },
      \ 'localSettings': {
          \ '.*': {
              \ 'cmdline': 'neovim',
              \ 'priority': 0,
              \ 'selector': 'textarea',
              \ 'takeover': 'never',
          \ },
      \ }
  \ }

  function! s:setup_firenvim() abort
    set filetype=markdown
    set noruler noshowcmd
    set laststatus=0 showtabline=0
  endfunction

  augroup firenvim
    autocmd!
    autocmd FileType text call s:setup_firenvim()
  augroup END
endif

For more configurations, check the doc on project page.

References#

• https://www.reddit.com/r/neovim/comments/bmguyj/embed_neovim_in_your_browser/
• https://www.reddit.com/r/neovim/comments/d9gk5y/firenvim_has_been_released_on_the_chrome_web_store/
• Firenvim does not work properly on macOS?
  • https://github.com/glacambre/firenvim/issues/122
  • Trouble shooting on macOS.