Как я могу проверить этот код с помощью жасмина?

Question

Я собираюсь создать виджет, и я хочу использовать Jasmine для проверки кода, и одна из вещей, которые я хочу проверить, заключается в том, что был вызван changeHtml. Вот приблизительный пример того, как я планировал создавать виджет.

var widget = function(userOptions){ 
    var options = userOptions 

    var init = function(){ 
    changeHtml(); 
    }; 

    var changeHtml = function(){ 
    document.getElementById(options.widgetId).innerHTML = 'New and exiting things!'; 
    }; 

    init(); 
}; 

var myWidget = new widget({widgetId: 'widget-div'}); 

Теперь, потому что changeHtml() частная (правильная фраза?) Функция widget, я не могу следить за ним, чтобы увидеть, если она была вызвана или нет.

Единственное, что я могу представить на данный момент, - это сделать общедоступный метод widget, но это не кажется особенно хорошим, потому что пользователю не нужно/не хотеть звонить changeHtml().

Что было бы для этого решением? Или я думаю об этом не так, было бы лучше проверить, действительно ли divs innerHTML был изменен, а не вызываемой функции?

Answer 1

Либо 1) проверьте конечный результат, либо 2) spyOn функции, которые были открыты в функциях/объектах.

Чтобы проверить конечный результат в вашем сценарии, вам нужно будет либо проверить значение HTML после его изменения, или проверить, что он был назван так что значение может быть установлено, например:

describe("widget", function() { 
    it("Should change html", function() { 
     // Arrange 
     spyOn(document, "getElementById").and.callThrough(); 

     // Act 
     var myWidget = new widget({ widgetId: 'widget-div' }); 

     // Assert 
     expect(document.getElementById).toHaveBeenCalled(); 
    }); 
});