Skip to content

Commit

Permalink
Fix oppia#2813: Customization arg model is bypassed for interactions …
Browse files Browse the repository at this point in the history 
…that have no arg to customize. (oppia#3176)

* Fix oppia#2813: Customization arg model is bypassed for interactions that have no arg to customize.

* fix e2e tests.

* fix linting rules.

* fix reopening customization modal.

* fix bug.

* fix minor glitch.

* remove unnecessary code.

* add e2e test for re-customizing interaction.

* remove unnecessary file.

* undo unnecessary change.

* fix a bug.

* modify message.
  • Loading branch information
@arunabh98 @seanlip
arunabh98 authored and seanlip committed Mar 23, 2017
1 parent 2a2d50f commit 0ec3551
Show file tree
Hide file tree
Showing 4 changed files with 100 additions and 13 deletions.
16 changes: 16 additions & 0 deletions core/templates/dev/head/pages/exploration_editor/editor_tab/StateInteraction.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -65,6 +65,7 @@ oppia.controller('StateInteraction', [

$scope.stateInteractionIdService = stateInteractionIdService;
$scope.hasLoaded = false;
$scope.customizationModalReopened = false;

$scope.userBlueImgUrl = UrlInterpolationService.getStaticImageUrl(
'/avatar/user_blue_72px.png');
Expand Down Expand Up @@ -211,6 +212,7 @@ oppia.controller('StateInteraction', [
GLOBALS.ALLOWED_INTERACTION_CATEGORIES);

if (stateInteractionIdService.savedMemento) {
$scope.customizationModalReopened = true;
var interactionSpec = INTERACTION_SPECS[
stateInteractionIdService.savedMemento];
$scope.customizationArgSpecs = (
Expand Down Expand Up @@ -238,6 +240,8 @@ oppia.controller('StateInteraction', [

$scope.$broadcast('schemaBasedFormsShown');
$scope.form = {};
$scope.hasCustomizationArgs = (Object.keys(
stateCustomizationArgsService.displayed).length > 0);
}

$scope.onChangeInteractionId = function(newInteractionId) {
Expand All @@ -262,6 +266,14 @@ oppia.controller('StateInteraction', [
});
}

if (Object.keys(
stateCustomizationArgsService.displayed).length === 0) {
$scope.save();
$scope.hasCustomizationArgs = false;
} else {
$scope.hasCustomizationArgs = true;
}

$scope.$broadcast('schemaBasedFormsShown');
$scope.form = {};
};
Expand All @@ -281,6 +293,10 @@ oppia.controller('StateInteraction', [
$modalInstance.close();
};

$scope.okay = function() {
$modalInstance.close('okay');
};

$scope.cancel = function() {
$modalInstance.dismiss('cancel');
};
Expand Down
25 changes: 15 additions & 10 deletions core/templates/dev/head/pages/exploration_editor/editor_tab/state_editor_interaction.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -36,7 +36,7 @@ <h3 ng-if="!stateInteractionIdService.displayed">
Choose Interaction
</h3>

<h3 ng-if="stateInteractionIdService.displayed">
<h3 ng-if="stateInteractionIdService.displayed && (customizationModalReopened || hasCustomizationArgs)">
Customize Interaction (<[INTERACTION_SPECS[stateInteractionIdService.displayed].name]>)
</h3>
</div>
Expand All @@ -60,12 +60,7 @@ <h3 ng-if="stateInteractionIdService.displayed">
</tabset>
</div>

<form ng-if="stateInteractionIdService.displayed" name="form.schemaForm" class="protractor-test-interaction-editor">
<div ng-if="customizationArgSpecs.length === 0">
<em>There are no customizations options available.<br><br>
To use this interaction, click 'Save Interaction'.</em>
</div>

<form ng-if="stateInteractionIdService.displayed && hasCustomizationArgs" name="form.schemaForm" class="protractor-test-interaction-editor">
<div ng-repeat="customizationArgSpec in customizationArgSpecs track by $index">
<div class="oppia-interaction-customization-label"><[customizationArgSpec.description]></div>
<div>
Expand All @@ -75,17 +70,27 @@ <h3 ng-if="stateInteractionIdService.displayed">
</div>
</div>
</form>

<form ng-if="stateInteractionIdService.displayed && !hasCustomizationArgs && customizationModalReopened">
This interaction cannot be modified. To delete it, close this popup and click the 'x' button in the top-right corner.
</form>
</div>

<div class="modal-footer">
<!-- Do not show this button if an interaction is already selected. -->
<button class="btn btn-default" style="float: left;" ng-click="returnToInteractionSelector()" ng-if="stateInteractionIdService.displayed && !stateInteractionIdService.savedMemento">Change Interaction</button>
<button class="btn btn-default" style="float: left;" ng-click="returnToInteractionSelector()" ng-if="stateInteractionIdService.displayed && !stateInteractionIdService.savedMemento && hasCustomizationArgs">Change Interaction</button>

<button class="btn btn-default" ng-click="cancel()">Cancel</button>
<button class="btn btn-default" ng-click="cancel()" ng-if="hasCustomizationArgs">Cancel</button>
<button class="btn btn-success protractor-test-save-interaction" ng-click="save()"
ng-disabled="!stateInteractionIdService.displayed || form.schemaForm.$invalid">
ng-disabled="!stateInteractionIdService.displayed || form.schemaForm.$invalid"
ng-if="hasCustomizationArgs">
Save Interaction
</button>
<button class="btn btn-success protractor-test-close-no-customization-modal"
ng-click="okay()"
ng-if="!hasCustomizationArgs && customizationModalReopened">
Okay
</button>
</div>
</script>

Expand Down
57 changes: 57 additions & 0 deletions core/tests/protractor/stateEditor.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -134,6 +134,63 @@ describe('State editor', function() {
users.logout();
});

it('should skip the customization modal for interactions having no ' +
'customization options', function() {
users.createUser('user4@stateEditor.com', 'user4StateEditor');
users.login('user4@stateEditor.com');

workflow.createExploration();
editor.setContent(forms.toRichText('some content'));

// Numeric input does not have any customization arguments. Therefore the
// customization modal and the save interaction button does not appear.
editor.openInteraction('NumericInput');
var saveInteractionBtn = element(
by.css('.protractor-test-save-interaction'));
expect(saveInteractionBtn.isPresent()).toBe(false);

element(by.css('.protractor-test-close-add-response-modal')).click();

// The Continue input has customization options. Therefore the
// customization modal does appear and so does the save interaction button.
editor.openInteraction('Continue');
expect(saveInteractionBtn.isPresent()).toBe(true);
users.logout();
});

it('should open appropriate modal on re-clicking an interaction to ' +
'customize it', function() {
users.createUser('user5@stateEditor.com', 'user5StateEditor');
users.login('user5@stateEditor.com');

workflow.createExploration();
editor.setContent(forms.toRichText('some content'));

// Numeric input does not have any customization arguments. Therefore, on
// re-clicking, a modal opens up informing the user that this interaction
// does not have any customization options. To dismiss this modal, user
// clicks 'Okay' implying that he/she has got the message.
editor.setInteraction('NumericInput');
element(by.css('.protractor-test-interaction')).click();
var okayBtn = element(
by.css('.protractor-test-close-no-customization-modal'));
expect(okayBtn.isPresent()).toBe(true);
okayBtn.click();

// Continue input has customization options. Therefore, on re-clicking, a
// modal opens up containing the customization arguments for this input.
// The user can dismiss this modal by clicking the 'Save Interaction'
// button.
editor.setInteraction('Continue');
element(by.css('.protractor-test-interaction')).click();
var saveInteractionBtn = element(
by.css('.protractor-test-save-interaction'));
expect(saveInteractionBtn.isPresent()).toBe(true);
saveInteractionBtn.click();

users.logout();
});

it('should preserve input value when rule type changes in' +
' add response modal', function() {
users.createUser('stateEditorUser1@example.com', 'stateEditorUser1');
Expand Down
15 changes: 12 additions & 3 deletions core/tests/protractor_utils/editor.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -226,9 +226,18 @@ var customizeInteraction = function(interactionId) {
interactions.getInteraction(interactionId).customizeInteraction.apply(
null, customizationArgs);
}
element(by.css('.protractor-test-save-interaction')).click();
// Wait for the customization modal to close.
general.waitForSystem();

// The save interaction button doesn't appear for interactions having no
// options to customize.
var saveInteractionBtn = element(
by.css('.protractor-test-save-interaction'));
saveInteractionBtn.isPresent().then(function(result) {
if (result) {
saveInteractionBtn.click();
// Wait for the customization modal to close.
general.waitForSystem();
}
});
};

// Likewise this can receive additional arguments.
Expand Down

0 comments on commit 0ec3551

Please sign in to comment.