142 lines
6.5 KiB
JavaScript
142 lines
6.5 KiB
JavaScript
define(['jquery', 'edx-ui-toolkit/js/utils/spec-helpers/ajax-helpers', 'common/js/spec_helpers/template_helpers',
|
|
'common/js/spec_helpers/view_helpers', 'common/js/components/utils/view_utils', 'js/models/course',
|
|
'js/views/unit_outline', 'js/models/xblock_info'],
|
|
function($, AjaxHelpers, TemplateHelpers, ViewHelpers, ViewUtils,
|
|
Course, UnitOutlineView, XBlockInfo) {
|
|
'use strict';
|
|
|
|
describe('UnitOutlineView', function() {
|
|
var createUnitOutlineView, createMockXBlockInfo,
|
|
requests, model, unitOutlineView;
|
|
|
|
createUnitOutlineView = function(test, unitJSON, createOnly) {
|
|
requests = AjaxHelpers.requests(test);
|
|
model = new XBlockInfo(unitJSON, {parse: true});
|
|
unitOutlineView = new UnitOutlineView({
|
|
model: model,
|
|
el: $('.wrapper-unit-overview')
|
|
});
|
|
if (!createOnly) {
|
|
unitOutlineView.render();
|
|
}
|
|
return unitOutlineView;
|
|
};
|
|
|
|
createMockXBlockInfo = function(displayName) {
|
|
return {
|
|
id: 'mock-unit',
|
|
category: 'vertical',
|
|
display_name: displayName,
|
|
studio_url: '/container/mock-unit',
|
|
visibility_state: 'unscheduled',
|
|
ancestor_info: {
|
|
ancestors: [{
|
|
id: 'mock-subsection',
|
|
category: 'sequential',
|
|
display_name: 'Mock Subsection',
|
|
studio_url: '/course/mock-course?show=mock-subsection',
|
|
visibility_state: 'unscheduled',
|
|
child_info: {
|
|
category: 'vertical',
|
|
display_name: 'Unit',
|
|
children: [{
|
|
id: 'mock-unit',
|
|
category: 'vertical',
|
|
display_name: displayName,
|
|
studio_url: '/container/mock-unit',
|
|
visibility_state: 'unscheduled'
|
|
}, {
|
|
id: 'mock-unit-2',
|
|
category: 'vertical',
|
|
display_name: 'Mock Unit 2',
|
|
studio_url: '/container/mock-unit-2',
|
|
visibility_state: 'unscheduled'
|
|
}]
|
|
}
|
|
}, {
|
|
id: 'mock-section',
|
|
category: 'chapter',
|
|
display_name: 'Section',
|
|
studio_url: '/course/slashes:mock-course?show=mock-section',
|
|
visibility_state: 'unscheduled'
|
|
}, {
|
|
id: 'mock-course',
|
|
category: 'course',
|
|
display_name: 'Mock Course',
|
|
studio_url: '/course/mock-course',
|
|
visibility_state: 'unscheduled'
|
|
}]
|
|
},
|
|
metadata: {
|
|
display_name: 'Mock Unit'
|
|
}
|
|
};
|
|
};
|
|
|
|
beforeEach(function() {
|
|
window.course = new Course({
|
|
id: '5',
|
|
name: 'Course Name',
|
|
url_name: 'course_name',
|
|
org: 'course_org',
|
|
num: 'course_num',
|
|
revision: 'course_rev'
|
|
});
|
|
ViewHelpers.installMockAnalytics();
|
|
ViewHelpers.installViewTemplates();
|
|
TemplateHelpers.installTemplate('unit-outline');
|
|
appendSetFixtures('<div class="wrapper-unit-overview"></div>');
|
|
});
|
|
|
|
afterEach(function() {
|
|
delete window.course;
|
|
ViewHelpers.removeMockAnalytics();
|
|
});
|
|
|
|
it('can render itself', function() {
|
|
createUnitOutlineView(this, createMockXBlockInfo('Mock Unit'));
|
|
expect(unitOutlineView.$('.list-sections')).toExist();
|
|
expect(unitOutlineView.$('.list-subsections')).toExist();
|
|
expect(unitOutlineView.$('.list-units')).toExist();
|
|
});
|
|
|
|
it('highlights the current unit', function() {
|
|
createUnitOutlineView(this, createMockXBlockInfo('Mock Unit'));
|
|
$('.outline-unit').each(function(i) {
|
|
if ($(this).data('locator') === model.get('id')) {
|
|
expect($(this)).toHaveClass('is-current');
|
|
} else {
|
|
expect($(this)).not.toHaveClass('is-current');
|
|
}
|
|
});
|
|
});
|
|
|
|
it('can add a unit', function() {
|
|
var redirectSpy;
|
|
createUnitOutlineView(this, createMockXBlockInfo('Mock Unit'));
|
|
redirectSpy = spyOn(ViewUtils, 'redirect');
|
|
unitOutlineView.$('.outline-subsection > .outline-content > .add-unit .button-new').click();
|
|
AjaxHelpers.expectJsonRequest(requests, 'POST', '/xblock/', {
|
|
category: 'vertical',
|
|
display_name: 'Unit',
|
|
parent_locator: 'mock-subsection'
|
|
});
|
|
AjaxHelpers.respondWithJson(requests, {
|
|
locator: 'new-mock-unit',
|
|
courseKey: 'slashes:MockCourse'
|
|
});
|
|
expect(redirectSpy).toHaveBeenCalledWith('/container/new-mock-unit?action=new');
|
|
});
|
|
|
|
it('refreshes when the XBlockInfo model syncs', function() {
|
|
var updatedDisplayName = 'Mock Unit Updated';
|
|
createUnitOutlineView(this, createMockXBlockInfo('Mock Unit'));
|
|
unitOutlineView.refresh();
|
|
AjaxHelpers.expectJsonRequest(requests, 'GET', '/xblock/mock-unit');
|
|
AjaxHelpers.respondWithJson(requests,
|
|
createMockXBlockInfo(updatedDisplayName));
|
|
expect(unitOutlineView.$('.outline-unit .unit-title').first().text().trim()).toBe(updatedDisplayName);
|
|
});
|
|
});
|
|
});
|