
<!DOCTYPE HTML>
<html>
<head>
  <meta charset="utf-8">
  <title>Test interaction between autocomplete and focus on username fields</title>
  <script src="/tests/SimpleTest/SimpleTest.js"></script>
  <script src="/tests/SimpleTest/EventUtils.js"></script>
  <script type="text/javascript" src="../../../satchel/test/satchel_common.js"></script>
  <script type="text/javascript" src="pwmgr_common.js"></script>
  <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css" />
</head>
<body>
<p id="display"></p>
<div id="content"></div>
<pre id="test">
<script class="testbody" type="text/javascript">
const action1 = "http://username-focus-1";
const action2 = "http://username-focus-2";

add_setup(async () => {
  await setStoredLoginsAsync(
    [location.origin, action1, null, "testuser1A", "testpass1A", "", ""],
    [location.origin, action2, null, "testuser2A", "testpass2A", "", ""],
    [location.origin, action2, null, "testuser2B", "testpass2B", "", ""]
  );
});

add_task(async function autofilled() {
  const form = createLoginForm({ action: action1 });

  info("Username and password already filled so don't show autocomplete");
  await noPopupBy(() => form.uname.focus());

  form.submit.focus();
  form.uname.value = "testuser";
  info("Focus when we don't have an exact match");
  await popupBy(() => form.uname.focus());
});

add_task(async function autofilled_prefilled_un() {
  const form = createLoginForm({
    action: action1,
    username: {
      value: "testuser1A"
    }
  });

  info("Username and password already filled so don't show autocomplete");
  await noPopupBy(() => form.uname.focus());

  form.submit.focus();
  form.uname.value = "testuser";
  info("Focus when we don't have an exact match");
  await popupBy(() => form.uname.focus());
});

add_task(async function autofilled_focused_dynamic() {
  const form = createLoginForm({
    action: action1,
    password: {
      type: "not-yet-password"
    }
  });

  info("Username and password will be filled while username focused");
  await noPopupBy(() => form.uname.focus());

  info("triggering autofill");
  await noPopupBy(() => form.pword.type = "password");

  const popupState = await getPopupState();
  is(popupState.open, false, "Check popup is closed");

  form.submit.focus();
  form.pword.value = "test";
  info("Focus when we don't have an exact match");
  await popupBy(() => form.uname.focus());
});

// Begin testing forms that have multiple saved logins

add_task(async function multiple() {
  const form = createLoginForm({ action: action2 });

  info("Fields not filled due to multiple so autocomplete upon focus");
  await popupBy(() => form.uname.focus());
});

add_task(async function multiple_dynamic() {
  const form = createLoginForm({
    action: action2,
    password: {
      type: "not-yet-password"
    }
  });

  info("Fields not filled but username is focused upon marking so open");
  await noPopupBy(() => form.uname.focus());

  info("triggering _fillForm code");
  await popupBy(() => form.pword.type = "password");
});

add_task(async function multiple_prefilled_un1() {
  const form = createLoginForm({
    action: action2,
    username: {
      value: "testuser2A"
    }
  });

  info("Username and password already filled so don't show autocomplete");
  await noPopupBy(() => form.uname.focus());

  form.submit.focus();
  form.uname.value = "testuser";
  info("Focus when we don't have an exact match");
  await popupBy(() => form.uname.focus());
});

add_task(async function multiple_prefilled_un2() {
  const form = createLoginForm({
    action: action2,
    username: {
      value: "testuser2B"
    }
  });

  info("Username and password already filled so don't show autocomplete");
  await noPopupBy(() => form.uname.focus());

  form.submit.focus();
  form.uname.value = "testuser";
  info("Focus when we don't have an exact match");
  await popupBy(() => form.uname.focus());
});

add_task(async function multiple_prefilled_focused_dynamic() {
  const form = createLoginForm({
    action: action2,
    username: {
      value: "testuser2B"
    },
    password: {
      type: "not-yet-password"
    }
  });

  info("Username and password will be filled while username focused");
  await noPopupBy(() => form.uname.focus());
  info("triggering autofill");
  await noPopupBy(() => form.pword.type = "password");

  let popupState = await getPopupState();
  is(popupState.open, false, "Check popup is closed");

  form.submit.focus();
  form.pword.value = "test";
  info("Focus when we don't have an exact match");
  await popupBy(() => form.uname.focus());
});
</script>
</pre>
</body>
</html>
