By default, the input type=”password” field leaves characters hidden.
If you need to place the eye button next to your password field, to display the password simply do the following

Bootstrap password input eye and show or not

In the test form we have:

<form>
<div class="mb-4">
        <!-- <label for="formLoginLabelSenha" class="d-none">Senha</label>
        <input placeholder="Senha" type="password" id="formLoginLabelSenha" class="form-control"
          v-model="register.password" required /> -->
        <div class="input-group mb-3">
          <!-- <span class="input-group-text"><i class="fa fa-lock"></i></span> -->
          <label for="formLoginLabelSenha" class="d-none">Senha</label>
          <input class="form-control border-end-0 border rounded" type="password" id="formLoginLabelSenha" name="password" placeholder="Senha" required>
          <span class="input-group-text" id="togglePassword" style="cursor: pointer">
            <i class="fa fa-eye" id="togglePasswordIcon"></i>
          </span>
        </div>
      </div>
</form>

In the part where your <script> tag is, place the following:

document.addEventListener("DOMContentLoaded", () => {
      const togglePassword = document.querySelector("#togglePassword");
      const password = document.querySelector("#formLoginLabelSenha");
      const togglePasswordIcon = document.querySelector("#togglePasswordIcon");

      togglePassword.addEventListener("click", function () {

        // toggle the type attribute
        const type = password.getAttribute("type") === "password" ? "text" : "password";
        password.setAttribute("type", type);
        // toggle the eye icon
        togglePasswordIcon.classList.toggle('fa-eye');
        togglePasswordIcon.classList.toggle('fa-eye-slash');
      });
    });

See more in https://jsfiddle.net/tellys/0jc5g68y/4/