21b39ca467
TNL-1898 Also adds a generic paginated list view and Teams list view. The common PaginatedView takes a collection and a view class for its items and creates a header and footer with correct pagination. The topics list view is refactored to use this generic view. Authors: - Peter Fogg <pfogg@edx.org> - Daniel Friedman <dfriedman58@gmail.com>
84 lines
4.2 KiB
JavaScript
84 lines
4.2 KiB
JavaScript
(function (define) {
|
|
'use strict';
|
|
|
|
define(['jquery',
|
|
'underscore',
|
|
'backbone',
|
|
'js/components/card/views/card'
|
|
],
|
|
function($, _, Backbone, CardView) {
|
|
|
|
describe('card component view', function () {
|
|
it('can render itself as a square card', function () {
|
|
var view = new CardView({ configuration: 'square_card' });
|
|
expect(view.$el).toHaveClass('square-card');
|
|
expect(view.$el.find('.wrapper-card-meta .action').length).toBe(1);
|
|
});
|
|
|
|
it('can render itself as a list card', function () {
|
|
var view = new CardView({ configuration: 'list_card' });
|
|
expect(view.$el).toHaveClass('list-card');
|
|
expect(view.$el.find('.wrapper-card-core .action').length).toBe(1);
|
|
});
|
|
|
|
it('renders a pennant only if the pennant value is truthy', function () {
|
|
var view = new (CardView.extend({ pennant: '' }))();
|
|
expect(view.$el.find('.card-type').length).toBe(0);
|
|
view = new (CardView.extend({ pennant: 'Test Pennant' }))();
|
|
expect(view.$el.find('.card-type').length).toBe(1);
|
|
});
|
|
|
|
it('can render child views', function () {
|
|
var testChildView = new (Backbone.View.extend({ className: 'test-view' }))();
|
|
spyOn(testChildView, 'render');
|
|
var view = new (CardView.extend({ details: [testChildView] }))();
|
|
expect(testChildView.render).toHaveBeenCalled();
|
|
expect(view.$el.find('.test-view')).toHaveClass('meta-detail');
|
|
});
|
|
|
|
it('calls action when clicked', function () {
|
|
spyOn(CardView.prototype, 'action');
|
|
var view = new CardView({ configuration: 'square_card' });
|
|
view.$el.find('.action').trigger('click');
|
|
expect(view.action).toHaveBeenCalled();
|
|
});
|
|
|
|
var verifyContent = function (view) {
|
|
expect(view.$el).toHaveClass('test-card');
|
|
expect(view.$el.find('.card-type').text()).toContain('Pennant');
|
|
expect(view.$el.find('.card-title').text()).toContain('A test title');
|
|
expect(view.$el.find('.card-description').text()).toContain('A test description');
|
|
expect(view.$el.find('.action')).toHaveClass('test-action');
|
|
expect(view.$el.find('.action')).toHaveAttr('href', 'www.example.com');
|
|
expect(view.$el.find('.action').text()).toContain('A test action');
|
|
};
|
|
|
|
it('can have strings for cardClass, pennant, title, description, and action', function () {
|
|
var view = new (CardView.extend({
|
|
cardClass: 'test-card',
|
|
pennant: 'Pennant',
|
|
title: 'A test title',
|
|
description: 'A test description',
|
|
actionClass: 'test-action',
|
|
actionUrl: 'www.example.com',
|
|
actionContent: 'A test action'
|
|
}))();
|
|
verifyContent(view);
|
|
});
|
|
|
|
it('can have functions for cardClass, pennant, title, description, and action', function () {
|
|
var view = new (CardView.extend({
|
|
cardClass: function () { return 'test-card'; },
|
|
pennant: function () { return 'Pennant'; },
|
|
title: function () { return 'A test title'; },
|
|
description: function () { return 'A test description'; },
|
|
actionClass: function () { return 'test-action'; },
|
|
actionUrl: function () { return 'www.example.com'; },
|
|
actionContent: function () { return 'A test action'; }
|
|
}));
|
|
verifyContent(view);
|
|
});
|
|
});
|
|
});
|
|
}).call(this, define || RequireJS.define);
|