CoffeeScript
jasmine

JSテストツールJasmineをCoffeeScriptで使う(少し応用的な使い方)

More than 5 years have passed since last update.

以下のSlideShareが大変参考になったので備忘を兼ねてCoffeeScript版を書いてみた。

JS開発におけるTDDと自動テストツール利用の勘所

http://www.slideshare.net/KojiNakamura/jstdd


目次


  • 1. Matcher概観

  • 2. beforeEach / afterEach

  • 3. Spy

  • 4. Async Test

  • 5. jQuery code test

1. Matcher概観


  • notで否定のMatcherとなる

  • expect(x).toEqual(y)

  • expect(x).not.toEqual(y)

  • expect(x).toBe(y)
    toBeは === による等値チェック

  • expect(x).toMatch(pattern)

  • expect(x).toBeDefined()

  • expect(x).toBeUndefined()

  • expect(x).toBeNull()

  • expect(x).toBeNaN()

  • expect(x).toBeTruthy()

  • expect(x).toBeFalsy()

  • expect(x).toContain(y)

  • expect(x).toBeLessThan(y)

  • expect(x).toBeGreaterThan(y)

  • expect(x).toBeCloseTo(y, precision)

  • expect(function(){fn();}).toThrow(e)

  • expect(spy).toHaveBeenCalled()

  • expect(spy).toHaveBeenCalledWith(arguments)

2. beforeEach / afterEach


jasmineBeforeEachAfterEachInCoffeeScript.coffee

# 「JS開発におけるTDDと自動テストツール利用の勘所 」より引用。

# http://www.slideshare.net/KojiNakamura/jstdd

describe "Object", ->

beforeEach ->
object = new MyObject

afterEach ->
# do something...

describe "#methodA", ->
it "should be ok", ->
expect(object.methodA()).toBeTruthy()

describe "#methodB", ->
it "should be ok", ->
expect(object.methodB).toBeTruthy()

describe "(context)", ->

beforeEach ->
object.someMethod()

describe "#methodC", ->
it "should be ok", ->
expect(object.methodC).toBeTruthy()


3. Spy


jasmineSpyOnCoffeeScript.coffee

# 「JS開発におけるTDDと自動テストツール利用の勘所 」より引用。

# http://www.slideshare.net/KojiNakamura/jstdd

it "should be called", ->
obj =
method: ->
spyOn obj, "method" # spyOnメソッドでオブジェクトの特定メソッドをスパイ化
obj.method()
expect(obj.method).toHaveBeenCalled() # spy用のMatcherが用意されている

test "should be called", ->
spy = jasmine.createSpy() # スパイ化された関数オブジェクトを作成する
spy()
expect(spy).toHaveBeenCalled()


4. Async Test


jasmineAsyncTestOnCoffeeScript.coffee

# 「JS開発におけるTDDと自動テストツール利用の勘所 」より引用。

# http://www.slideshare.net/KojiNakamura/jstdd

it "should be async", ->

# 非同期処理ブロックはruns()で定義される
runs ->
expect(true).toBeTruthy()

# waits()で次のブロック実行を、指定したミリ秒間保留する
waits(500)

spy = jasmine.createSpy()
runs ->
setTimeout spy, 1000

# waitsFor()はコールバックがtrueを返すまで、次のブロック実行を保留する
waitsFor ->
spy.callCount > 0

runs ->
expect(true).toBeTruthy()


5. jQuery code test


jQueryCodeTestWithJasmineInCoffeescript.coffee

# 「JS開発におけるTDDと自動テストツール利用の勘所 」より引用。

# http://www.slideshare.net/KojiNakamura/jstdd

# 元コード

$ ->
$("div li .button")
.on 'click', ->
$("div .contents").html("<span>"+$(this).data("mydata")+"</span>")

# テスト可能コード

$ ->
$("button") # HTML構造に依存しないidセレクタに変更
.on 'click', ->
clickHandler $("contents"), $(this).data("mydata")

clickHandler = (elm, data) ->
elm.html("<span>"+data+"</span>")

# テストコード

it "should call html() of passed element", ->
fakeObj =
html: jasmine.createSpy()
clickHandler(fakeObj, "hoge")
expect(fakeObj.html).toHaveBeenCalledWith("<span>hoge</span>")



ブログやってます:PAPA-tronix !