Add jasmine tests for course_rerun.js
This commit is contained in:
Ben McMorran
@@ -233,6 +233,7 @@ define([
|
||||
"js/spec/views/pages/container_subviews_spec",
|
||||
"js/spec/views/pages/group_configurations_spec",
|
||||
"js/spec/views/pages/course_outline_spec",
|
||||
"js/spec/views/pages/course_rerun_spec",
|
||||
|
||||
"js/spec/views/modals/base_modal_spec",
|
||||
"js/spec/views/modals/edit_xblock_spec",
|
||||
|
||||
133
cms/static/js/spec/views/pages/course_rerun_spec.js
Normal file
133
cms/static/js/spec/views/pages/course_rerun_spec.js
Normal file
@@ -0,0 +1,133 @@
|
||||
define(["jquery", "js/spec_helpers/create_sinon", "js/spec_helpers/view_helpers", "js/views/course_rerun"],
|
||||
function ($, create_sinon, view_helpers, CourseRerunPage) {
|
||||
describe("Create course rerun page", function () {
|
||||
var selectors = {
|
||||
courseOrg: '.rerun-course-org',
|
||||
courseNumber: '.rerun-course-number',
|
||||
courseRun: '.rerun-course-run',
|
||||
courseName: '.rerun-course-name',
|
||||
errorField: '.tip-error',
|
||||
saveButton: '.rerun-course-save',
|
||||
cancelButton: '.rerun-course-cancel',
|
||||
errorMessage: '.wrapper-error'
|
||||
},
|
||||
classes = {
|
||||
hidden: 'is-hidden',
|
||||
error: 'error',
|
||||
disabled: 'is-disabled',
|
||||
processing: 'is-processing'
|
||||
},
|
||||
mockCreateCourseRerunHTML = readFixtures('mock/mock-create-course-rerun.underscore');
|
||||
|
||||
var fillInFields = function (org, number, run, name) {
|
||||
$(selectors.courseOrg).val(org);
|
||||
$(selectors.courseNumber).val(number);
|
||||
$(selectors.courseRun).val(run);
|
||||
$(selectors.courseName).val(name);
|
||||
};
|
||||
|
||||
beforeEach(function () {
|
||||
view_helpers.installMockAnalytics();
|
||||
window.source_course_key = 'test_course_key';
|
||||
appendSetFixtures(mockCreateCourseRerunHTML);
|
||||
CourseRerunPage.onReady();
|
||||
});
|
||||
|
||||
afterEach(function () {
|
||||
view_helpers.removeMockAnalytics();
|
||||
delete window.source_course_key;
|
||||
});
|
||||
|
||||
describe("validateRequiredField", function () {
|
||||
it("has a message for an empty string", function () {
|
||||
var message = CourseRerunPage.validateRequiredField('');
|
||||
expect(message).not.toBe('');
|
||||
});
|
||||
|
||||
it("does not have a message for a non empty string", function () {
|
||||
var message = CourseRerunPage.validateRequiredField('edX');
|
||||
expect(message).toBe('');
|
||||
});
|
||||
});
|
||||
|
||||
describe("setNewCourseFieldInErr", function () {
|
||||
var setErrorMessage = function(selector, message) {
|
||||
var element = $(selector).parent();
|
||||
CourseRerunPage.setNewCourseFieldInErr(element, message);
|
||||
return element;
|
||||
};
|
||||
|
||||
it("can show an error message", function () {
|
||||
var element = setErrorMessage(selectors.courseOrg, 'error message');
|
||||
expect(element).toHaveClass(classes.error);
|
||||
expect(element.children(selectors.errorField)).not.toHaveClass(classes.hidden);
|
||||
expect(element.children(selectors.errorField)).toContainText('error message');
|
||||
});
|
||||
|
||||
it("can hide an error message", function () {
|
||||
var element = setErrorMessage(selectors.courseOrg, '');
|
||||
expect(element).not.toHaveClass(classes.error);
|
||||
expect(element.children(selectors.errorField)).toHaveClass(classes.hidden);
|
||||
});
|
||||
|
||||
it("disables the save button", function () {
|
||||
setErrorMessage(selectors.courseOrg, 'error message');
|
||||
expect($(selectors.saveButton)).toHaveClass(classes.disabled);
|
||||
});
|
||||
|
||||
it("enables the save button when all errors are removed", function () {
|
||||
setErrorMessage(selectors.courseOrg, 'error message 1');
|
||||
setErrorMessage(selectors.courseNumber, 'error message 2');
|
||||
expect($(selectors.saveButton)).toHaveClass(classes.disabled);
|
||||
setErrorMessage(selectors.courseOrg, '');
|
||||
setErrorMessage(selectors.courseNumber, '');
|
||||
expect($(selectors.saveButton)).not.toHaveClass(classes.disabled);
|
||||
});
|
||||
|
||||
it("does not enable the save button when errors remain", function () {
|
||||
setErrorMessage(selectors.courseOrg, 'error message 1');
|
||||
setErrorMessage(selectors.courseNumber, 'error message 2');
|
||||
expect($(selectors.saveButton)).toHaveClass(classes.disabled);
|
||||
setErrorMessage(selectors.courseOrg, '');
|
||||
expect($(selectors.saveButton)).toHaveClass(classes.disabled);
|
||||
});
|
||||
});
|
||||
|
||||
it("can save course reruns", function () {
|
||||
var requests = create_sinon.requests(this);
|
||||
window.source_course_key = 'test_course_key';
|
||||
fillInFields('DemoX', 'DM101', '2014', 'Demo course');
|
||||
$(selectors.saveButton).click();
|
||||
create_sinon.expectJsonRequest(requests, 'POST', '/course/', {
|
||||
source_course_key: 'test_course_key',
|
||||
org: 'DemoX',
|
||||
number: 'DM101',
|
||||
run: '2014',
|
||||
display_name: 'Demo course'
|
||||
});
|
||||
expect($(selectors.saveButton)).toHaveClass(classes.disabled);
|
||||
expect($(selectors.saveButton)).toHaveClass(classes.processing);
|
||||
expect($(selectors.cancelButton)).toHaveClass(classes.hidden);
|
||||
});
|
||||
|
||||
it("displays an error when saving fails", function () {
|
||||
var requests = create_sinon.requests(this);
|
||||
fillInFields('DemoX', 'DM101', '2014', 'Demo course');
|
||||
$(selectors.saveButton).click();
|
||||
create_sinon.respondWithJson(requests, {
|
||||
ErrMsg: 'error message'
|
||||
});
|
||||
expect($(selectors.errorMessage)).not.toHaveClass(classes.hidden);
|
||||
expect($(selectors.errorMessage)).toContainText('error message');
|
||||
expect($(selectors.saveButton)).not.toHaveClass(classes.processing);
|
||||
expect($(selectors.cancelButton)).not.toHaveClass(classes.hidden);
|
||||
});
|
||||
|
||||
it("does not save if there are validation errors", function () {
|
||||
var requests = create_sinon.requests(this);
|
||||
fillInFields('DemoX', 'DM101', '', 'Demo course');
|
||||
$(selectors.saveButton).click();
|
||||
expect(requests.length).toBe(0);
|
||||
});
|
||||
});
|
||||
});
|
||||
@@ -1,4 +1,4 @@
|
||||
require(["domReady", "jquery", "underscore", "js/utils/cancel_on_escape"],
|
||||
define(["domReady", "jquery", "underscore", "js/utils/cancel_on_escape"],
|
||||
function (domReady, $, _, CancelOnEscape) {
|
||||
|
||||
var saveRerunCourse = function (e) {
|
||||
@@ -87,7 +87,7 @@ require(["domReady", "jquery", "underscore", "js/utils/cancel_on_escape"],
|
||||
}
|
||||
};
|
||||
|
||||
domReady(function () {
|
||||
var onReady = function () {
|
||||
var $cancelButton = $('.rerun-course-cancel');
|
||||
var $courseRun = $('.rerun-course-run');
|
||||
$courseRun.focus().select();
|
||||
@@ -175,5 +175,16 @@ require(["domReady", "jquery", "underscore", "js/utils/cancel_on_escape"],
|
||||
$('.rerun-course-save').addClass('is-disabled');
|
||||
}
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
domReady(onReady);
|
||||
|
||||
// Return these functions so that they can be tested
|
||||
return {
|
||||
saveRerunCourse: saveRerunCourse,
|
||||
cancelRerunCourse: cancelRerunCourse,
|
||||
validateRequiredField: validateRequiredField,
|
||||
setNewCourseFieldInErr: setNewCourseFieldInErr,
|
||||
onReady: onReady
|
||||
};
|
||||
});
|
||||
|
||||
116
cms/templates/js/mock/mock-create-course-rerun.underscore
Normal file
116
cms/templates/js/mock/mock-create-course-rerun.underscore
Normal file
@@ -0,0 +1,116 @@
|
||||
<div id="content">
|
||||
<div class="wrapper-mast wrapper">
|
||||
<header class="mast mast-wizard has-actions">
|
||||
<h1 class="page-header">
|
||||
<span class="page-header-sub">Create a re-run of a course</span>
|
||||
</h1>
|
||||
|
||||
<nav class="nav-actions">
|
||||
<h3 class="sr">Page Actions</h3>
|
||||
<ul>
|
||||
<li class="nav-item">
|
||||
<a href="" class="button cancel-button">Cancel</a>
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
|
||||
<h2 class="page-header-super course-original">
|
||||
<span class="sr">You are creating a re-run from:</span>
|
||||
<span class="course-original-title-id">edX Open_DemoX 2014_T1</span>
|
||||
<span class="course-original-title">edX Demonstration Course</span>
|
||||
</h2>
|
||||
</header>
|
||||
</div>
|
||||
|
||||
<div class="wrapper-content wrapper">
|
||||
<div class="inner-wrapper">
|
||||
<section class="content">
|
||||
<article class="content-primary">
|
||||
<div class="introduction">
|
||||
<div class="copy">
|
||||
<p>
|
||||
Provide identifying information for this re-run of the course. The original course is not affected in any way by a re-run.
|
||||
<strong>Note: Together, the organization, course number, and course run must uniquely identify this new course instance.</strong>
|
||||
<p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="wrapper-rerun-course">
|
||||
<form class="form-create rerun-course course-info" id="rerun-course-form"
|
||||
name="rerun-course-form">
|
||||
<div class="wrapper-error is-hidden">
|
||||
<div id="course_rerun_error" name="course_rerun_error"
|
||||
class="message message-status error" role="alert">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="wrapper-form">
|
||||
<fieldset>
|
||||
<legend class="sr">Required Information to Create a re-run of a course</legend>
|
||||
|
||||
<ol class="list-input">
|
||||
<li class="field text required" id="field-course-name">
|
||||
<label for="rerun-course-name">Course Name</label>
|
||||
<input class="rerun-course-name" id="rerun-course-name" type="text"
|
||||
name="rerun-course-name" aria-required="true" value="edX Demonstration Course"
|
||||
placeholder="e.g. Introduction to Computer Science"/>
|
||||
<span class="tip">
|
||||
The public display name for the new course. (This name is often the same as the original course name.)
|
||||
</span>
|
||||
<span class="tip tip-error is-hidden"></span>
|
||||
</li>
|
||||
<li class="field text required" id="field-organization">
|
||||
<label for="rerun-course-org">Organization</label>
|
||||
<input class="rerun-course-org" id="rerun-course-org" type="text"
|
||||
name="rerun-course-org" aria-required="true"
|
||||
value="edX"
|
||||
placeholder="e.g. UniversityX or OrganizationX"/>
|
||||
<span class="tip">
|
||||
The name of the organization sponsoring the new course. (This name is often the same as the original organization name.)
|
||||
<strong class="tip-note" class="tip-note">Note: No spaces or special characters are allowed.</strong>
|
||||
</span>
|
||||
<span class="tip tip-error is-hidden"></span>
|
||||
</li>
|
||||
|
||||
<li class="row">
|
||||
<div class="column field text required" id="field-course-number">
|
||||
<label for="rerun-course-number">Course Number</label>
|
||||
<input class="rerun-course-number" id="rerun-course-number" type="text"
|
||||
name="rerun-course-number" aria-required="true"
|
||||
value="Open_DemoX" placeholder="e.g. CS101"/>
|
||||
<span class="tip">
|
||||
The unique number that identifies the new course within the organization. (This number is often the same as the original course number.)
|
||||
<strong class="tip-note" class="tip-note">Note: No spaces or special characters are allowed.</strong>
|
||||
</span>
|
||||
<span class="tip tip-error is-hidden"></span>
|
||||
</div>
|
||||
|
||||
<div class="column field text required" id="field-course-run">
|
||||
<label for="rerun-course-run">Course Run</label>
|
||||
<input class="rerun-course-run" id="rerun-course-run" type="text"
|
||||
name="rerun-course-run" aria-required="true"
|
||||
placeholder="e.g. 2014_T1"/>
|
||||
<span class="tip">
|
||||
The term in which the new course will run. (This value is often different than the original course run value.)
|
||||
<strong class="tip-note" class="tip-note">Note: No spaces or special characters are allowed.</strong>
|
||||
</span>
|
||||
<span class="tip tip-error is-hidden"></span>
|
||||
</div>
|
||||
</li>
|
||||
</ol>
|
||||
|
||||
<input type="hidden" value="false" class="allow-unicode-course-id"/>
|
||||
</fieldset>
|
||||
</div>
|
||||
|
||||
<div class="actions">
|
||||
<button type="submit" class="action action-primary rerun-course-save is-disabled">Create Re-run</button>
|
||||
<button type="button" class="action action-secondary action-cancel rerun-course-cancel">Cancel</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</article>
|
||||
</section>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
Reference in New Issue
Block a user