Как проверить, что событие в режиме «Магистральное представление» добавляет элемент в коллекцию?

Question

Я пытаюсь чертежу обработчик событий нажмите на следующей точки зрения Backbone:

class ItemView extends Backbone.View 
    events: 
    "click": "addToCurrentlyFocusedList" 

    addToCurrentlyFocusedList: (e) => 
    window.currentlyFocusedList.add @model 

Это то, что у меня есть:

describe "ItemView", -> 
    beforeEach -> 
    @item = new Backbone.Model 
     id: 1 
     name: "Item 1" 
    @view = new ItemView model: @item 

    describe "when clicked", -> 
    it "adds the item to the currently focused list", -> 
     window.currentlyFocusedList = sinon.stub() 
     window.currentlyFocusedList.add = sinon.stub() 
     @view.$el.trigger "click" 
     expect(window.currentlyFocusedList.add).toHaveBeenCalledWith @item 

Это работает, но это беспокоит меня по какой-то причине. Может быть, это слишком похоже на то, что я тестирую реализацию.

Одно возможное улучшение я могу видеть, движется обработчик события нажатия, спецификации, и currentlyFocusedList в новое представление под названием AppView:

describe "AppView", -> 
    beforeEach -> 
    @view = new AppView 

    it "adds a clicked item to the currently focused list", -> 
    $clickedItem = @view.$(".item:first") 
    $clickedItem.trigger "click" 
    expect(@view.currentlyFocusedList.pluck('id')).toInclude $clickedItem.attr('data-id') 

Приятно, что это также удаляет загрязнения window. Он также проверяет, что элемент действительно добавлен в коллекцию. Что в стороне, перемещает обработчик события и spec в AppView лучше, чем мой первый подход? Есть ли лучший способ сделать это?

Answer 1

Я бы заштриховал window.currentlyFocusedList с манекеном Collection и проверил, что он там был добавлен. Что-то вдоль этих линий:

beforeEach -> 
    @collection = new Backbone.Collection() 
    spyOn(window, 'currentlyFocusedList').andReturn @collection 

it "adds the item to the collection", -> 
    @view.$el.click() 
    expect(@collection).toInclude @item 

Это проверяет, что ваш код фактически делает; код того, как добавление элемента в коллекцию влияет на представление, живет где-то в другом месте, и должен быть проверен где-то в другом месте.