'SAMLResponse generated but not posted to SP ACS

Using CA SiteMinder for implementing SAML solution. SP init flow is being tested. But the browser display is stuck on login page where creds are entered but on background authentication is successful and xhtml form with SAMLResponse inside in it (verified on browser DEV tools) is generated. JavaScript is already enabled on the browser. Logs are not helpful as the SAMLResponse is generated successfully. The below is the form seen on browser DEV tools. I modified the SAMLResponse. The behaviour is same on IE browser too. Is it the problem of UI not being able to understand/process XHTML? Please suggest how this can be solved.

<html>
<HEAD><META HTTP-EQUIV='PRAGMA' CONTENT='NO-CACHE'><META HTTP-EQUIV='CACHE-CONTROL' CONTENT='NO-CACHE'><TITLE>SAML 2.0 Auto-POST form</TITLE></HEAD>
   <body onLoad="document.forms[0].submit()">
<NOSCRIPT>Your browser does not support JavaScript.  Please click the 'Continue' button below to proceed. <br><br></NOSCRIPT>
      <form action="https://agiledev-groupncs.msappproxy.net/IdP/SSO.aspx" method="POST">
<input type="hidden" name="SAMLResponse" value="JpYnV0ZVZhbHVlPgogICAgICAgICAgICA8L25zMjpBdHRyaWJ1dGU+CiAgICAgICPC9uczI6QXNzZXJ0aW9uPgo8L1Jlc3BvbnNlPg==">
<NOSCRIPT><INPUT TYPE="SUBMIT" VALUE="Continue"></NOSCRIPT>
      </form>
   </body>
</html>


Solution 1:[1]

Its not a proper way to do it. You need a backend for that inorder to properly execute that. But if it just to play around you can have an alert box and just compare their value : if right it displays.

Solution 2:[2]

First, you have to add an id or a class to that inputs in order to select them within the script section. Afterward, you can select them and add any value you want. Such as:

<form>
  <!-- user-id -->
  <input id="user" type="text" />
  <!-- user-password -->
  <input id="pass" type="password" />

  <button onclick="window.open('./index.html')">Enter</button>
</form>
<script>
  document.getElementById("user").value = "UsernameOrId";
  document.getElementById("pass").value = "SomePassword";
</script>

In order to compare, you should get the right password from somewhere like a database or some service, but since this is purely for learning purposes you can hardcode it in the script for checking. So, the final solution can be similar to this:

<body>
<form>
  <!-- user-id -->
  <input id="user" type="text" />
  <!-- user-password -->
  <input id="pass" type="password" />

  <button id="btn">Enter</button>
</form>
<script>
  const myPass = "SomePassword";
  document.getElementById("user").value = "UsernameOrId"; // predefining the value simulating is saved and by default filled up
  document.getElementById("pass").value = myPass; // predefining the value simulating is saved and by default filled up
  const btn = document.getElementById("btn"); // getting the button to control its behavior on click event
  btn.addEventListener("click", function () {
    const passWhenClickingTheBtn = document.getElementById("pass").value;
    if (myPass === passWhenClickingTheBtn) {  // checking the value entered for pass
      window.open("./index.html");
    }
  });
</script>

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Bibek Shrestha
Solution 2 alexandrum