diff --git a/cms/static/js/certificates/spec/views/certificate_details_spec.js b/cms/static/js/certificates/spec/views/certificate_details_spec.js index adbb6964fe..0a8a61ebbc 100644 --- a/cms/static/js/certificates/spec/views/certificate_details_spec.js +++ b/cms/static/js/certificates/spec/views/certificate_details_spec.js @@ -41,6 +41,11 @@ function(_, Course, CertificatesCollection, CertificateModel, CertificateDetails inputSignatoryTitle: '.signatory-title-input', inputSignatoryOrganization: '.signatory-organization-input' }; + var verifyAndConfirmPrompt = function(promptSpy, promptText){ + ViewHelpers.verifyPromptShowing(promptSpy, gettext(promptText)); + ViewHelpers.confirmPrompt(promptSpy); + ViewHelpers.verifyPromptHidden(promptSpy); + }; beforeEach(function() { window.course = new Course({ @@ -133,7 +138,16 @@ function(_, Course, CertificatesCollection, CertificateModel, CertificateDetails expect(this.view.$('.edit')).toExist(); }); - it('should change to "edit" mode when clicking the Edit button', function(){ + it('should change to "edit" mode when clicking the Edit button and confirming the prompt', function(){ + expect(this.view.$('.action-edit .edit')).toExist(); + var promptSpy = ViewHelpers.createPromptSpy(); + this.view.$('.action-edit .edit').click(); + verifyAndConfirmPrompt(promptSpy, gettext('Edit this certificate?')); + expect(this.model.get('editing')).toBe(true); + }); + + it('should not show confirmation prompt when clicked on "edit" in case of inactive certificate', function(){ + this.model.set('is_active', false); expect(this.view.$('.action-edit .edit')).toExist(); this.view.$('.action-edit .edit').click(); expect(this.model.get('editing')).toBe(true); diff --git a/cms/static/js/certificates/views/certificate_details.js b/cms/static/js/certificates/views/certificate_details.js index 999b702c6e..8b7bdfac3c 100644 --- a/cms/static/js/certificates/views/certificate_details.js +++ b/cms/static/js/certificates/views/certificate_details.js @@ -7,9 +7,10 @@ define([ // jshint ignore:line 'gettext', 'js/views/baseview', 'js/certificates/models/signatory', - 'js/certificates/views/signatory_details' + 'js/certificates/views/signatory_details', + 'js/views/utils/view_utils' ], -function($, _, str, gettext, BaseView, SignatoryModel, SignatoryDetailsView) { +function($, _, str, gettext, BaseView, SignatoryModel, SignatoryDetailsView, ViewUtils) { 'use strict'; var CertificateDetailsView = BaseView.extend({ tagName: 'div', @@ -36,7 +37,20 @@ function($, _, str, gettext, BaseView, SignatoryModel, SignatoryDetailsView) { editCertificate: function(event) { // Flip the model into 'editing' mode if (event && event.preventDefault) { event.preventDefault(); } - this.model.set('editing', true); + var self = this; + if (this.model.get("is_active") === true){ + ViewUtils.confirmThenRunOperation( + gettext('Edit this certificate?'), + gettext('This certificate has already been activated and is live. Are you sure you want to continue editing?'), + gettext('Yes, allow edits to the active Certificate'), + function() { + return self.model.set('editing', true); + } + ); + } + else{ + this.model.set('editing', true); + } }, render: function(showDetails) {