Tbpgr Blog

Employee Experience Engineer tbpgr(てぃーびー) のブログ

Ruby on Rails | konacha + ejsでCoffeeScriptのテスト内にHTMLのテンプレートを使用

概要

konacha + ejsでCoffeeScriptのテスト内にHTMLのテンプレートを使用

詳細

konacha + ejsでCoffeeScriptのテスト内にHTMLのテンプレートを使用します。

設定

Gemfileに以下を追加
gem "ejs", "~> 1.1.1"

サンプル

仕様

入力フォームをクリアする機能のテストを作成します。

spec/javascripts/templates/page.jst.ejs
<form action="post" id="test">
  <input id="text" type="text" value="text">
  <input id="password" type="password" value="password">
  <input id="hidden" type="hidden" value="hidden">
  <select id="select">
    <option value="1" selected>1</option>
    <option value="2">2</option>
    <option value="3">3</option>
  </select>
  <input type="checkbox" id="check" value="1" checked>
  <input type="checkbox" id="check" value="2">
  <input type="checkbox" id="check" value="3">
  <input type="radio" id="radio" value="1" checked>
  <input type="radio" id="radio" value="2">
  <textarea id="textarea" cols="30" rows="10">textarea</textarea>
</form>
spec/javascripts/spec_helper.js.coffee
#= require_tree ./templates
#= require jquery
#= require underscore
assets/javascripts/page.js.coffee
class @Page
  @clear_form: (f) ->
    _.each($(f).find(":input"), (elm) ->
      switch elm.type
        when 'password','select-multiple','select-one','text','textarea'
          $(elm).val("")
        when 'checkbox', 'radio'
          elm.checked = false
        when 'hidden'
        else
    )
spec/javascripts/page_spec.js.coffee
#= require spec_helper
#= require page
describe "Page.clear_form", ->
  it "Page.clear_form clear all inputs", ->
    # case
    $('body').html(JST['templates/page_clear_form']())

    # when
    Page.clear_form $('form')

    # then
    $("input#text").val().should.equal('');
    $("input#password").val().should.equal('');
    $("input#hidden").val().should.equal('hidden');
    $('input#textarea').text().should.equal('');
    _.each($('option'), (elm) ->
      elm.selected.should.equal(false)
    )
    _.each($('input#radio'), (elm) ->
      elm.checked.should.equal(false)
    )
    _.each($('input#check'), (elm) ->
      elm.checked.should.equal(false)
    )

結果

bundle exec rake konacha:run SPEC=page_spec.js.coffee 
.

Finished in 0.00 seconds
1 examples, 0 failed, 0 pending

GUI結果