tor-browser

The Tor Browser
git clone https://git.dasho.dev/tor-browser.git
Log | Files | Refs | README | LICENSE

test_formautofill_preview_highlight.html (3491B)


      1 <!DOCTYPE HTML>
      2 <html>
      3 <head>
      4  <meta charset="utf-8">
      5  <title>Test form autofill - preview and highlight</title>
      6  <script src="/tests/SimpleTest/SimpleTest.js"></script>
      7  <script src="/tests/SimpleTest/EventUtils.js"></script>
      8  <script type="text/javascript" src="formautofill_common.js"></script>
      9  <script type="text/javascript" src="satchel_common.js"></script>
     10  <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css" />
     11 </head>
     12 <body>
     13 Form autofill test: preview and highlight
     14 
     15 <script>
     16 /* import-globals-from ../../../../../toolkit/components/satchel/test/satchel_common.js */
     17 
     18 "use strict";
     19 
     20 const MOCK_STORAGE = [
     21  {
     22    organization: "Sesame Street",
     23    country: "US",
     24    "street-address": "123 Sesame Street.",
     25    tel: "+13453453456",
     26  },
     27  {
     28    organization: "Mozilla",
     29    country: "US",
     30    "street-address": "331 E. Evelyn Avenue",
     31  },
     32  {
     33    organization: "Tel org",
     34    country: "US",
     35    tel: "+12223334444",
     36  },
     37  {
     38    organization: "Random Org",
     39    country: "US",
     40    "address-level1": "First Admin Level",
     41    tel: "+13453453456",
     42  },
     43  {
     44    organization: "readonly Org",
     45    country: "US",
     46    "address-level1": "First Admin Level",
     47    tel: "+13453453456",
     48    name: "John Doe",
     49  },
     50  {
     51    organization: "test org",
     52    country: "US",
     53    "address-level2": "Not a Town",
     54    tel: "+13453453456",
     55    name: "John Doe",
     56  }
     57 ];
     58 
     59 
     60 initPopupListener();
     61 
     62 add_task(async function setup_storage() {
     63  for (const storage of MOCK_STORAGE) {
     64    await addAddress(storage);
     65  }
     66 });
     67 
     68 add_task(async function check_preview() {
     69  const focusedInput = await setInput("#organization", "");
     70 
     71  synthesizeKey("KEY_ArrowDown");
     72  await expectPopup();
     73  await checkFormFieldsStyle(null);
     74 
     75  for (let i = 0; i < MOCK_STORAGE.length; i++) {
     76    info(`Checking organization: ${MOCK_STORAGE[i].organization} preview`);
     77    synthesizeKey("KEY_ArrowDown");
     78    await notifySelectedIndex(i);
     79    await checkFormFieldsStyle(MOCK_STORAGE[i]);
     80  }
     81 
     82  // Navigate to the footer
     83  synthesizeKey("KEY_ArrowDown");
     84  await notifySelectedIndex(MOCK_STORAGE.length + 1); // skip over the status row
     85  await checkFormFieldsStyle(null);
     86 
     87  synthesizeKey("KEY_ArrowDown");
     88  await notifySelectedIndex(-1);
     89  await checkFormFieldsStyle(null);
     90 
     91  focusedInput.blur();
     92 });
     93 
     94 add_task(async function check_filled_highlight() {
     95  await triggerPopupAndHoverItem("#organization", 0);
     96  // filled 1st address
     97  await triggerAutofillAndCheckProfile(MOCK_STORAGE[0]);
     98  await checkFormFieldsStyle(MOCK_STORAGE[0], false);
     99 });
    100 
    101 </script>
    102 
    103 <p id="display"></p>
    104 
    105 <div id="content">
    106 
    107  <form id="form1">
    108    <p>This is a basic form.</p>
    109    <p><label>organization: <input id="organization" autocomplete="organization"></label></p>
    110    <p><label>streetAddress: <textarea id="street-address" autocomplete="street-address"></textarea></label></p>
    111    <p><label>tel: <input id="tel" autocomplete="tel"></label></p>
    112    <p><label>country: <input id="country" autocomplete="country"></label></p>
    113    <p><label>address-level1:
    114      <select id="address-level1" autocomplete="address-level1">
    115        <option>First Admin Level</option>
    116        <option>Second Admin Level</option>
    117      </select>
    118    </label></p>
    119    <p><label>full name: <input id="name" autocomplete="name" readonly value="UNCHANGED"></label></p>
    120    <p><label>address-level2: <input id="address-level2" autocomplete="address-level2" disabled value="Town"></label></p>
    121  </form>
    122 
    123 </div>
    124 
    125 <pre id="test"></pre>
    126 </body>
    127 </html>