Easy Javascript Validation with Javascript Lint For Rails Testing

I found this great Javascript Lint tool. It checks for common(missing semicolons) and not so common(use of the void type) javascript errors. A full featured Selenium test suite would be the ideal for full javascript testing coverage but Javascript Lint is a no hassle addition.

I wrote a simple Rails integration test case to scan all the javascript files in the public/javascripts folder. Download the javascript lint tool and add the file below to your integration test suite. You easily adapt this to Rspec if you would like.


require 'test_helper'

class JavascriptTest < ActionController::IntegrationTest
  # Download jsl from http://www.javascriptlint.com and add the jsl to your PATH environment variable
  def setup
    @js_paths = File.join(Rails.root, 'public', 'javascripts', '*.js')
  end

  test "validate javascript files for errors" do
    Dir[@js_paths].each do |js_path|
      output = %x[jsl -process #{js_path}]

      is_valid_js_file = output.include?("0 error(s)") ?  true : false
      assert(is_valid_js_file, "JSLint on #{js_path} should return no errors: \n #{output}")
    end
  end
end

Here’s an example of the error output:


  2) Failure:
test_validate_javascript_files_for_errors(JavascriptTest)
    [/test/integration/javascript_test.rb:14:in `test_validate_javascript_files_for_errors'
     /test/integration/javascript_test.rb:10:in `each'
     /test/integration/javascript_test.rb:10:in `test_validate_javascript_files_for_errors']:
JSLint on ..../public/javascripts/application.js should return no errors:
 JavaScript Lint 0.3.0 (JavaScript-C 1.5 2004-09-24)
Developed by Matthias Miller (http://www.JavaScriptLint.com)

application.js
.../public/javascripts/application.js(3): lint warning: missing semicolon
        num = ;
........^

5 thoughts on “Easy Javascript Validation with Javascript Lint For Rails Testing

  1. Benjamin Quorning

    Nice! I implemented it in RSpec. Not that pretty, but it works:


    # spec/lib/javascript_spec.rb
    require File.expand_path(File.dirname(__FILE__) + '/../spec_helper')

    # Download jsl from http://www.javascriptlint.com and add the jsl to your PATH environment variable
    Dir[ File.join(Rails.root, 'public', 'javascripts', '*.js') ].each do |js_path|
    describe "JSLint on #{js_path}" do
    before { @it = %x[jsl -process #{js_path}] }
    specify { @it.should include_text('0 error(s)') }
    end
    end

    Reply
  2. Maxim Kulkin

    The more natural would be to have a separate test for each javascript file:

    Dir[Rails.root+'/public/javascripts/*.js].each do |js|
    test “javascript #{js} contains no syntax errors” do
    assert_js_valid js
    end
    end

    def assert_js_valid(js_path)
    output = system(“jsl -process #{js_path}”)
    valid = output.include?(’0 error(s)’)
    assert valid, “Javascript #{js_path} contains following errors:\n#{output}”
    end

    Reply
  3. Danny

    I’m working on a very big project containing lots of javascript, so we started putting them into subdirectories. Based on what Maxim wrote I created the following. Note that I only care about semicolons (for minimizing), so I made the assertion a little different, not to include warnings about ParseInt and stuff… I’m also using jspec for test driven javascript development and we really want to ignore that directory…

    def list(file_name)
    Dir.new(“#{file_name}”).each do |file|
    next if file.match(/^\.+/)
    path = “#{file_name}/#{file}”
    if FileTest.directory?(“#{path}”) && (path.scan(/spec/) == [])
    list(“#{path}”)
    else
    if File.extname(path) == “.js”
    puts path
    describe “JSLint on #{path}” do
    before {@it = %x[jsl -process #{path}]}
    specify {@it.should include_text(’0 error(s)’)}
    specify {@it.should_not include_text(‘lint warning: missing semicolon’)}
    end
    end
    end
    end
    end

    list(File.join(Rails.root, ‘public’, ‘javascripts/refactored’))

    Reply

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s