How to setup debugging with Ruby on Rails on VS Code

debugging-setup-vscode.md

Debugging Ruby on Rails with VS Code

1. Add to your Gemfile and bundle install --binstubs (then run rails app:update:bin to fix bundler overwriting Rails 5 default bin stub).

group :development do
  gem 'ruby-debug-ide'
  gem 'debase'

  # If you want some nice documentation, 
  # refactoring support, etc too:
  gem 'solargraph', require: false
  gem 'rdoc', require: false
end

2. Run:

$ solargraph config
Configuration file initialized.
$ solargraph bundle

3. Add the Solargraph extension to VS Code (it may be part of the Ruby or Rails extension bundles).

4. Open VS Code's settings, then click the button in the top right (looks like a document with an arrow - tooltip about editing JSON) and add the following line:

"solargraph.commandPath": "/Users/andy/.rbenv/shims/solargraph"

5. Edit your .solargraph.yml config and change the require: [] line to be (from castwide/solargraph#87):

require:
- actioncable
- actionmailer
- actionpack
- actionview
- activejob
- activemodel
- activerecord
- activestorage
- activesupport

6. Go to the debug section of VS Code (Cmd+Shift+D or click it in the left bar), then the little cog to configure how to run the debug server.

7. In the launch.json that is now opened, paste:

{
  "version": "0.2.0",
  "configurations": [
      {
          "name": "Debug Rails server",
          "type": "Ruby",
          "request": "launch",
          "cwd": "${workspaceRoot}",
          "useBundler": true,
          "pathToRDebugIDE": "${workspaceRoot}/bin/rdebug-ide",
          "program": "${workspaceRoot}/bin/rails",
          "args": [
              "server",
              "-p",
              "3000"
          ]
      },
  ]
}

8. Now you can set breakpoints in your code, go to the Debug tab in VS Code and click the play button alongside Debug Rails server, hit the pages in your browser then debug like a normal IDE.