Тестирование магистральных представлений с помощью jasmine

Я пытаюсь проверить свои основные представления с помощью jasmine. Я использую библиотеку подчеркивания для создания шаблонов для основных представлений.

Для тестирования я использую jasmine jasmine-jquery

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

Представление магистрали

AlbumView = Backbone.View.extend({
    template: _.template($('#album-template').html()),
    render: function() {
        $('#albums').append(this.template(this.model.attributes));
    }
});

В этом представлении используется следующий шаблон

Шаблон альбома Album_template.html.erb

<script type="text/html" id="album-template">
  <a href="<%%= url %>" class="album <%%= is_owner %>">
        <%% if (viewable) { %>
            <span class="album-cover">
                <span class="photo" style="background-image:url('<%%= small_thumbnail_url %>'); width: 160px; height: 160px;">
                    <span class="glossy-overlay"></span>
                </span>
            </span>
            <%% } %>
            <h3><%%= name %></h3>
            <p>
                <%%= number_of_photos %>
            </p>
    </a>
</script>

Магистральная модель

var Album = Backbone.Model.extend({
    initialize: function() {
        this.view = new AlbumView({model: this});
    },
    render: function() {
        this.view.render();
    }
});

Жасминовый тест - album_spec.js

describe('Album view', function(){

    beforeEach(function() {

        var album = new Album({
            "name": "Photo Stream",
             "url": "/albums/1",
            "id": "2",
            "number_of_photos": "172 Photos",
            "small_thumbnail_url": "/assets/sections/albums/covers/auto.png",
            "viewable": true,
            "is_owner": "owner"
        });

        loadFixtures('albums_fixture.html');

        this.view = new AlbumView();
        this.view.model = album;
        // loadFixtures('albums_fixture.html');

    });

    describe("Rendering", function() {

        it ("produces the correct HTML", function() {

            this.view.render();

            expect($("#albums")).toExist();
            expect(this.view.template).toBeDefined();

        });

    });

});

Эта спецификация загружает следующую фикстуру — album_fixture.html.

<div id="albums"> </div>

<script type="text/html" id="album-template">
  <a href="<%%= url %>" class="album <%%= is_owner %>">
        <%% if (viewable) { %>
            <span class="album-cover">
                <span class="photo" style="background-image:url('<%%= small_thumbnail_url %>'); width: 160px; height: 160px;">
                    <span class="glossy-overlay"></span>
                </span>
            </span>
            <%% } %>
            <h3><%%= name %></h3>
            <p>
                <%%= number_of_photos %>
            </p>
    </a>
</script>

Этот тест не проходит

ожидать(this.view.template).toBeDefined();

Приборы загружаются по мере прохождения этого теста expect($("#albums")).toExist();

Мой вопрос: как я могу загружать приборы, у которых есть представления со встроенным рубином? Мне удалось успешно протестировать модели и коллекции, но у меня возникли проблемы с тестированием представлений.


person vishal    schedule 04.10.2012    source источник


Ответы (1)


Эта строка:

template: _.template($('#album-template').html())

в вашем AlbumView будет выполняться, когда этот файл сценария загружается на страницу. Поскольку фикстура не добавляется на страницу до тех пор, пока спецификация не начнет выполняться, тег скрипта album-template еще не добавлен в DOM.

Если вы переписали свой атрибут template как метод, возвращающий результат вызова _.template, тогда он не будет искать тег скрипта, пока вы не попытаетесь вызвать шаблон. Это может выглядеть примерно так:

AlbumView = Backbone.View.extend({
    template: function() {
        return _.template($('#album-template').html());
    },
    render: function() {
        $('#albums').append(this.template()(this.model.attributes));
    }
});

Согласитесь, это как-то грубо. Другим вариантом было бы настроить шаблон подчеркивания в качестве ресурса, обслуживаемого конвейером ресурсов, и позволить jasmine-gem включить его на страницу перед загрузкой ваших представлений.

person Gregg    schedule 25.01.2014