Skip to content
Go to file

Latest commit


Git stats


Failed to load latest commit information.
Latest commit message
Commit time


Gem Version

irb (interactive ruby) for Opal (Ruby running on javascript). This is interactive console (REPL) on a webpage. Good for testing Opal/ruby interactively without having to install anything. Intended to be part of a browser based interactive development tool for Opal

Try it here:

Embedded example

Original based port

Instructional Media





  • Opal irb in your browser
  • Command history - up/down arrows, ctrl-n/ctrl-p
  • Multiline support - ctrl-m to enter editor, ctrl-Enter to submit code
  • Colorized output
  • Access last returned value via $_
  • Shareable code links like this
    • create links by hitting ctrl-L and the lines/multilines will be made into a shareable link
    • also can create links using the history number, i.e. irb_link_for 2
  • Emacs keystrokes like all GNU readline apps (original irb included)
  • 100% HTML and JavaScript


Embedding into opal apps


Embedding into lissio app, as made by lissio new

  • add to Gemfile opal-irb
# gem 'opal-irb', '0.7.0' for Opal 0.7.*
# gem 'opal-irb', '0.8.*' for Opal 0.8.*
# For latest do below
gem 'opal-irb', github: 'fkchang/opal-irb'
  • invoke app to require opal-jquery and opal-irb
lissio start --require opal-irb
  • add a helper which includes the jquery and codemirror requirements
 <%= OpalIrbUtils.include_opal_irb_jqconsole_requirements %>
  • change the require in app/app.rb -- order matters, at the moment to have opal-jquery and opal-browser coexist you need to load opal-jquery before loading lissio
require 'opal'
require 'jqconsole'                     # add these 3 jqconsole support
require 'opal_irb_jqconsole_css'        # css for opal_irb_jqconsole_css
require 'opal_irb_jqconsole'            # the console code
require 'lissio'
  • override Application#start() to create a button and hook up opal-irb
  def start
    element << DOM do
      button.show_irb! "Show Irb"

  • profit!


    # gem 'opal-irb', '0.7.0' for Opal 0.7.*
    # gem 'opal-irb', '0.8.*' for Opal 0.8.*
    # For latest do below
    gem 'opal-irb', github: 'fkchang/opal-irb', require: 'opal-irb-rails'
    gem 'jquery-ui-rails'
  • include stylesheets in application.css.scss
/*= require_self
 *= require jquery-ui/dialog
 *= require opal-irb/jqconsole
  • include jquery UI dialog in application.js
    • for Opal 0.7.0 if you have kept application.js vs converting to application.js.rb
//= require jquery-ui/dialog
  • for Opal 0.8.0, you must create application.js.rb or else you are forced to load the opal modules by hand
require 'jquery-ui/dialog'
  • include codemirror js/css, you can pull from CDN w/the below in your template (haml example below)
= OpalIrbUtils.include_code_mirror.html_safe
  • Set it up in opal code

    • Example that creates a bottom panel, a button to bring it up
    require 'opal_irb_jqconsole'

    # opal-browser code to add a button
    $document["#workarea"] << DOM do
      button.show_irb! "Show Irb"
    # opal-jquery code to add a button
    Element.find(".main").append "<button class='btn' id='show_irb'>Show Irb</button>"

    # creates a panel at the bottom
    # adds open panel behavior to element w/id show_irb
  • Example that creates a bottom panel, makes a hot key "shift-command-c" to toggle the panel
    OpalIrbJqconsole.add_hot_key_panel_behavior(modifiers: %w(meta shift), key: "c")
  • profit!


  • opal - of course
  • opal-jquery (would like to do away with this, don't need it)
    • jquery (cuz of the above)
    • jquery-ui dialog - for the code dial
  • code mirror - for code editing
  • opal-browser (so you can use it from opal-irb) OPTIONAL, it's used in the examples but it can be deployed without opal-browser, esp. since Rails defaults to using jquery and opal-browser and opal-jquery have a lot of overlap, and some small conflicts

Version Scheme

While in my mind there are a lot of things that keep opal-irb at not yet suitable to be a gem/ 0.1.0 version number, I frequently have to change code to support the latest minor release for Opal, so I think I need to adopt a scheme that tracks such. So the 1st gem release will be 0.7.0, to indicate compatibility with 0.7.* versions of opal, followed fairly quickly with a 0.8.0 release to match 0.8.0 the current version (at time of writing) of opal.


  • Figure out how to keep variables -- DONE 6/10/2013, thx @adambeynon
  • have it automatically know when a complete ruby expression is there instead of multi line mode like irb -- CLOSE ENOUGH 6/21/2013 via jqconsole
  • Make a gem - DONE 6/23/2013 1st for use in opal-inspector, made into a bonafide gem 9/1/15
  • Hook into smalltalk style object browser for opal that I plan to write - STARTED
  • Some demos to show how convenient it can be - DONE 7/19/2013 - you tube video overview
  • Add more irb/pry functionality
    • tab completion - DONE
    • cd ls
    • show source via source maps and opal-inspector
  • Make embeddable in any app STARTED 7/30/2013, made embeddable into lisso 2/4/2014
  • print out inspect in ruby format
  • Rails plugin - WORK done on 8/27/14, works w/opal rails and assets, need to document
  • navigate stacktrace code via source maps
  • remove jquery dependancy -- need to convert jqconsole, and remove the the jquery-ui dialog
  • split up dependancy and hierarchy, jquery and jquery free versions, rails vs no rails, etc.


IRB (interactive ruby) for Opal




No packages published


You can’t perform that action at this time.