From ede8ee4a5b8a10c39f3ecd92276dc6a1b7dbe655 Mon Sep 17 00:00:00 2001
From: Douglas Hall <douglashall@dhcp-18-189-69-227.dyn.MIT.EDU>
Date: Mon, 11 Dec 2017 11:17:52 -0500
Subject: [PATCH] Fix optional registration fields toggle.

We need to account for optional fields that may get rendered
as hidden input elements due to the configuration of the
registration form when deciding whether or not to display
the optional registration fields toggle checkbox.

ENT-796
---
 .../js/spec/student_account/register_spec.js  | 30 +++++++++++++++++--
 .../js/student_account/views/RegisterView.js  | 22 +++++++++-----
 2 files changed, 43 insertions(+), 9 deletions(-)

diff --git a/lms/static/js/spec/student_account/register_spec.js b/lms/static/js/spec/student_account/register_spec.js
index 8d38c54520..78c517eeb5 100644
--- a/lms/static/js/spec/student_account/register_spec.js
+++ b/lms/static/js/spec/student_account/register_spec.js
@@ -213,7 +213,12 @@
                             }
                         ]
                     };
-                var createRegisterView = function(that) {
+                var createRegisterView = function(that, formFields) {
+                    var fields = formFields;
+                    if (typeof fields === 'undefined') {
+                        fields = FORM_DESCRIPTION.fields;
+                    }
+
                 // Initialize the register model
                     model = new RegisterModel({}, {
                         url: FORM_DESCRIPTION.submit_url,
@@ -222,7 +227,7 @@
 
                 // Initialize the register view
                     view = new RegisterView({
-                        fields: FORM_DESCRIPTION.fields,
+                        fields: fields,
                         model: model,
                         thirdPartyAuth: THIRD_PARTY_AUTH,
                         platformName: PLATFORM_NAME
@@ -537,6 +542,27 @@
                 // The iframe has been deleted
                     expect($content.find('iframe').length).toEqual(0);
                 });
+
+                it('displays optional fields toggle', function() {
+                    createRegisterView(this);
+                    expect(view.$('.checkbox-optional_fields_toggle')).toBeVisible();
+                });
+
+                it('hides optional fields toggle when there are no visible optional fields', function() {
+                    createRegisterView(this, [
+                        {
+                            placeholder: '',
+                            name: 'hidden_optional',
+                            label: 'Hidden Optional',
+                            defaultValue: '',
+                            type: 'hidden',
+                            required: false,
+                            instructions: 'Used for testing hidden input fields that are optional.',
+                            restrictions: {}
+                        }
+                    ]);
+                    expect(view.$('.checkbox-optional_fields_toggle')).toHaveClass('hidden');
+                });
             });
         });
 }).call(this, define || RequireJS.define);
diff --git a/lms/static/js/student_account/views/RegisterView.js b/lms/static/js/student_account/views/RegisterView.js
index 7287ac8b41..e9536a6db9 100644
--- a/lms/static/js/student_account/views/RegisterView.js
+++ b/lms/static/js/student_account/views/RegisterView.js
@@ -94,27 +94,35 @@
                 buildForm: function(data) {
                     var html = [],
                         i,
+                        field,
                         len = data.length,
                         requiredFields = [],
                         optionalFields = [];
 
                     this.fields = data;
 
+                    this.hasOptionalFields = false;
                     for (i = 0; i < len; i++) {
-                        if (data[i].errorMessages) {
+                        field = data[i];
+                        if (field.errorMessages) {
                             // eslint-disable-next-line no-param-reassign
-                            data[i].errorMessages = this.escapeStrings(data[i].errorMessages);
+                            field.errorMessages = this.escapeStrings(field.errorMessages);
                         }
 
-                        if (data[i].required) {
-                            requiredFields.push(data[i]);
+                        if (field.required) {
+                            requiredFields.push(field);
                         } else {
-                            optionalFields.push(data[i]);
+                            if (field.type !== 'hidden') {
+                                // For the purporse of displaying the optional field toggle,
+                                // the form should be considered to have optional fields
+                                // only if all of the optional fields are being rendering as
+                                // input elements that are visible on the page.
+                                this.hasOptionalFields = true;
+                            }
+                            optionalFields.push(field);
                         }
                     }
 
-                    this.hasOptionalFields = optionalFields.length > 0;
-
                     html = this.renderFields(requiredFields, 'required-fields');
 
                     html.push.apply(html, this.renderFields(optionalFields, 'optional-fields'));