Skip to content

E
edx-platform
Commit 089a61c6 by Frances Botsford
Options

studio outline test fixes

parent a2d5500f
Showing with 90 additions and 134 deletions
cms/djangoapps/contentstore/features/common.py
......@@ -43,9 +43,9 @@ def i_confirm_with_ok(_step):
@step(u'I press the "([^"]*)" delete icon$')
def i_press_the_category_delete_icon(_step, category):
if category == 'section':
css = 'a.delete-button.delete-section-button span.delete-icon'
css = 'a.action.delete-section-button'
elif category == 'subsection':
css = 'a.delete-button.delete-subsection-button span.delete-icon'
css = 'a.action.delete-subsection-button'
else:
assert False, 'Invalid category: %s' % category
world.css_click(css)
......@@ -254,7 +254,7 @@ def create_course_with_unit():
world.wait_for_js_to_load()
css_selectors = [
'div.section-item a.expand-collapse-icon', 'a.new-unit-item'
'div.section-item a.expand-collapse', 'a.new-unit-item'
]
for selector in css_selectors:
world.css_click(selector)
......
cms/djangoapps/contentstore/features/section.py
......@@ -29,7 +29,7 @@ def i_have_added_new_section(_step):
@step('I click the Edit link for the release date$')
def i_click_the_edit_link_for_the_release_date(_step):
button_css = 'div.section-published-date a.edit-button'
button_css = 'div.section-published-date a.edit-release-date'
world.css_click(button_css)
......@@ -88,7 +88,7 @@ def i_see_a_release_date_for_my_section(_step):
status_text = world.css_text(css)
# e.g. 11/06/2012 at 16:25
msg = 'Will Release:'
msg = 'Release date:'
date_regex = r'(Jan|Feb|Mar|Apr|May|Jun|Jul|Aug|Sep|Oct|Nov|Dec) \d\d?, \d{4}'
if not re.search(date_regex, status_text):
print status_text, date_regex
......@@ -117,7 +117,7 @@ def the_section_release_date_picker_not_visible(_step):
def the_section_release_date_is_updated(_step):
css = 'span.published-status'
status_text = world.css_text(css)
assert_equal(status_text, 'Will Release: 12/25/2013 at 00:00 UTC')
assert_equal(status_text, 'Release date: 12/25/2013 at 00:00 UTC')
def save_section_name(name):
......
cms/static/coffee/spec/views/overview_spec.coffee
......@@ -6,65 +6,77 @@ define ["js/views/overview", "js/views/feedback_notification", "sinon", "js/base
appendSetFixtures """
<div class="section-published-date">
<span class="published-status">
<strong>Will Release:</strong> 06/12/2013 at 04:00 UTC
<strong>Release date:</strong> 06/12/2013 at 04:00 UTC
</span>
<a href="#" class="edit-button" data-date="06/12/2013" data-time="04:00" data-locator="i4x://pfogg/42/chapter/d6b47f7b084f49debcaf67fe5436c8e2">Edit</a>
<a href="#" class="edit-release-date action " data-date="06/12/2013" data-time="04:00" data-locator="i4x://pfogg/42/chapter/d6b47f7b084f49debcaf67fe5436c8e2"><i class="icon-time"></i> <span class="sr">Edit section release date</span></a>
</div>
"""
appendSetFixtures """
<div class="edit-subsection-publish-settings">
<div class="settings">
<h3>Section Release Date</h3>
<div class="picker datepair">
<div class="field field-start-date">
<label for="">Release Day</label>
<input class="start-date date" type="text" name="start_date" value="04/08/1990" placeholder="MM/DD/YYYY" class="date" size='15' autocomplete="off"/>
</div>
<div class="field field-start-time">
<label for="">Release Time (<abbr title="Coordinated Universal Time">UTC</abbr>)</label>
<input class="start-time time" type="text" name="start_time" value="12:00" placeholder="HH:MM" class="time" size='10' autocomplete="off"/>
</div>
<div class="description">
<p>On the date set above, this section – <strong class="section-name"></strong> – will be released to students. Any units marked private will only be visible to admins.</p>
</div>
</div>
<a href="#" class="save-button">Save</a><a href="#" class="cancel-button">Cancel</a>
</div>
</div>
<div class="wrapper wrapper-dialog wrapper-dialog-edit-sectionrelease edit-section-publish-settings" aria-describedby="dialog-edit-sectionrelease-description" aria-labelledby="dialog-edit-sectionrelease-title" aria-hidden="" role="dialog">
<div class="dialog confirm">
<form class="edit-sectionrelease-dialog" action="#">
<div class="form-content">
<h2 class="title dialog-edit-sectionrelease-title">Section Release Date</h2>
<p id="dialog-edit-sectionrelease-description" class="message">On the date set below, this section - <strong class="section-name"></strong> - will be released to students. Any units marked private will only be visible to admins.</p>
<ul class="list-input picker datepair">
<li class="field field-start-date">
<label for="start_date">Release Day</label>
<input class="start-date date" type="text" name="start_date" value="04/08/1990" placeholder="MM/DD/YYYY" class="date" size='15' autocomplete="off"/>
</li>
<li class="field field-start-time">
<label for="start_time">Release Time (<abbr title="Coordinated Universal Time">UTC</abbr>)</label>
<input class="start-time time" type="text" name="start_time" value="12:00" placeholder="HH:MM" class="time" size='10' autocomplete="off"/>
</li>
</ul>
</div>
<div class="actions">
<h3 class="sr">Form Actions</h3>
<ul>
<li class="action-item">
<a href="#" class="button action-primary action-save">Save</a>
</li>
<li class="action-item">
<a href="#" class="button action-secondary action-cancel">Cancel</a>
</li>
</ul>
</div>
</form>
</div>
"""
appendSetFixtures """
<section class="courseware-section branch" data-locator="a-location-goes-here">
<section class="courseware-section is-collapsible is-draggable" data-parent="a-parent-locator-goes-here" data-locator="a-location-goes-here">
<li class="branch collapsed id-holder" data-locator="an-id-goes-here">
<a href="#" class="delete-section-button"></a>
<a href="#" data-tooltip="Delete this section" class="delete-section-button"><i class="icon-trash"></i> <span class="sr">Delete section</span></a>
</li>
</section>
"""
appendSetFixtures """
<ol>
<li class="subsection-list branch" id="subsection-1" data-locator="subsection-1-id">
<ol class="sortable-subsection-list">
<li class="courseware-subsection is-collapsible id-holder is-draggable" id="subsection-1" data-locator="subsection-1-id" data-parent="a-aprent-locator-goes-here" data-id="a-data-id-goes-here">
<ol class="sortable-unit-list" id="subsection-list-1">
<li class="unit" id="unit-1" data-parent="subsection-1-id" data-locator="first-unit-id"></li>
<li class="unit" id="unit-2" data-parent="subsection-1-id" data-locator="second-unit-id"></li>
<li class="unit" id="unit-3" data-parent="subsection-1-id" data-locator="third-unit-id"></li>
<li class="courseware-unit unit is-draggable" id="unit-1" data-parent="subsection-1-id" data-locator="first-unit-id"></li>
<li class="courseware-unit unit is-draggable" id="unit-2" data-parent="subsection-1-id" data-locator="second-unit-id"></li>
<li class="courseware-unit unit is-draggable" id="unit-3" data-parent="subsection-1-id" data-locator="third-unit-id"></li>
</ol>
</li>
<li class="subsection-list branch" id="subsection-2" data-locator="subsection-2-id">
<li class="courseware-subsection is-collapsible id-holder is-draggable" id="subsection-2" data-locator="subsection-2-id" data-parent="a-aprent-locator-goes-here" data-id="a-data-id-goes-here">
<ol class="sortable-unit-list" id="subsection-list-2">
<li class="unit" id="unit-4" data-parent="subsection-2" data-locator="fourth-unit-id"></li>
<li class="courseware-unit unit is-draggable" id="unit-4" data-parent="subsection-2" data-locator="fourth-unit-id"></li>
</ol>
</li>
<li class="subsection-list branch" id="subsection-3" data-locator="subsection-3-id">
<li class="courseware-subsection is-collapsible id-holder is-draggable" id="subsection-3" data-locator="subsection-3-id" data-parent="a-aprent-locator-goes-here" data-id="a-data-id-goes-here">
<ol class="sortable-unit-list" id="subsection-list-3">
</li>
</ol>
"""
spyOn(Overview, 'saveSetSectionScheduleDate').andCallThrough()
# Have to do this here, as it normally gets bound in document.ready()
$('a.save-button').click(Overview.saveSetSectionScheduleDate)
$('a.action-save').click(Overview.saveSetSectionScheduleDate)
$('a.delete-section-button').click(deleteSection)
$(".edit-subsection-publish-settings .start-date").datepicker()
......@@ -79,22 +91,22 @@ define ["js/views/overview", "js/views/feedback_notification", "sinon", "js/base
'.unit',
'.unit-drag-handle',
'ol.sortable-unit-list',
'li.branch, article.subsection-body'
'li.courseware-subsection, article.subsection-body'
)
afterEach ->
delete window.analytics
delete window.course_location_analytics
@notificationSpy.reset()
it "should save model when save is clicked", ->
$('a.edit-button').click()
$('a.save-button').click()
$('a.edit-release-date').click()
$('a.action-save').click()
expect(Overview.saveSetSectionScheduleDate).toHaveBeenCalled()
it "should show a confirmation on save", ->
$('a.edit-button').click()
$('a.save-button').click()
$('a.edit-release-date').click()
$('a.action-save').click()
expect(@notificationSpy).toHaveBeenCalled()
# Fails sporadically in Jenkins.
......@@ -113,7 +125,7 @@ define ["js/views/overview", "js/views/feedback_notification", "sinon", "js/base
# $('a.delete-section-button').click()
# $('a.action-primary').click()
# expect(@notificationSpy).toHaveBeenCalled()
describe "findDestination", ->
it "correctly finds the drop target of a drag", ->
$ele = $('#unit-1')
......@@ -123,7 +135,7 @@ define ["js/views/overview", "js/views/feedback_notification", "sinon", "js/base
destination = Overview.overviewDragger.findDestination($ele, 1)
expect(destination.ele).toBe($('#unit-2'))
expect(destination.attachMethod).toBe('before')
it "can drag and drop across section boundaries, with special handling for first element", ->
$ele = $('#unit-1')
$ele.offset(
......@@ -142,7 +154,7 @@ define ["js/views/overview", "js/views/feedback_notification", "sinon", "js/base
destination = Overview.overviewDragger.findDestination($ele, 1)
expect(destination.ele).toBe($('#unit-4'))
expect(destination.attachMethod).toBe('after')
it "can drag and drop across section boundaries, with special handling for last element", ->
$ele = $('#unit-4')
$ele.offset(
......@@ -161,7 +173,7 @@ define ["js/views/overview", "js/views/feedback_notification", "sinon", "js/base
destination = Overview.overviewDragger.findDestination($ele, -1)
expect(destination.ele).toBe($('#unit-3'))
expect(destination.attachMethod).toBe('before')
it "can drag into an empty list", ->
$ele = $('#unit-1')
$ele.offset(
......@@ -171,7 +183,7 @@ define ["js/views/overview", "js/views/feedback_notification", "sinon", "js/base
destination = Overview.overviewDragger.findDestination($ele, 1)
expect(destination.ele).toBe($('#subsection-list-3'))
expect(destination.attachMethod).toBe('prepend')
it "reports a null destination on a failed drag", ->
$ele = $('#unit-1')
$ele.offset(
......@@ -182,7 +194,7 @@ define ["js/views/overview", "js/views/feedback_notification", "sinon", "js/base
ele: null
attachMethod: ""
)
it "can drag into a collapsed list", ->
$('#subsection-2').addClass('collapsed')
$ele = $('#unit-2')
......@@ -194,7 +206,7 @@ define ["js/views/overview", "js/views/feedback_notification", "sinon", "js/base
expect(destination.ele).toBe($('#subsection-list-2'))
expect(destination.parentList).toBe($('#subsection-2'))
expect(destination.attachMethod).toBe('prepend')
describe "onDragStart", ->
it "sets the dragState to its default values", ->
expect(Overview.overviewDragger.dragState).toEqual({})
......@@ -211,7 +223,7 @@ define ["js/views/overview", "js/views/feedback_notification", "sinon", "js/base
lastY: 0,
dragDirection: 0
)
it "collapses expanded elements", ->
expect($('#subsection-1')).not.toHaveClass('collapsed')
Overview.overviewDragger.onDragStart(
......@@ -221,7 +233,7 @@ define ["js/views/overview", "js/views/feedback_notification", "sinon", "js/base
)
expect($('#subsection-1')).toHaveClass('collapsed')
expect($('#subsection-1')).toHaveClass('expand-on-drop')
describe "onDragMove", ->
beforeEach ->
@scrollSpy = spyOn(window, 'scrollBy').andCallThrough()
......@@ -239,7 +251,7 @@ define ["js/views/overview", "js/views/feedback_notification", "sinon", "js/base
)
expect($('#unit-2')).toHaveClass('drop-target drop-target-before')
expect($ele).toHaveClass('valid-drop')
it "does not add CSS class to the drop destination if out of bounds", ->
$ele = $('#unit-1')
dragY = $ele.offset().top + 10
......@@ -252,19 +264,19 @@ define ["js/views/overview", "js/views/feedback_notification", "sinon", "js/base
)
expect($('#unit-2')).not.toHaveClass('drop-target drop-target-before')
expect($ele).not.toHaveClass('valid-drop')
it "scrolls up if necessary", ->
Overview.overviewDragger.onDragMove(
{element: $('#unit-1')}, '', {clientY: 2}
)
expect(@scrollSpy).toHaveBeenCalledWith(0, -10)
it "scrolls down if necessary", ->
Overview.overviewDragger.onDragMove(
{element: $('#unit-1')}, '', {clientY: (window.innerHeight - 5)}
)
expect(@scrollSpy).toHaveBeenCalledWith(0, 10)
describe "onDragEnd", ->
beforeEach ->
@reorderSpy = spyOn(Overview.overviewDragger, 'handleReorder')
......
cms/static/js/views/overview.js
......@@ -31,7 +31,7 @@ define(["domReady", "jquery", "jquery.ui", "underscore", "gettext", "js/views/fe
var toggleSubmodules = function(e) {
e.preventDefault();
$(this).toggleClass('expand');
$(this).toggleClass('expand').toggleClass('collapse');
$(this).closest('.is-collapsible, .window').toggleClass('collapsed');
};
......@@ -100,9 +100,9 @@ define(["domReady", "jquery", "jquery.ui", "underscore", "gettext", "js/views/fe
'<strong>' + gettext("Release date:") + '&nbsp;</strong>' +
gettext("{month}/{day}/{year} at {hour}:{minute} UTC") +
'</span>' +
'<a href="#" class="edit-release-date action" data-date="{month}/{day}/{year}" data-time="{hour}:{minute}" data-locator="{locator}">' +
gettext("Edit") +
'</a>',
'<a href="#" class="edit-release-date action" data-date="{month}/{day}/{year}" data-time="{hour}:{minute}" data-locator="{locator}"><i class="icon-time"></i> <span class="sr">' +
gettext("Edit section release date") +
'</span></a>',
{year: datetime.getUTCFullYear(), month: pad2(datetime.getUTCMonth() + 1), day: pad2(datetime.getUTCDate()),
hour: pad2(datetime.getUTCHours()), minute: pad2(datetime.getUTCMinutes()),
locator: locator},
......
cms/static/sass/views/_outline.scss
......@@ -76,6 +76,9 @@
padding: ($baseline/4);
}
.new-subsection-name-input {
@include font-size(14);
}
.new-section-name-save,
.new-subsection-name-save {
@include blue-button;
......@@ -166,7 +169,7 @@
&.drag-handle {
float: none;
margin: 0;
background: none;
background: transparent url(../img/drag-handles.png) right 5px no-repeat;
text-align: center;
}
......
cms/templates/js/blank-slate-template.underscore deleted 100644 → 0
<section class="courseware-section new-section">
<header>
<a href="#" data-tooltip="${_('Collapse/expand this section')}" class="expand-collapse-icon collapse"></a>
<div class="item-details">
<h3 class="section-name">
<span class="section-name-span">Click here to set the section name</span>
<form class="section-name-form">
<input type="text" value="${_('New Section Name')}" class="new-section-name" />
<input type="submit" class="new-section-name-save" data-parent="${parent_locator}"
data-category="${new_section_category}" value="${_('Save')}" />
<input type="button" class="new-section-name-cancel" value="$(_('Cancel')}" /></h3>
</form>
</div>
<div class="item-actions">
<a href="#" data-tooltip="${_('Delete this section')}" class="delete-button delete-section-button"><span class="delete-icon"></span></a>
<span data-tooltip="${_('Drag to re-order')}" class="drag-handle"></span>
</div>
</header>
</section>
cms/templates/js/new-section-template.underscore deleted 100644 → 0
<section class="courseware-section new-section is-collapsible is-draggable">
<header>
<a href="#" data-tooltip="${_('Expand/collapse this section')}" class="action expand-collapse"><i class="icon-caret-down ui-toggle-dd"></i><span class="sr">${_('Expand/collapse this section')}</span></a>
<div class="item-details">
<h3 class="section-name">
<form class="section-name-form">
<input type="text" value="New Section Name" class="new-section-name" />
<input type="submit" class="new-section-name-save" data-parent="${parent_locator}"
data-category="${new_section_category}" value="Save" />
<input type="button" class="new-section-name-cancel" value="Cancel" />
</form>
</h3>
</div>
</header>
</section>
cms/templates/js/new-subsection-template.underscore deleted 100644 → 0
<li class="collapsed">
<div class="section-item editing">
<form class="new-subsection-form">
<span class="subsection-name">
<input type="text" value="${_('New Subsection')}" class="new-subsection-name-input" />
</span>
<input type="submit" value="${_('Save')}" class="new-subsection-name-save" />
<input type="button" value="${_('Cancel')}" class="new-subsection-name-cancel" />
</form>
</div>
<ol>
<li>
<a href="unit.html" class="new-unit-item">
<i class="icon-plus"></i> ${_('New Unit')}
</a>
</li>
</ol>
</li>
cms/templates/js/no-outline-content.underscore deleted 100644 → 0
<div class="no-outline-content">
<p><%= gettext("You haven't added any sections to your course outline.") %><a href="#" class="button new-button"><i class="icon-plus"></i><%= gettext("Add your first section") %></a></p>
</div>
cms/templates/overview.html
......@@ -164,7 +164,7 @@ require(["domReady!", "jquery", "js/models/location", "js/models/section", "js/v
<%include file="widgets/_ui-dnd-indicator-before.html" />
<header class="section">
<a href="#" data-tooltip="${_('Expand/collapse this section')}" class="action expand-collapse"><i class="icon-caret-down ui-toggle-expansion"></i><span class="sr">${_('Expand/collapse this section')}</span></a>
<a href="#" data-tooltip="${_('Expand/collapse this section')}" class="action expand-collapse collapse"><i class="icon-caret-down ui-toggle-expansion"></i><span class="sr">${_('Expand/collapse this section')}</span></a>
<div class="item-details" data-locator="${section_locator}">
<h3 class="section-name" data-name="${section.display_name_with_default | h}"></h3>
......@@ -194,10 +194,10 @@ require(["domReady!", "jquery", "js/models/location", "js/models/section", "js/v
</div>
</li>
<li class="actions-item delete">
<a href="#" data-tooltip="${_('Delete this section')}" class="action delete-section-button"><i class="icon-trash"></i> <span class="sr">Delete section</span></a>
<a href="#" data-tooltip="${_('Delete this section')}" class="action delete-section-button"><i class="icon-trash"></i> <span class="sr">${_('Delete section')}</span></a>
</li>
<li class="actions-item drag">
<span data-tooltip="${_('Drag to reorder')}" class="drag-handle section-drag-handle action"><i class="icon-ellipsis-vertical"></i><span class="sr"> ${_("Drag to reorder section")}</span></span>
<span data-tooltip="${_('Drag to reorder')}" class="drag-handle section-drag-handle action"><span class="sr"> ${_("Drag to reorder section")}</span></span>
</li>
</ul>
</div>
......@@ -211,14 +211,14 @@ require(["domReady!", "jquery", "js/models/location", "js/models/section", "js/v
context_course.location.course_id, subsection.location, False, True
)
%>
<li class="courseware-subsection collapsed id-holder is-draggable"
<li class="courseware-subsection collapsed id-holder is-draggable is-collapsible "
data-parent="${section_locator}" data-locator="${subsection_locator}">
<%include file="widgets/_ui-dnd-indicator-before.html" />
<div class="section-item">
<div class="details">
<a href="#" data-tooltip="${_('Expand/collapse this subsection')}" class="action expand-collapse"><i class="icon-caret-down ui-toggle-expansion"></i><span class="sr">${_('Expand/collapse this subsection')}</span></a>
<a href="#" data-tooltip="${_('Expand/collapse this subsection')}" class="action expand-collapse expand"><i class="icon-caret-down ui-toggle-expansion"></i><span class="sr">${_('Expand/collapse this subsection')}</span></a>
<a href="${subsection_locator.url_reverse('subsection')}">
<span class="subsection-name"><span class="subsection-name-value">${subsection.display_name_with_default}</span></span>
</a>
......@@ -234,7 +234,7 @@ require(["domReady!", "jquery", "js/models/location", "js/models/section", "js/v
<a href="#" data-tooltip="${_('Delete this subsection')}" class="action delete-subsection-button"><i class="icon-trash"></i> <span class="sr">${_("Delete subsection")}</span></a>
</li>
<li class="actions-item drag">
<span data-tooltip="${_('Drag to reorder')}" class="drag-handle subsection-drag-handle action"><i class="icon-ellipsis-vertical"></i></span>
<span data-tooltip="${_('Drag to reorder')}" class="drag-handle subsection-drag-handle action"></span>
</li>
</ul>
</div>
......@@ -283,12 +283,10 @@ require(["domReady!", "jquery", "js/models/location", "js/models/section", "js/v
aria-hidden=""
role="dialog">
<div class="dialog confirm">
<form class="edit-sectionrelease-dialog" method="POST" action="#" enctype="multipart/form-data">
<form class="edit-sectionrelease-dialog" action="#">
<div class="form-content">
<h2 class="title dialog-edit-sectionrelease-title">${_("Section Release Date")}</h2>
<p id="dialog-edit-sectionrelease-description" class="message">${_('On the date set below, this section - {name} - will be released to students. Any units marked private will only be visible to admins.').format(name='<strong class="section-name"></strong>')}</p>
<ul class="list-input picker datepair">
<li class="field field-start-date">
<label for="start_date">${_("Release Day")}</label>
......@@ -299,9 +297,7 @@ require(["domReady!", "jquery", "js/models/location", "js/models/section", "js/v
<input class="start-time time" type="text" name="start_time" value="" placeholder="HH:MM" class="time" size='10' autocomplete="off"/>
</li>
</ul>
</div>
<div class="actions">
<h3 class="sr">${_("Form Actions")}</h3>
<ul>
......
cms/templates/widgets/units.html
......@@ -41,7 +41,7 @@ This def will enumerate through a passed in subsection and list all of the units
<a href="#" data-tooltip="Delete this unit" class="delete-unit-button action" data-locator="${unit_locator}"><i class="icon-trash"></i><span class="sr">Delete unit</span></a>
</li>
<li class="actions-item drag">
<span data-tooltip="Drag to sort" class="drag-handle unit-drag-handle action"><i class="icon-ellipsis-vertical"></i></span>
<span data-tooltip="Drag to sort" class="drag-handle unit-drag-handle action"></span>
</li>
</ul>
</div>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment