Тестовый вывод Backbone.View отличается от вывода консоли - PullRequest
Новая
       15

Тестовый вывод Backbone.View отличается от вывода консоли

1 голос
/ 03 ноября 2011

Я не понимаю операций Backbone.View.render () и .el. В render () я назначаю this.el свойства, поддерживающие выход, который я ожидаю увидеть, эти свойства находятся в this.el при тестировании, а .el возвращает ожидаемый результат в консоли. Но вывод не появляется в тестировании.

Вот код и тест (пожалуйста, чтобы не обращать внимания на грубость, я учусь и стараюсь держать тесты зелеными): 

var RowLabelData = Backbone.Model.extend({});

var RowLabel = Backbone.View.extend({
    initialize: function() {
           this.for_attr = this.model.get("for_attr");
           this.text_val = this.model.get("text_val");
           this.el.setAttribute("for", this.for_attr);
        },

    render: function() {
        $(this.el).html(this.text_val);
        return this;
        }
});

Я тестирую с помощью QUnit следующим образом: 

test_row_data   =   new RowLabelData({
                        for_attr: "id_username",
                        text_val: "Username:"
                    });
test_row_v      =   new RowLabel({
                        model: test_row_data,
                        tagName: 'label'
                    });
test_row_v.render();
test_row = test_row_v.el;

equal(test_row.textContent, "Username:");
equal(test_row.getAttribute("for"), "id_username");
// FAILS:
equal(test_row, '<label for="id_username">Username:</label>');

QUnit говорит, что в последнем тесте << test_row >> возвращает <label></label>. НО в консоли JavaScript << test_row >> возвращает ожидаемую строку в тексте.

Документы по магистрали говорят, что render () должен поместить желаемый HTML в el, но я пытаюсь использовать стандартное поведение render (), и оно работает в консоли. Почему это не работает в тесте?

1 Ответ

0 голосов
/ 03 ноября 2011

Дира прав, проблема в сравнении объекта со строкой.

Этот тестовый код создает аналогичный элемент, а затем преобразует его и тестовый объект в строки для сравнения: 

new_label = document.createElement("label");
new_label.setAttribute("for", "id_username");
t = document.createTextNode("Username:");
new_label.appendChild(t);

equal(
    $('<div>').append($(test_row).clone()).remove().html(),
    $('<div>').append($(new_label).clone()).remove().html(),
    "convoluted!"
);

Это проходит. Вывод на консоль этих ктулху-достойных заклинаний "<label for="id_username">Username:</label>".

Хотя это приближается к тем вещам, которые человек не должен знать, смелый или безрассудный может открыть эту тайную тайну здесь .

...