test modal frame

lib/views/admin/widget/passport/google-oauth.html

@@ -7,6 +7,7 @@
 <form action="/_api/admin/security/passport-google" method="post" class="form-horizontal passportStrategy" id="googleSetting" role="form"
     {% if isRestartingServerNeeded %}style="opacity: 0.4;"{% endif %}>
   <legend>Google OAuth {{ t("security_setting.configuration") }}</legend>
+  <p class="well alert-anchor">{{ t("security_setting.connect_api_manager") }}</p>
   {% set nameForIsGoogleEnabled = "settingForm[security:passport-google:isEnabled]" %}
   {% set isGoogleEnabled = settingForm['security:passport-google:isEnabled'] %}
   <div class="form-group">
@@ -24,12 +25,8 @@
       </div>
     </div>
   </div>
-  <fieldset id="google-oauth-form">
+  <fieldset id="passport-google-hide-when-disabled" {%if !isGoogleEnabled %}style="display: none;"{% endif %}>
     <h4>{{ t("security_setting.google_setting") }}</h4>
-    <p class="well alert-anchor">
-      {{ t("security_setting.connect_api_manager") }}
-    </p>
-
     <ol class="help-block">
       <li>{{ t("security_setting.access_api_manager") }}</li>
       <li>{{ t("security_setting.create_project") }}</li>
@@ -59,6 +56,13 @@
     <div class="col-xs-offset-3 col-xs-6">
       <input type="hidden" name="_csrf" value="{{ csrf() }}">
       <button type="submit" class="btn btn-primary">{{ t('Update') }}</button>
+      <button type="button"
+            class="btn btn-default passport-google-hide-when-disabled"
+            data-target="#test-google-account" data-toggle="modal"
+            {%if !isGoogleEnabled %}style="display: none;"{% endif %}>
+
+          {{ t("security_setting.ldap.test_config") }}
+        </button>
     </div>
   </div>
 
@@ -139,15 +143,34 @@
 </ol>
 {% endif %}
 
+<div class="modal test-google-account" id="test-google-account">
+  <div class="modal-dialog">
+    <div class="modal-content">
+
+      <div class="modal-header">
+        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
+        <div class="modal-title">Test Google Account</div>
+      </div>
+
+      <div class="modal-body">
+
+        {% include '../../../widget/passport/ldap-association-tester.html' with { showLog: true } %}
+
+      </div><!-- /.modal-body -->
+
+    </div><!-- /.modal-content -->
+  </div><!-- /.modal-dialog -->
+</div><!-- /.modal -->
+
 <script>
   $('input[name="settingForm[security:passport-google:isEnabled]"]').change(function() {
       const isEnabled = ($(this).val() === "true");
 
       if (isEnabled) {
-        $('#google-oauth-form').show(400);
+        $('#passport-google-hide-when-disabled').show(400);
       }
       else {
-        $('#google-oauth-form').hide(400);
+        $('#passport-google-hide-when-disabled').hide(400);
       }
     });
 </script>