How to submit data in a form with javascript

Question

I spent hours looking for, but I couldn't find a solution. I'v to automatize a human job with JS, and I ran some tests in aleatory sites and it works. But in a specific site, i'm having the following problem on the login page:

OBS: I'm doing this in browser console, for tests.

var username = window.document.getElementById("username")
undefined
var password = window.document.getElementById("password")
undefined
var signin = window.document.querySelector(".splButton-primary.btn")
undefined
username.value = "usuariovalue"
"usuariovalue"
password.value = "passwordvalue"
"password value"
signin.click()

but, i'm receiving this msg:>common.js:27 POST https://siteexemple/en-US/account/login 401 (Unauthorized). If I fill the username and password manually in site and after, click on the button using the JS, it works.

I can't see the difference.

Follow the block of code of the site:

  <form method="post" class="loginForm" action="/en-US/account/login">
        <div style="display: none" data-cid="view200" class="account-login-firsttime" data-view="views/account/login/FirstTime" data-render-time="0">
  <h2>First time signing in?</h2>
  <p>If you've forgotten your username or password, please contact your Splunk administrator.</p>
  <table>
       <tbody><tr>
          <td>username</td>
          <td>admin</td>
       </tr>
       <tr>
           <td>password</td>
          <td>changeme</td>
   </tr>
   </tbody>
  </table>
 </div>
 <fieldset>   
         <div class="control account-login-textcontrol control-default" data-cid="view197" data-view="views/account/login/TextControl" data-name="username" data-render-time="0">
          <span class="uneditable-input " data-role="uneditable-input" style="display:none"></span>         
   <input type="text" name="username" class="  " value="" autocomplete="off" id="username" placeholder="Username">                                    </div>
  <div class="control account-login-textcontrol control-default" data-cid="view199" data-view="views/account/login/TextControl" data-name="password" data-render-time="0">         
  <span class="uneditable-input " data-role="uneditable-input" style="display:none"></span>         
  <input type="password" name="password" class="  " value="" autocomplete="off" id="password" placeholder="Password">                                    </div><input class="splButton-primary btn" type="submit" value="Sign in">
            <input type="hidden" name="cval" value="1900007162">
             <input type="hidden" name="return_to" value="/en-US/">
        </fieldset>
   </form>

Can you, help me? I'm starting with JS.