From dcee7855436a76e2e51619aa34cacb328d7019da Mon Sep 17 00:00:00 2001 From: Matthew Piatetsky Date: Tue, 22 Aug 2017 16:34:44 -0400 Subject: [PATCH] Fix selectors so that unenrollment survey works with multiple courses --- .../learner_dashboard/views/unenroll_view.js | 29 +++++++++---------- .../learner_dashboard/unenroll_view_spec.js | 4 +-- lms/static/sass/multicourse/_dashboard.scss | 2 +- .../dashboard/_dashboard_course_listing.html | 1 - lms/templates/dashboard/_reason_survey.html | 25 +++++++--------- themes/edx.org/lms/templates/dashboard.html | 1 + 6 files changed, 29 insertions(+), 33 deletions(-) diff --git a/lms/static/js/learner_dashboard/views/unenroll_view.js b/lms/static/js/learner_dashboard/views/unenroll_view.js index ab52dfe83e..84a8d75612 100644 --- a/lms/static/js/learner_dashboard/views/unenroll_view.js +++ b/lms/static/js/learner_dashboard/views/unenroll_view.js @@ -3,36 +3,33 @@ define(['backbone', 'jquery', 'underscore', - 'gettext', - 'edx-ui-toolkit/js/utils/html-utils' + 'gettext' ], function( Backbone, $, _, - gettext, - HtmlUtils + gettext ) { return Backbone.View.extend({ el: '.unenroll-modal', switchToSlideOne: function() { - var survey, i, - reasonsSurvey = HtmlUtils.HTML($('.reasons_survey')); + var survey, i; // Randomize survey option order survey = document.querySelector('.options'); for (i = survey.children.length - 1; i >= 0; i--) { survey.appendChild(survey.children[Math.random() * i | 0]); } - $('.inner-wrapper header').hide(); - $('#unenroll_form').after(HtmlUtils.ensureHtml(reasonsSurvey).toString()).hide(); - $('.reasons_survey .slide1').removeClass('hidden'); + this.$('.inner-wrapper header').hide(); + this.$('#unenroll_form').hide(); + this.$('.slide1').removeClass('hidden'); }, switchToSlideTwo: function() { - var reason = $(".reasons_survey input[name='reason']:checked").attr('val'); + var reason = this.$(".reasons_survey input[name='reason']:checked").attr('val'); if (reason === 'Other') { - reason = $('.other_text').val(); + reason = this.$('.other_text').val(); } if (reason) { window.analytics.track('unenrollment_reason.selected', { @@ -41,9 +38,11 @@ displayName: 'v1' }); } - HtmlUtils.setHtml($('.reasons_survey'), HtmlUtils.HTML($('.slide2').html())); - $('.reasons_survey .return_to_dashboard').attr('href', this.urls.dashboard); - $('.reasons_survey .browse_courses').attr('href', this.urls.browseCourses); + this.$('.slide1').addClass('hidden'); + this.$('.survey_course_name').text(this.$('#unenroll_course_name').text()); + this.$('.slide2').removeClass('hidden'); + this.$('.reasons_survey .return_to_dashboard').attr('href', this.urls.dashboard); + this.$('.reasons_survey .browse_courses').attr('href', this.urls.browseCourses); }, unenrollComplete: function(event, xhr) { @@ -52,7 +51,7 @@ location.href = this.urls.dashboard; } else { this.switchToSlideOne(); - $('.submit_reasons').click(this.switchToSlideTwo.bind(this)); + this.$('.reasons_survey:first .submit_reasons').click(this.switchToSlideTwo.bind(this)); } } else if (xhr.status === 403) { location.href = this.urls.signInUser + '?course_id=' + diff --git a/lms/static/js/spec/learner_dashboard/unenroll_view_spec.js b/lms/static/js/spec/learner_dashboard/unenroll_view_spec.js index 1aa0c8efc9..034eeaa808 100644 --- a/lms/static/js/spec/learner_dashboard/unenroll_view_spec.js +++ b/lms/static/js/spec/learner_dashboard/unenroll_view_spec.js @@ -20,7 +20,7 @@ define([ }; beforeEach(function() { - setFixtures('
'); // eslint-disable-line max-len + setFixtures('
'); // eslint-disable-line max-len }); afterEach(function() { @@ -39,7 +39,7 @@ define([ expect($('.slide1').hasClass('hidden')).toEqual(false); expect($('.slide2').hasClass('hidden')).toEqual(true); view.switchToSlideTwo(); - expect($('.slide2').hasClass('hidden')).toEqual(true); + expect($('.slide2').hasClass('hidden')).toEqual(false); }); }); } diff --git a/lms/static/sass/multicourse/_dashboard.scss b/lms/static/sass/multicourse/_dashboard.scss index d27b5be8af..a360e1016a 100644 --- a/lms/static/sass/multicourse/_dashboard.scss +++ b/lms/static/sass/multicourse/_dashboard.scss @@ -1504,7 +1504,7 @@ a.fade-cover{ } .reasons_survey { - padding: 20px; + margin: 20px; .options { list-style: none; diff --git a/lms/templates/dashboard/_dashboard_course_listing.html b/lms/templates/dashboard/_dashboard_course_listing.html index 943d6fd347..ec2874228d 100644 --- a/lms/templates/dashboard/_dashboard_course_listing.html +++ b/lms/templates/dashboard/_dashboard_course_listing.html @@ -220,7 +220,6 @@ from util.course import get_link_for_about_page, get_encoded_course_sharing_utm_
- - + <%include file='dashboard/_reason_survey.html' />