Rework styling of other login method template

author: Christian Kollmann <christian.kollmann@a-sit.at> 2021-12-07 08:41:16 +0100
committer: Christian Kollmann <christian.kollmann@a-sit.at> 2021-12-07 11:01:13 +0100
commit: 514f99284299882ce9b3e7741094eb55561b503e (patch)
tree: 48d30dab8986e278d39d6602fce00d76c936d29a
parent: 02c69d2a137663f5aeefcb4cfacd1a163e7af5db (diff)
download: National_eIDAS_Gateway-514f99284299882ce9b3e7741094eb55561b503e.tar.gz
National_eIDAS_Gateway-514f99284299882ce9b3e7741094eb55561b503e.tar.bz2
National_eIDAS_Gateway-514f99284299882ce9b3e7741094eb55561b503e.zip
4 files changed, 150 insertions, 137 deletions
diff --git a/basicConfig/templates/other_login_method.html b/basicConfig/templates/other_login_method.html
index c233c5c4..ea15864e 100644
--- a/basicConfig/templates/other_login_method.html
+++ b/basicConfig/templates/other_login_method.html
@@ -8,6 +8,16 @@
     <meta name="viewport" content="width=device-width, initial-scale=1">
     <link rel="stylesheet" href="$contextPath/static/css/css_country.css" th:href="@{/static/css/css_country.css}"/>
     <title th:text="#{gui.otherlogin.title}">eIDAS-Login Other Login Methods</title>
+    <style>
+        .block {
+            width: 100%;
+        }
+        button {
+            padding: 0.5em;
+            margin: 0.5em;
+            width: 20em;
+        }
+    </style>
 </head>
 <body>
 <div class="header container">
@@ -41,29 +51,32 @@
 
     <h1 th:text="#{gui.otherlogin.header.selection}"> Select an alternative login method </h1>
 
-    <div id="otherlogin">
-        <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
-            <input type="submit" role="button" value="Handy-Signatur / Mobile Signature"
-                   th:attr="value=#{gui.otherlogin.hs}"/>
+    <div id="otherlogin" class="block">
+        <form method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
+            <button type="submit" role="button" value="Handy-Signatur / Mobile Signature"
+                    th:text="#{gui.otherlogin.hs}">A
+            </button>
             <input type="hidden" name="loginSelection" value="MOBILE_PHONE_SIGNATURE_LOGIN">
             <input type="hidden" name="pendingid" value="$pendingid" th:attr="value=${pendingid}"/>
         </form>
-        <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
-            <input type="submit" role="button" value="Andere eIDAS ID" th:attr="value=#{gui.otherlogin.eidas}"/>
+        <form method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
+            <button type="submit" role="button" value="Andere eIDAS ID" th:text="#{gui.otherlogin.eidas}">B
+            </button>
             <input type="hidden" name="loginSelection" value="EIDAS_LOGIN">
             <input type="hidden" name="pendingid" value="$pendingid" th:attr="value=${pendingid}"/>
         </form>
-        <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
-            <input type="submit" role="button" value="Keine weitere HS / eIDAS" th:attr="value=#{gui.otherlogin.none}"/>
+        <form method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
+            <button type="submit" role="button" value="Keine weitere HS / eIDAS"
+                    th:text="#{gui.otherlogin.none}">C
+            </button>
             <input type="hidden" name="loginSelection" value="NO_OTHER_LOGIN">
             <input type="hidden" name="pendingid" value="$pendingid" th:attr="value=${pendingid}"/>
         </form>
     </div>
 
     <!-- Abbrechen Button -->
-    <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
-        <input type="submit" class="btn btn-outline-primary btn-block" value="Abbrechen/Cancel"
-               th:attr="value=#{gui.otherlogin.cancel}">
+    <form method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
+        <button type="submit" value="Abbrechen/Cancel" th:text="#{gui.otherlogin.cancel}"></button>
         <input type="hidden" name="stopAuthProcess" value="true">
         <input type="hidden" name="pendingid" value="$pendingid" th:attr="value=${pendingid}">
     </form>
diff --git a/connector/src/main/resources/templates/other_login_method.html b/connector/src/main/resources/templates/other_login_method.html
index c233c5c4..ea15864e 100644
--- a/connector/src/main/resources/templates/other_login_method.html
+++ b/connector/src/main/resources/templates/other_login_method.html
@@ -8,6 +8,16 @@
     <meta name="viewport" content="width=device-width, initial-scale=1">
     <link rel="stylesheet" href="$contextPath/static/css/css_country.css" th:href="@{/static/css/css_country.css}"/>
     <title th:text="#{gui.otherlogin.title}">eIDAS-Login Other Login Methods</title>
+    <style>
+        .block {
+            width: 100%;
+        }
+        button {
+            padding: 0.5em;
+            margin: 0.5em;
+            width: 20em;
+        }
+    </style>
 </head>
 <body>
 <div class="header container">
@@ -41,29 +51,32 @@
 
     <h1 th:text="#{gui.otherlogin.header.selection}"> Select an alternative login method </h1>
 
-    <div id="otherlogin">
-        <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
-            <input type="submit" role="button" value="Handy-Signatur / Mobile Signature"
-                   th:attr="value=#{gui.otherlogin.hs}"/>
+    <div id="otherlogin" class="block">
+        <form method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
+            <button type="submit" role="button" value="Handy-Signatur / Mobile Signature"
+                    th:text="#{gui.otherlogin.hs}">A
+            </button>
             <input type="hidden" name="loginSelection" value="MOBILE_PHONE_SIGNATURE_LOGIN">
             <input type="hidden" name="pendingid" value="$pendingid" th:attr="value=${pendingid}"/>
         </form>
-        <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
-            <input type="submit" role="button" value="Andere eIDAS ID" th:attr="value=#{gui.otherlogin.eidas}"/>
+        <form method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
+            <button type="submit" role="button" value="Andere eIDAS ID" th:text="#{gui.otherlogin.eidas}">B
+            </button>
             <input type="hidden" name="loginSelection" value="EIDAS_LOGIN">
             <input type="hidden" name="pendingid" value="$pendingid" th:attr="value=${pendingid}"/>
         </form>
-        <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
-            <input type="submit" role="button" value="Keine weitere HS / eIDAS" th:attr="value=#{gui.otherlogin.none}"/>
+        <form method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
+            <button type="submit" role="button" value="Keine weitere HS / eIDAS"
+                    th:text="#{gui.otherlogin.none}">C
+            </button>
             <input type="hidden" name="loginSelection" value="NO_OTHER_LOGIN">
             <input type="hidden" name="pendingid" value="$pendingid" th:attr="value=${pendingid}"/>
         </form>
     </div>
 
     <!-- Abbrechen Button -->
-    <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
-        <input type="submit" class="btn btn-outline-primary btn-block" value="Abbrechen/Cancel"
-               th:attr="value=#{gui.otherlogin.cancel}">
+    <form method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
+        <button type="submit" value="Abbrechen/Cancel" th:text="#{gui.otherlogin.cancel}"></button>
         <input type="hidden" name="stopAuthProcess" value="true">
         <input type="hidden" name="pendingid" value="$pendingid" th:attr="value=${pendingid}">
     </form>
diff --git a/connector/src/test/resources/config/templates/other_login_method.html b/connector/src/test/resources/config/templates/other_login_method.html
index c233c5c4..ea15864e 100644
--- a/connector/src/test/resources/config/templates/other_login_method.html
+++ b/connector/src/test/resources/config/templates/other_login_method.html
@@ -8,6 +8,16 @@
     <meta name="viewport" content="width=device-width, initial-scale=1">
     <link rel="stylesheet" href="$contextPath/static/css/css_country.css" th:href="@{/static/css/css_country.css}"/>
     <title th:text="#{gui.otherlogin.title}">eIDAS-Login Other Login Methods</title>
+    <style>
+        .block {
+            width: 100%;
+        }
+        button {
+            padding: 0.5em;
+            margin: 0.5em;
+            width: 20em;
+        }
+    </style>
 </head>
 <body>
 <div class="header container">
@@ -41,29 +51,32 @@
 
     <h1 th:text="#{gui.otherlogin.header.selection}"> Select an alternative login method </h1>
 
-    <div id="otherlogin">
-        <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
-            <input type="submit" role="button" value="Handy-Signatur / Mobile Signature"
-                   th:attr="value=#{gui.otherlogin.hs}"/>
+    <div id="otherlogin" class="block">
+        <form method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
+            <button type="submit" role="button" value="Handy-Signatur / Mobile Signature"
+                    th:text="#{gui.otherlogin.hs}">A
+            </button>
             <input type="hidden" name="loginSelection" value="MOBILE_PHONE_SIGNATURE_LOGIN">
             <input type="hidden" name="pendingid" value="$pendingid" th:attr="value=${pendingid}"/>
         </form>
-        <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
-            <input type="submit" role="button" value="Andere eIDAS ID" th:attr="value=#{gui.otherlogin.eidas}"/>
+        <form method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
+            <button type="submit" role="button" value="Andere eIDAS ID" th:text="#{gui.otherlogin.eidas}">B
+            </button>
             <input type="hidden" name="loginSelection" value="EIDAS_LOGIN">
             <input type="hidden" name="pendingid" value="$pendingid" th:attr="value=${pendingid}"/>
         </form>
-        <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
-            <input type="submit" role="button" value="Keine weitere HS / eIDAS" th:attr="value=#{gui.otherlogin.none}"/>
+        <form method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
+            <button type="submit" role="button" value="Keine weitere HS / eIDAS"
+                    th:text="#{gui.otherlogin.none}">C
+            </button>
             <input type="hidden" name="loginSelection" value="NO_OTHER_LOGIN">
             <input type="hidden" name="pendingid" value="$pendingid" th:attr="value=${pendingid}"/>
         </form>
     </div>
 
     <!-- Abbrechen Button -->
-    <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
-        <input type="submit" class="btn btn-outline-primary btn-block" value="Abbrechen/Cancel"
-               th:attr="value=#{gui.otherlogin.cancel}">
+    <form method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
+        <button type="submit" value="Abbrechen/Cancel" th:text="#{gui.otherlogin.cancel}"></button>
         <input type="hidden" name="stopAuthProcess" value="true">
         <input type="hidden" name="pendingid" value="$pendingid" th:attr="value=${pendingid}">
     </form>
diff --git a/eidas_modules/authmodule-eIDAS-v2/src/test/java/at/asitplus/eidas/specific/modules/auth/eidas/v2/test/tasks/GenerateOtherLoginMethodGuiTaskTest.java b/eidas_modules/authmodule-eIDAS-v2/src/test/java/at/asitplus/eidas/specific/modules/auth/eidas/v2/test/tasks/GenerateOtherLoginMethodGuiTaskTest.java
index 7c4f8a41..f17f69c3 100644
--- a/eidas_modules/authmodule-eIDAS-v2/src/test/java/at/asitplus/eidas/specific/modules/auth/eidas/v2/test/tasks/GenerateOtherLoginMethodGuiTaskTest.java
+++ b/eidas_modules/authmodule-eIDAS-v2/src/test/java/at/asitplus/eidas/specific/modules/auth/eidas/v2/test/tasks/GenerateOtherLoginMethodGuiTaskTest.java
@@ -1,12 +1,15 @@
 package at.asitplus.eidas.specific.modules.auth.eidas.v2.test.tasks;
 
-import static org.junit.Assert.assertNotNull;
-import static org.junit.Assert.assertTrue;
-
-import java.io.UnsupportedEncodingException;
-import java.text.MessageFormat;
-import java.util.Locale;
-
+import at.asitplus.eidas.specific.modules.auth.eidas.v2.Constants;
+import at.asitplus.eidas.specific.modules.auth.eidas.v2.dao.SelectedLoginMethod;
+import at.asitplus.eidas.specific.modules.auth.eidas.v2.tasks.GenerateOtherLoginMethodGuiTask;
+import at.gv.egiz.eaaf.core.exceptions.TaskExecutionException;
+import at.gv.egiz.eaaf.core.impl.idp.module.test.TestRequestImpl;
+import at.gv.egiz.eaaf.core.impl.idp.process.ExecutionContextImpl;
+import com.fasterxml.jackson.databind.JsonNode;
+import com.fasterxml.jackson.databind.ObjectMapper;
+import com.fasterxml.jackson.databind.json.JsonMapper;
+import lombok.SneakyThrows;
 import org.apache.commons.lang3.RandomStringUtils;
 import org.junit.Assert;
 import org.junit.Before;
@@ -23,17 +26,12 @@ import org.springframework.test.context.web.WebAppConfiguration;
 import org.springframework.web.context.request.RequestContextHolder;
 import org.springframework.web.context.request.ServletRequestAttributes;
 
-import com.fasterxml.jackson.databind.JsonNode;
-import com.fasterxml.jackson.databind.ObjectMapper;
-import com.fasterxml.jackson.databind.json.JsonMapper;
+import java.io.UnsupportedEncodingException;
+import java.text.MessageFormat;
+import java.util.Locale;
 
-import at.asitplus.eidas.specific.modules.auth.eidas.v2.Constants;
-import at.asitplus.eidas.specific.modules.auth.eidas.v2.dao.SelectedLoginMethod;
-import at.asitplus.eidas.specific.modules.auth.eidas.v2.tasks.GenerateOtherLoginMethodGuiTask;
-import at.gv.egiz.eaaf.core.exceptions.TaskExecutionException;
-import at.gv.egiz.eaaf.core.impl.idp.module.test.TestRequestImpl;
-import at.gv.egiz.eaaf.core.impl.idp.process.ExecutionContextImpl;
-import lombok.SneakyThrows;
+import static org.junit.Assert.assertNotNull;
+import static org.junit.Assert.assertTrue;
 
 @RunWith(SpringJUnit4ClassRunner.class)
 @ContextConfiguration(locations = {
@@ -44,27 +42,27 @@ import lombok.SneakyThrows;
 @WebAppConfiguration
 public class GenerateOtherLoginMethodGuiTaskTest {
 
-  private static final String TEST_PATTER_REQ_PARAM = 
+  private static final String TEST_PATTER_REQ_PARAM =
       "<input type=\"hidden\" name=\"loginSelection\" value=\"{0}\">";
-  
+
   private static ObjectMapper mapper = new ObjectMapper();
-  
-  @Autowired GenerateOtherLoginMethodGuiTask task;
-  
+
+  @Autowired
+  GenerateOtherLoginMethodGuiTask task;
+
   private ExecutionContextImpl executionContext = new ExecutionContextImpl();
   private TestRequestImpl pendingReq;
   private MockHttpServletRequest httpReq;
   private MockHttpServletResponse httpResp;
-  
+
   @BeforeClass
   public static void classInitializer() {
     Locale.setDefault(Locale.ENGLISH);
-   
+
   }
-  
+
   /**
    * jUnit test set-up.
-   * 
    */
   @Before
   public void initialize() {
@@ -72,130 +70,106 @@ public class GenerateOtherLoginMethodGuiTaskTest {
     httpResp = new MockHttpServletResponse();
     RequestContextHolder.resetRequestAttributes();
     RequestContextHolder.setRequestAttributes(new ServletRequestAttributes(httpReq, httpResp));
-    
+
     pendingReq = new TestRequestImpl();
     pendingReq.setAuthUrl("https://localhost/ms_connector");
     pendingReq.setPendingReqId(RandomStringUtils.randomAlphanumeric(10));
-    
+
     LocaleContextHolder.resetLocaleContext();
   }
-  
-  
+
+
   @Test
   @SneakyThrows
-  public void jsonResponse() throws TaskExecutionException, UnsupportedEncodingException {    
-       
+  public void jsonResponse() throws TaskExecutionException, UnsupportedEncodingException {
+
     executionContext.put(Constants.CONTEXT_FLAG_ADVANCED_MATCHING_FAILED, true);
     httpReq.addHeader("Accept", "application/json");
-    
+
     task.execute(pendingReq, executionContext);
-    
+
     //result validation
     Assert.assertEquals("httpStausCode", 200, httpResp.getStatus());
     Assert.assertEquals("http ContentType", "application/json;charset=UTF-8", httpResp.getContentType());
     final String content = httpResp.getContentAsString();
     assertNotNull("response body is null", content);
     Assert.assertFalse("response body is empty", content.isEmpty());
-    final JsonNode json = new JsonMapper().readTree(content);    
-    assertNotNull("response body is null", json);    
+    final JsonNode json = new JsonMapper().readTree(content);
+    assertNotNull("response body is null", json);
     assertNotNull("advancedMatchFailed", json.get(Constants.HTML_FORM_ADVANCED_MATCHING_FAILED));
     assertTrue("advancedMatchFailed", json.get(Constants.HTML_FORM_ADVANCED_MATCHING_FAILED).asBoolean());
-    
+
   }
-  
+
   @Test
-  public void advancedMatchingFailedMsg() throws TaskExecutionException, UnsupportedEncodingException {    
-       
+  public void advancedMatchingFailedMsg() throws TaskExecutionException, UnsupportedEncodingException {
+
     executionContext.put(Constants.CONTEXT_FLAG_ADVANCED_MATCHING_FAILED, true);
-    
+
     task.execute(pendingReq, executionContext);
-    
-    //result validation
-    String html = doBasicValidation();
-    
-    Assert.assertTrue("No english text", 
-        html.contains("Matching of further information failed"));
-    
+
+    doBasicValidation();
+
   }
-  
+
   @Test
-  public void validHtmlResponseWithOutLocale() throws TaskExecutionException, UnsupportedEncodingException {    
-       
+  public void validHtmlResponseWithOutLocale() throws TaskExecutionException, UnsupportedEncodingException {
+
     task.execute(pendingReq, executionContext);
-    
-    //result validation
-    String html = doBasicValidation();
-    
-    Assert.assertTrue("No english text", 
-        html.contains("Information on Logins with European eIDs"));
-    Assert.assertFalse("No english text", 
-        html.contains("Matching of further information failed"));
-    
+
+    doBasicValidation();
+
   }
-  
+
   @Test
-  public void validHtmlResponseWithDE() throws TaskExecutionException, UnsupportedEncodingException {    
+  public void validHtmlResponseWithDE() throws TaskExecutionException, UnsupportedEncodingException {
     LocaleContextHolder.setLocale(Locale.GERMAN);
     httpReq.addHeader("Accept-Language", "de");
-    
+
     task.execute(pendingReq, executionContext);
-    
-    //result validation
-    String html = doBasicValidation();
-    
-    Assert.assertTrue("No english text", 
-        html.contains("Information zur Anmeldung über Europäische eIDs"));
-    
+
+    doBasicValidation();
+
   }
-  
+
   @Test
-  public void validHtmlResponseWithEN() throws TaskExecutionException, UnsupportedEncodingException {    
+  public void validHtmlResponseWithEN() throws TaskExecutionException, UnsupportedEncodingException {
     LocaleContextHolder.setLocale(Locale.ENGLISH);
-    
+
     task.execute(pendingReq, executionContext);
-    
-    //result validation
-    String html = doBasicValidation();
-    
-    Assert.assertTrue("No english text", 
-        html.contains("Information on Logins with European eIDs"));
-    
+
+    doBasicValidation();
+
   }
-  
+
   @Test
-  public void validHtmlResponseWithFR() throws TaskExecutionException, UnsupportedEncodingException {    
+  public void validHtmlResponseWithFR() throws TaskExecutionException, UnsupportedEncodingException {
     LocaleContextHolder.setLocale(Locale.FRANCE);
     httpReq.addHeader("Accept-Language", "fr");
-    
+
     task.execute(pendingReq, executionContext);
-    
-    //result validation
-    String html = doBasicValidation();
-    
-    Assert.assertTrue("No english text", 
-        html.contains("Information on Logins with European eIDs"));
-    
+
+    doBasicValidation();
+
   }
-  
-  private String doBasicValidation() throws UnsupportedEncodingException {
+
+  private void doBasicValidation() throws UnsupportedEncodingException {
     Assert.assertEquals("Wrong http StatusCode", 200, httpResp.getStatus());
     Assert.assertEquals("Wrong http ContentType", "text/html;charset=UTF-8", httpResp.getContentType());
-    
+
     String html = httpResp.getContentAsString();
     Assert.assertNotNull("html result is null", html);
-    Assert.assertFalse("html result is empty", html.isEmpty());    
-    
-    Assert.assertTrue("Missing IDA Login", 
+    Assert.assertFalse("html result is empty", html.isEmpty());
+
+    Assert.assertTrue("Missing IDA Login",
         html.contains(MessageFormat.format(TEST_PATTER_REQ_PARAM, SelectedLoginMethod.MOBILE_PHONE_SIGNATURE_LOGIN)));
-    Assert.assertTrue("Missing residence infos", 
+    Assert.assertTrue("Missing residence infos",
         html.contains(MessageFormat.format(TEST_PATTER_REQ_PARAM, SelectedLoginMethod.NO_OTHER_LOGIN)));
-        
-    Assert.assertTrue("No language selector with pendingRequestId", 
+
+    Assert.assertTrue("No language selector with pendingRequestId",
         html.contains("/otherLoginMethod?pendingid=" + pendingReq.getPendingRequestId()));
-    Assert.assertTrue("No country-selection form", 
-        html.contains("<form class=\"block\" method=\"post\" action=\"/otherLoginMethod\">"));
-        
-    return html;
-    
+    Assert.assertTrue("No country-selection form",
+        html.contains("<form method=\"post\" action=\"/otherLoginMethod\">"));
+
   }
 }
author	Christian Kollmann <christian.kollmann@a-sit.at>	2021-12-07 08:41:16 +0100
committer	Christian Kollmann <christian.kollmann@a-sit.at>	2021-12-07 11:01:13 +0100
commit	514f99284299882ce9b3e7741094eb55561b503e (patch)
tree	48d30dab8986e278d39d6602fce00d76c936d29a
parent	02c69d2a137663f5aeefcb4cfacd1a163e7af5db (diff)
download	National_eIDAS_Gateway-514f99284299882ce9b3e7741094eb55561b503e.tar.gz National_eIDAS_Gateway-514f99284299882ce9b3e7741094eb55561b503e.tar.bz2 National_eIDAS_Gateway-514f99284299882ce9b3e7741094eb55561b503e.zip