browser/components/aboutlogins/tests/mochitest/test_login_item.html
author pulselistener
Sat, 18 May 2019 06:39:15 +0000
changeset 2008497 3410217e5955a623079e45a02efc240c7265762b
parent 2000054 abde24c1d7eee05672ed2b12e35d41869421b7db
child 2008575 e1fb67d904f884b8220b870ad7f057a621c0a4bc
child 2015671 68cdd901590b9d6e3f7e803a2633339dc8c0c637
child 2015800 4dabbbf229cc3482f323a8f99bf8767c33fc5199
permissions -rw-r--r--
Bug 1551696 - Remove type=text/css from style references since its not necessary. r=MattN Differential Revision: https://phabricator.services.mozilla.com/D31283 Differential Diff: PHID-DIFF-3d7rkdeopnklz57y6l2b

<!DOCTYPE HTML>
<html>
<!--
Test the login-item component
-->
<head>
  <meta charset="utf-8">
  <title>Test the login-item component</title>
  <script src="/tests/SimpleTest/SimpleTest.js"></script>
  <script src="reflected-fluent-element.js"></script>
  <script src="login-item.js"></script>
  <script src="modal-input.js"></script>
  <script src="aboutlogins_common.js"></script>

  <link rel="stylesheet" href="/tests/SimpleTest/test.css"/>
</head>
<body>
  <p id="display">
  </p>
<div id="content" style="display: none">
  <iframe id="templateFrame" src="aboutLogins.html"
          sandbox="allow-same-origin"></iframe>
</div>
<pre id="test">
</pre>
<script>
/** Test the login-item component **/

let gLoginItem;
const TEST_LOGIN_1 = {
  guid: "123456789",
  hostname: "https://example.com",
  username: "user1",
  password: "pass1",
  timeCreated: "1000",
  timePasswordChanged: "2000",
  timeLastUsed: "4000",
};

add_task(async function setup() {
  stubFluentL10n({
    "time-created": "timeCreated",
    "time-changed": "timeChanged",
    "time-used": "timeUsed",
  });

  let templateFrame = document.getElementById("templateFrame");
  let displayEl = document.getElementById("display");
  importDependencies(templateFrame, displayEl);

  gLoginItem = document.createElement("login-item");
  displayEl.appendChild(gLoginItem);
});

add_task(async function test_empty_item() {
  ok(gLoginItem, "loginItem exists");
  is(gLoginItem.shadowRoot.querySelector(".hostname").textContent, "", "hostname should be blank");
  is(gLoginItem.shadowRoot.querySelector("modal-input[name='username']").value, "", "username should be blank");
  is(gLoginItem.shadowRoot.querySelector("modal-input[name='password']").value, "", "password should be blank");
  is(gLoginItem.shadowRoot.querySelector(".time-created").textContent, "", "time-created should be blank");
  is(gLoginItem.shadowRoot.querySelector(".time-changed").textContent, "", "time-changed should be blank");
  is(gLoginItem.shadowRoot.querySelector(".time-used").textContent, "", "time-used should be blank");
});

add_task(async function test_set_login() {
  gLoginItem.setLogin(TEST_LOGIN_1);
  await asyncElementRendered();

  is(gLoginItem.shadowRoot.querySelector(".hostname").textContent, TEST_LOGIN_1.hostname, "hostname should be populated");
  is(gLoginItem.shadowRoot.querySelector("modal-input[name='username']").value, TEST_LOGIN_1.username, "username should be populated");
  is(gLoginItem.shadowRoot.querySelector("modal-input[name='password']").value, TEST_LOGIN_1.password, "password should be populated");
  is(gLoginItem.shadowRoot.querySelector(".time-created").textContent, TEST_LOGIN_1.timeCreated, "time-created should be populated");
  is(gLoginItem.shadowRoot.querySelector(".time-changed").textContent, TEST_LOGIN_1.timePasswordChanged, "time-changed should be populated");
  is(gLoginItem.shadowRoot.querySelector(".time-used").textContent, TEST_LOGIN_1.timeLastUsed, "time-used should be populated");
});

add_task(async function test_different_login_modified() {
  let otherLogin = Object.assign({}, TEST_LOGIN_1, {username: "fakeuser", guid: "fakeguid"});
  gLoginItem.loginModified(otherLogin);
  await asyncElementRendered();

  is(gLoginItem.shadowRoot.querySelector(".hostname").textContent, TEST_LOGIN_1.hostname, "hostname should be unchanged");
  is(gLoginItem.shadowRoot.querySelector("modal-input[name='username']").value, TEST_LOGIN_1.username, "username should be unchanged");
  is(gLoginItem.shadowRoot.querySelector("modal-input[name='password']").value, TEST_LOGIN_1.password, "password should be unchanged");
  is(gLoginItem.shadowRoot.querySelector(".time-created").textContent, TEST_LOGIN_1.timeCreated, "time-created should be unchanged");
  is(gLoginItem.shadowRoot.querySelector(".time-changed").textContent, TEST_LOGIN_1.timePasswordChanged, "time-changed should be unchanged");
  is(gLoginItem.shadowRoot.querySelector(".time-used").textContent, TEST_LOGIN_1.timeLastUsed, "time-used should be unchanged");
});

add_task(async function test_different_login_removed() {
  let otherLogin = Object.assign({}, TEST_LOGIN_1, {username: "fakeuser", guid: "fakeguid"});
  gLoginItem.loginRemoved(otherLogin);
  await asyncElementRendered();

  is(gLoginItem.shadowRoot.querySelector(".hostname").textContent, TEST_LOGIN_1.hostname, "hostname should be unchanged");
  is(gLoginItem.shadowRoot.querySelector("modal-input[name='username']").value, TEST_LOGIN_1.username, "username should be unchanged");
  is(gLoginItem.shadowRoot.querySelector("modal-input[name='password']").value, TEST_LOGIN_1.password, "password should be unchanged");
  is(gLoginItem.shadowRoot.querySelector(".time-created").textContent, TEST_LOGIN_1.timeCreated, "time-created should be unchanged");
  is(gLoginItem.shadowRoot.querySelector(".time-changed").textContent, TEST_LOGIN_1.timePasswordChanged, "time-changed should be unchanged");
  is(gLoginItem.shadowRoot.querySelector(".time-used").textContent, TEST_LOGIN_1.timeLastUsed, "time-used should be unchanged");
});

add_task(async function test_login_modified() {
  let modifiedLogin = Object.assign({}, TEST_LOGIN_1, {username: "updateduser"});
  gLoginItem.loginModified(modifiedLogin);
  await asyncElementRendered();

  is(gLoginItem.shadowRoot.querySelector(".hostname").textContent, modifiedLogin.hostname, "hostname should be updated");
  is(gLoginItem.shadowRoot.querySelector("modal-input[name='username']").value, modifiedLogin.username, "username should be updated");
  is(gLoginItem.shadowRoot.querySelector("modal-input[name='password']").value, modifiedLogin.password, "password should be updated");
  is(gLoginItem.shadowRoot.querySelector(".time-created").textContent, modifiedLogin.timeCreated, "time-created should be updated");
  is(gLoginItem.shadowRoot.querySelector(".time-changed").textContent, modifiedLogin.timePasswordChanged, "time-changed should be updated");
  is(gLoginItem.shadowRoot.querySelector(".time-used").textContent, modifiedLogin.timeLastUsed, "time-used should be updated");
});

add_task(async function test_login_removed() {
  gLoginItem.loginRemoved(TEST_LOGIN_1);
  await asyncElementRendered();

  is(gLoginItem.shadowRoot.querySelector(".hostname").textContent, "", "hostname should be cleared");
  is(gLoginItem.shadowRoot.querySelector("modal-input[name='username']").value, "", "username should be cleared");
  is(gLoginItem.shadowRoot.querySelector("modal-input[name='password']").value, "", "password should be cleared");
  is(gLoginItem.shadowRoot.querySelector(".time-created").textContent, "", "time-created should be cleared");
  is(gLoginItem.shadowRoot.querySelector(".time-changed").textContent, "", "time-changed should be cleared");
  is(gLoginItem.shadowRoot.querySelector(".time-used").textContent, "", "time-used should be cleared");
});

</script>

</body>
</html>