Bug 1371145 - Calculate the possible option of cc-exp/cc-exp-year/cc-exp-month for filling and previewing. r=lchang draft
authorSean Lee <selee@mozilla.com>
Sun, 13 Aug 2017 22:37:13 +0800
changeset 645664 b5a9db9a678658c04c7d5d96198a5c057b73a3f6
parent 645663 1e48f40fe3abe6b6fb846079218f9faab49d3448
child 725961 465f9cb43866579b7ba5a9f9ba0f614bd2133f48
push id73822
push userbmo:selee@mozilla.com
push dateSun, 13 Aug 2017 22:37:02 +0000
reviewerslchang
bugs1371145
milestone57.0a1
Bug 1371145 - Calculate the possible option of cc-exp/cc-exp-year/cc-exp-month for filling and previewing. r=lchang MozReview-Commit-ID: KKMkoDHKOvR
browser/extensions/formautofill/FormAutofillHandler.jsm
browser/extensions/formautofill/FormAutofillUtils.jsm
browser/extensions/formautofill/test/unit/test_getAdaptedProfiles.js
--- a/browser/extensions/formautofill/FormAutofillHandler.jsm
+++ b/browser/extensions/formautofill/FormAutofillHandler.jsm
@@ -214,17 +214,22 @@ FormAutofillHandler.prototype = {
     }
   },
 
   _matchSelectOptions(profile) {
     if (!this._cacheValue.matchingSelectOption) {
       this._cacheValue.matchingSelectOption = new WeakMap();
     }
 
-    for (let fieldName in profile) {
+    let fieldNames = Object.keys(profile);
+    if (!("cc-exp" in profile) && ("cc-exp-month" in profile) && ("cc-exp-year" in profile)) {
+      fieldNames.push("cc-exp");
+    }
+
+    for (let fieldName of fieldNames) {
       let fieldDetail = this.getFieldDetailByName(fieldName);
       if (!fieldDetail) {
         continue;
       }
 
       let element = fieldDetail.elementWeakRef.get();
       if (!(element instanceof Ci.nsIDOMHTMLSelectElement)) {
         continue;
--- a/browser/extensions/formautofill/FormAutofillUtils.jsm
+++ b/browser/extensions/formautofill/FormAutofillUtils.jsm
@@ -45,16 +45,17 @@ this.FormAutofillUtils = {
     "tel-local-prefix": "tel",
     "tel-local-suffix": "tel",
     "tel-extension": "tel",
     "email": "email",
     "cc-name": "creditCard",
     "cc-number": "creditCard",
     "cc-exp-month": "creditCard",
     "cc-exp-year": "creditCard",
+    "cc-exp": "creditCard",
   },
   _addressDataLoaded: false,
   _collators: {},
   _reAlternativeCountryNames: {},
 
   isAddressField(fieldName) {
     return !!this._fieldNameInfo[fieldName] && !this.isCreditCardField(fieldName);
   },
@@ -275,28 +276,38 @@ this.FormAutofillUtils = {
           return country;
         }
       }
     }
 
     return null;
   },
 
+  findSelectOption(selectEl, record, fieldName) {
+    if (this.isAddressField(fieldName)) {
+      return this.findAddressSelectOption(selectEl, record, fieldName);
+    }
+    if (this.isCreditCardField(fieldName)) {
+      return this.findCreditCardSelectOption(selectEl, record, fieldName);
+    }
+    return null;
+  },
+
   /**
    * Find the option element from select element.
    * 1. Try to find the locale using the country from address.
    * 2. First pass try to find exact match.
    * 3. Second pass try to identify values from address value and options,
    *    and look for a match.
    * @param   {DOMElement} selectEl
    * @param   {object} address
    * @param   {string} fieldName
    * @returns {DOMElement}
    */
-  findSelectOption(selectEl, address, fieldName) {
+  findAddressSelectOption(selectEl, address, fieldName) {
     let value = address[fieldName];
     if (!value) {
       return null;
     }
 
     let country = address.country || this.DEFAULT_COUNTRY_CODE;
     let dataset = this.getCountryAddressData(country);
     let collators = this.getCollators(country);
@@ -347,16 +358,62 @@ this.FormAutofillUtils = {
         }
         break;
       }
     }
 
     return null;
   },
 
+  findCreditCardSelectOption(selectEl, creditCard, fieldName) {
+    let oneDigitMonth = parseInt(creditCard["cc-exp-month"], 10).toString();
+    let twoDigitsMonth = oneDigitMonth.length < 2 ? "0" + oneDigitMonth : oneDigitMonth;
+    let expYearInt = parseInt(creditCard["cc-exp-year"], 10);
+    let twoDigitsYear = expYearInt.toString();
+    let fourDigitsYear = (expYearInt + 2000).toString();
+    let options = Array.from(selectEl.options);
+
+    switch (fieldName) {
+      case "cc-exp-month": {
+        for (let pattern of [twoDigitsMonth, oneDigitMonth]) {
+          let matchedOption = options.find(o => {
+            return [o.text, o.label, o.value].some(s => s.startsWith(pattern));
+          });
+          if (matchedOption) {
+            return matchedOption;
+          }
+        }
+        break;
+      }
+      case "cc-exp-year": {
+        for (let option of options) {
+          if ([option.text, option.label, option.value].some(
+            s => s == twoDigitsYear || s == fourDigitsYear
+          )) {
+            return option;
+          }
+        }
+        break;
+      }
+      case "cc-exp": {
+        let exp2n4patternSlash = twoDigitsMonth + "/" + fourDigitsYear;
+        for (let option of options) {
+          if ([option.text, option.label, option.value].some(
+            s => s == exp2n4patternSlash
+          )) {
+            return option;
+          }
+        }
+        break;
+      }
+    }
+
+    return null;
+  },
+
   /**
    * Try to match value with keys and names, but always return the key.
    * @param   {array<string>} keys
    * @param   {array<string>} names
    * @param   {string} value
    * @param   {array} collators
    * @returns {string}
    */
--- a/browser/extensions/formautofill/test/unit/test_getAdaptedProfiles.js
+++ b/browser/extensions/formautofill/test/unit/test_getAdaptedProfiles.js
@@ -1,269 +1,516 @@
 /*
  * Test for form auto fill content helper fill all inputs function.
  */
 
 "use strict";
 
 Cu.import("resource://formautofill/FormAutofillHandler.jsm");
 
-const DEFAULT_PROFILE = {
+const DEFAULT_ADDRESS_RECORD = {
   "guid": "123",
   "street-address": "2 Harrison St\nline2\nline3",
   "address-line1": "2 Harrison St",
   "address-line2": "line2",
   "address-line3": "line3",
   "address-level1": "CA",
   "country": "US",
 };
 
+const DEFAULT_CREDITCARD_RECORD = {
+  "guid": "123",
+  "cc-exp-month": "09",
+  "cc-exp-year": "25",
+};
+
 const TESTCASES = [
   {
-    description: "Form with street-address",
+    description: "Address form with street-address",
     document: `<form>
                <input id="street-addr" autocomplete="street-address">
                </form>`,
-    profileData: [Object.assign({}, DEFAULT_PROFILE)],
+    profileData: [Object.assign({}, DEFAULT_ADDRESS_RECORD)],
     expectedResult: [{
       "guid": "123",
       "street-address": "2 Harrison St line2 line3",
       "-moz-street-address-one-line": "2 Harrison St line2 line3",
       "address-line1": "2 Harrison St",
       "address-line2": "line2",
       "address-line3": "line3",
       "address-level1": "CA",
       "country": "US",
     }],
   },
   {
-    description: "Form with street-address, address-line[1, 2, 3]",
+    description: "Address form with street-address, address-line[1, 2, 3]",
     document: `<form>
                <input id="street-addr" autocomplete="street-address">
                <input id="line1" autocomplete="address-line1">
                <input id="line2" autocomplete="address-line2">
                <input id="line3" autocomplete="address-line3">
                </form>`,
-    profileData: [Object.assign({}, DEFAULT_PROFILE)],
+    profileData: [Object.assign({}, DEFAULT_ADDRESS_RECORD)],
     expectedResult: [{
       "guid": "123",
       "street-address": "2 Harrison St line2 line3",
       "-moz-street-address-one-line": "2 Harrison St line2 line3",
       "address-line1": "2 Harrison St",
       "address-line2": "line2",
       "address-line3": "line3",
       "address-level1": "CA",
       "country": "US",
     }],
   },
   {
-    description: "Form with street-address, address-line1",
+    description: "Address form with street-address, address-line1",
     document: `<form>
                <input id="street-addr" autocomplete="street-address">
                <input id="line1" autocomplete="address-line1">
                </form>`,
-    profileData: [Object.assign({}, DEFAULT_PROFILE)],
+    profileData: [Object.assign({}, DEFAULT_ADDRESS_RECORD)],
     expectedResult: [{
       "guid": "123",
       "street-address": "2 Harrison St line2 line3",
       "-moz-street-address-one-line": "2 Harrison St line2 line3",
       "address-line1": "2 Harrison St line2 line3",
       "address-line2": "line2",
       "address-line3": "line3",
       "address-level1": "CA",
       "country": "US",
     }],
   },
   {
-    description: "Form with street-address, address-line[1, 2]",
+    description: "Address form with street-address, address-line[1, 2]",
     document: `<form>
                <input id="street-addr" autocomplete="street-address">
                <input id="line1" autocomplete="address-line1">
                <input id="line2" autocomplete="address-line2">
                </form>`,
-    profileData: [Object.assign({}, DEFAULT_PROFILE)],
+    profileData: [Object.assign({}, DEFAULT_ADDRESS_RECORD)],
     expectedResult: [{
       "guid": "123",
       "street-address": "2 Harrison St line2 line3",
       "-moz-street-address-one-line": "2 Harrison St line2 line3",
       "address-line1": "2 Harrison St",
       "address-line2": "line2 line3",
       "address-line3": "line3",
       "address-level1": "CA",
       "country": "US",
     }],
   },
   {
-    description: "Form with street-address, address-line[1, 3]",
+    description: "Address form with street-address, address-line[1, 3]",
     document: `<form>
                <input id="street-addr" autocomplete="street-address">
                <input id="line1" autocomplete="address-line1">
                <input id="line3" autocomplete="address-line3">
                </form>`,
-    profileData: [Object.assign({}, DEFAULT_PROFILE)],
+    profileData: [Object.assign({}, DEFAULT_ADDRESS_RECORD)],
     expectedResult: [{
       "guid": "123",
       "street-address": "2 Harrison St line2 line3",
       "-moz-street-address-one-line": "2 Harrison St line2 line3",
       "address-line1": "2 Harrison St",
       "address-line2": "line2 line3",
       "address-line3": "line3",
       "address-level1": "CA",
       "country": "US",
     }],
   },
   {
-    description: "Form with exact matching options in select",
+    description: "Address form with exact matching options in select",
     document: `<form>
                <select autocomplete="address-level1">
                  <option id="option-address-level1-XX" value="XX">Dummy</option>
                  <option id="option-address-level1-CA" value="CA">California</option>
                </select>
                <select autocomplete="country">
                  <option id="option-country-XX" value="XX">Dummy</option>
                  <option id="option-country-US" value="US">United States</option>
                </select>
                </form>`,
-    profileData: [Object.assign({}, DEFAULT_PROFILE)],
+    profileData: [Object.assign({}, DEFAULT_ADDRESS_RECORD)],
     expectedResult: [{
       "guid": "123",
       "street-address": "2 Harrison St\nline2\nline3",
       "-moz-street-address-one-line": "2 Harrison St line2 line3",
       "address-line1": "2 Harrison St",
       "address-line2": "line2",
       "address-line3": "line3",
       "address-level1": "CA",
       "country": "US",
     }],
     expectedOptionElements: [{
       "address-level1": "option-address-level1-CA",
       "country": "option-country-US",
     }],
   },
   {
-    description: "Form with inexact matching options in select",
+    description: "Address form with inexact matching options in select",
     document: `<form>
                <select autocomplete="address-level1">
                  <option id="option-address-level1-XX" value="XX">Dummy</option>
                  <option id="option-address-level1-OO" value="OO">California</option>
                </select>
                <select autocomplete="country">
                  <option id="option-country-XX" value="XX">Dummy</option>
                  <option id="option-country-OO" value="OO">United States</option>
                </select>
                </form>`,
-    profileData: [Object.assign({}, DEFAULT_PROFILE)],
+    profileData: [Object.assign({}, DEFAULT_ADDRESS_RECORD)],
     expectedResult: [{
       "guid": "123",
       "street-address": "2 Harrison St\nline2\nline3",
       "-moz-street-address-one-line": "2 Harrison St line2 line3",
       "address-line1": "2 Harrison St",
       "address-line2": "line2",
       "address-line3": "line3",
       "address-level1": "CA",
       "country": "US",
     }],
     expectedOptionElements: [{
       "address-level1": "option-address-level1-OO",
       "country": "option-country-OO",
     }],
   },
   {
-    description: "Form with value-omitted options in select",
+    description: "Address form with value-omitted options in select",
     document: `<form>
                <select autocomplete="address-level1">
                  <option id="option-address-level1-1" value="">Dummy</option>
                  <option id="option-address-level1-2" value="">California</option>
                </select>
                <select autocomplete="country">
                  <option id="option-country-1" value="">Dummy</option>
                  <option id="option-country-2" value="">United States</option>
                </select>
                </form>`,
-    profileData: [Object.assign({}, DEFAULT_PROFILE)],
+    profileData: [Object.assign({}, DEFAULT_ADDRESS_RECORD)],
     expectedResult: [{
       "guid": "123",
       "street-address": "2 Harrison St\nline2\nline3",
       "-moz-street-address-one-line": "2 Harrison St line2 line3",
       "address-line1": "2 Harrison St",
       "address-line2": "line2",
       "address-line3": "line3",
       "address-level1": "CA",
       "country": "US",
     }],
     expectedOptionElements: [{
       "address-level1": "option-address-level1-2",
       "country": "option-country-2",
     }],
   },
   {
-    description: "Form with options with the same value in select",
+    description: "Address form with options with the same value in select ",
     document: `<form>
                <select autocomplete="address-level1">
                  <option id="option-address-level1-same1" value="same">Dummy</option>
                  <option id="option-address-level1-same2" value="same">California</option>
                </select>
                <select autocomplete="country">
                  <option id="option-country-same1" value="sametoo">Dummy</option>
                  <option id="option-country-same2" value="sametoo">United States</option>
                </select>
                </form>`,
-    profileData: [Object.assign({}, DEFAULT_PROFILE)],
+    profileData: [Object.assign({}, DEFAULT_ADDRESS_RECORD)],
     expectedResult: [{
       "guid": "123",
       "street-address": "2 Harrison St\nline2\nline3",
       "-moz-street-address-one-line": "2 Harrison St line2 line3",
       "address-line1": "2 Harrison St",
       "address-line2": "line2",
       "address-line3": "line3",
       "address-level1": "CA",
       "country": "US",
     }],
     expectedOptionElements: [{
       "address-level1": "option-address-level1-same2",
       "country": "option-country-same2",
     }],
   },
   {
-    description: "Form without matching options in select",
+    description: "Address form without matching options in select for address-level1 and country",
     document: `<form>
                <select autocomplete="address-level1">
                  <option id="option-address-level1-dummy1" value="">Dummy</option>
                  <option id="option-address-level1-dummy2" value="">Dummy 2</option>
                </select>
                <select autocomplete="country">
                  <option id="option-country-dummy1" value="">Dummy</option>
                  <option id="option-country-dummy2" value="">Dummy 2</option>
                </select>
                </form>`,
-    profileData: [Object.assign({}, DEFAULT_PROFILE)],
+    profileData: [Object.assign({}, DEFAULT_ADDRESS_RECORD)],
     expectedResult: [{
       "guid": "123",
       "street-address": "2 Harrison St\nline2\nline3",
       "-moz-street-address-one-line": "2 Harrison St line2 line3",
       "address-line1": "2 Harrison St",
       "address-line2": "line2",
       "address-line3": "line3",
     }],
   },
+  {
+    description: "Credit Card form with matching options of cc-exp-year and cc-exp-month",
+    document: `<form>
+               <select autocomplete="cc-exp-month">
+                 <option id="option-cc-exp-month-01" value="1">01</option>
+                 <option id="option-cc-exp-month-02" value="2">02</option>
+                 <option id="option-cc-exp-month-03" value="3">03</option>
+                 <option id="option-cc-exp-month-04" value="4">04</option>
+                 <option id="option-cc-exp-month-05" value="5">05</option>
+                 <option id="option-cc-exp-month-06" value="6">06</option>
+                 <option id="option-cc-exp-month-07" value="7">07</option>
+                 <option id="option-cc-exp-month-08" value="8">08</option>
+                 <option id="option-cc-exp-month-09" value="9">09</option>
+                 <option id="option-cc-exp-month-10" value="10">10</option>
+                 <option id="option-cc-exp-month-11" value="11">11</option>
+                 <option id="option-cc-exp-month-12" value="12">12</option>
+               </select>
+               <select autocomplete="cc-exp-year">
+                 <option id="option-cc-exp-year-17" value="2017">17</option>
+                 <option id="option-cc-exp-year-18" value="2018">18</option>
+                 <option id="option-cc-exp-year-19" value="2019">19</option>
+                 <option id="option-cc-exp-year-20" value="2020">20</option>
+                 <option id="option-cc-exp-year-21" value="2021">21</option>
+                 <option id="option-cc-exp-year-22" value="2022">22</option>
+                 <option id="option-cc-exp-year-23" value="2023">23</option>
+                 <option id="option-cc-exp-year-24" value="2024">24</option>
+                 <option id="option-cc-exp-year-25" value="2025">25</option>
+                 <option id="option-cc-exp-year-26" value="2026">26</option>
+                 <option id="option-cc-exp-year-27" value="2027">27</option>
+                 <option id="option-cc-exp-year-28" value="2028">28</option>
+               </select>
+               </form>`,
+    profileData: [Object.assign({}, DEFAULT_CREDITCARD_RECORD)],
+    expectedResult: [{
+      "guid": "123",
+      "cc-exp-month": "09",
+      "cc-exp-year": "25",
+    }],
+    expectedOptionElements: [{
+      "cc-exp-month": "option-cc-exp-month-09",
+      "cc-exp-year": "option-cc-exp-year-25",
+    }],
+  },
+  {
+    description: "Credit Card form with matching options which contain labels",
+    document: `<form>
+               <select autocomplete="cc-exp-month">
+                 <option value="" selected="selected">Month</option>
+                 <option label="01 - January" id="option-cc-exp-month-01" value="object:17">01 - January</option>
+                 <option label="02 - February" id="option-cc-exp-month-02" value="object:18">02 - February</option>
+                 <option label="03 - March" id="option-cc-exp-month-03" value="object:19">03 - March</option>
+                 <option label="04 - April" id="option-cc-exp-month-04" value="object:20">04 - April</option>
+                 <option label="05 - May" id="option-cc-exp-month-05" value="object:21">05 - May</option>
+                 <option label="06 - June" id="option-cc-exp-month-06" value="object:22">06 - June</option>
+                 <option label="07 - July" id="option-cc-exp-month-07" value="object:23">07 - July</option>
+                 <option label="08 - August" id="option-cc-exp-month-08" value="object:24">08 - August</option>
+                 <option label="09 - September" id="option-cc-exp-month-09" value="object:25">09 - September</option>
+                 <option label="10 - October" id="option-cc-exp-month-10" value="object:26">10 - October</option>
+                 <option label="11 - November" id="option-cc-exp-month-11" value="object:27">11 - November</option>
+                 <option label="12 - December" id="option-cc-exp-month-12" value="object:28">12 - December</option>
+               </select>
+               <select autocomplete="cc-exp-year">
+                 <option value="" selected="selected">Year</option>
+                 <option label="2017" id="option-cc-exp-year-17" value="object:29">2017</option>
+                 <option label="2018" id="option-cc-exp-year-18" value="object:30">2018</option>
+                 <option label="2019" id="option-cc-exp-year-19" value="object:31">2019</option>
+                 <option label="2020" id="option-cc-exp-year-20" value="object:32">2020</option>
+                 <option label="2021" id="option-cc-exp-year-21" value="object:33">2021</option>
+                 <option label="2022" id="option-cc-exp-year-22" value="object:34">2022</option>
+                 <option label="2023" id="option-cc-exp-year-23" value="object:35">2023</option>
+                 <option label="2024" id="option-cc-exp-year-24" value="object:36">2024</option>
+                 <option label="2025" id="option-cc-exp-year-25" value="object:37">2025</option>
+                 <option label="2026" id="option-cc-exp-year-26" value="object:38">2026</option>
+                 <option label="2027" id="option-cc-exp-year-27" value="object:39">2027</option>
+                 <option label="2028" id="option-cc-exp-year-28" value="object:40">2028</option>
+                 <option label="2029" id="option-cc-exp-year-29" value="object:41">2029</option>
+                 <option label="2030" id="option-cc-exp-year-30" value="object:42">2030</option>
+                 <option label="2031" id="option-cc-exp-year-31" value="object:43">2031</option>
+                 <option label="2032" id="option-cc-exp-year-32" value="object:44">2032</option>
+                 <option label="2033" id="option-cc-exp-year-33" value="object:45">2033</option>
+                 <option label="2034" id="option-cc-exp-year-34" value="object:46">2034</option>
+                 <option label="2035" id="option-cc-exp-year-35" value="object:47">2035</option>
+               </select>
+               </form>`,
+    profileData: [Object.assign({}, DEFAULT_CREDITCARD_RECORD)],
+    expectedResult: [{
+      "guid": "123",
+      "cc-exp-month": "09",
+      "cc-exp-year": "25",
+    }],
+    expectedOptionElements: [{
+      "cc-exp-month": "option-cc-exp-month-09",
+      "cc-exp-year": "option-cc-exp-year-25",
+    }],
+  },
+  {
+    description: "Credit Card form with matching options of compound cc-exp",
+    document: `<form>
+               <select autocomplete="cc-exp">
+                 <option value="03/2017">03/2017</option>
+                 <option value="04/2017">04/2017</option>
+                 <option value="05/2017">05/2017</option>
+                 <option value="06/2017">06/2017</option>
+                 <option value="07/2017">07/2017</option>
+                 <option value="08/2017">08/2017</option>
+                 <option value="09/2017">09/2017</option>
+                 <option value="10/2017">10/2017</option>
+                 <option value="11/2017">11/2017</option>
+                 <option value="12/2017">12/2017</option>
+                 <option value="01/2018">01/2018</option>
+                 <option value="02/2018">02/2018</option>
+                 <option value="03/2018">03/2018</option>
+                 <option value="04/2018">04/2018</option>
+                 <option value="05/2018">05/2018</option>
+                 <option value="06/2018">06/2018</option>
+                 <option value="07/2018">07/2018</option>
+                 <option value="08/2018">08/2018</option>
+                 <option value="09/2018">09/2018</option>
+                 <option value="10/2018">10/2018</option>
+                 <option value="11/2018">11/2018</option>
+                 <option value="12/2018">12/2018</option>
+                 <option value="01/2019">01/2019</option>
+                 <option value="02/2019">02/2019</option>
+                 <option value="03/2019">03/2019</option>
+                 <option value="04/2019">04/2019</option>
+                 <option value="05/2019">05/2019</option>
+                 <option value="06/2019">06/2019</option>
+                 <option value="07/2019">07/2019</option>
+                 <option value="08/2019">08/2019</option>
+                 <option value="09/2019">09/2019</option>
+                 <option value="10/2019">10/2019</option>
+                 <option value="11/2019">11/2019</option>
+                 <option value="12/2019">12/2019</option>
+                 <option value="01/2020">01/2020</option>
+                 <option value="02/2020">02/2020</option>
+                 <option value="03/2020">03/2020</option>
+                 <option value="04/2020">04/2020</option>
+                 <option value="05/2020">05/2020</option>
+                 <option value="06/2020">06/2020</option>
+                 <option value="07/2020">07/2020</option>
+                 <option value="08/2020">08/2020</option>
+                 <option value="09/2020">09/2020</option>
+                 <option value="10/2020">10/2020</option>
+                 <option value="11/2020">11/2020</option>
+                 <option value="12/2020">12/2020</option>
+                 <option value="01/2021">01/2021</option>
+                 <option value="02/2021">02/2021</option>
+                 <option value="03/2021">03/2021</option>
+                 <option value="04/2021">04/2021</option>
+                 <option value="05/2021">05/2021</option>
+                 <option value="06/2021">06/2021</option>
+                 <option value="07/2021">07/2021</option>
+                 <option value="08/2021">08/2021</option>
+                 <option value="09/2021">09/2021</option>
+                 <option value="10/2021">10/2021</option>
+                 <option value="11/2021">11/2021</option>
+                 <option value="12/2021">12/2021</option>
+                 <option value="01/2022">01/2022</option>
+                 <option value="02/2022">02/2022</option>
+                 <option value="03/2022">03/2022</option>
+                 <option value="04/2022">04/2022</option>
+                 <option value="05/2022">05/2022</option>
+                 <option value="06/2022">06/2022</option>
+                 <option value="07/2022">07/2022</option>
+                 <option value="08/2022">08/2022</option>
+                 <option value="09/2022">09/2022</option>
+                 <option value="10/2022">10/2022</option>
+                 <option value="11/2022">11/2022</option>
+                 <option value="12/2022">12/2022</option>
+                 <option value="01/2023">01/2023</option>
+                 <option value="02/2023">02/2023</option>
+                 <option value="03/2023">03/2023</option>
+                 <option value="04/2023">04/2023</option>
+                 <option value="05/2023">05/2023</option>
+                 <option value="06/2023">06/2023</option>
+                 <option value="07/2023">07/2023</option>
+                 <option value="08/2023">08/2023</option>
+                 <option value="09/2023">09/2023</option>
+                 <option value="10/2023">10/2023</option>
+                 <option value="11/2023">11/2023</option>
+                 <option value="12/2023">12/2023</option>
+                 <option value="01/2024">01/2024</option>
+                 <option value="02/2024">02/2024</option>
+                 <option value="03/2024">03/2024</option>
+                 <option value="04/2024">04/2024</option>
+                 <option value="05/2024">05/2024</option>
+                 <option value="06/2024">06/2024</option>
+                 <option value="07/2024">07/2024</option>
+                 <option value="08/2024">08/2024</option>
+                 <option value="09/2024">09/2024</option>
+                 <option value="10/2024">10/2024</option>
+                 <option value="11/2024">11/2024</option>
+                 <option value="12/2024">12/2024</option>
+                 <option value="01/2025">01/2025</option>
+                 <option value="02/2025">02/2025</option>
+                 <option value="03/2025">03/2025</option>
+                 <option value="04/2025">04/2025</option>
+                 <option value="05/2025">05/2025</option>
+                 <option value="06/2025">06/2025</option>
+                 <option value="07/2025">07/2025</option>
+                 <option value="08/2025">08/2025</option>
+                 <option id="selected-cc-exp" value="09/2025">09/2025</option>
+                 <option value="10/2025">10/2025</option>
+                 <option value="11/2025">11/2025</option>
+                 <option value="12/2025">12/2025</option>
+                 <option value="01/2026">01/2026</option>
+                 <option value="02/2026">02/2026</option>
+                 <option value="03/2026">03/2026</option>
+                 <option value="04/2026">04/2026</option>
+                 <option value="05/2026">05/2026</option>
+                 <option value="06/2026">06/2026</option>
+                 <option value="07/2026">07/2026</option>
+                 <option value="08/2026">08/2026</option>
+                 <option value="09/2026">09/2026</option>
+                 <option value="10/2026">10/2026</option>
+                 <option value="11/2026">11/2026</option>
+                 <option value="12/2026">12/2026</option>
+                 <option value="01/2027">01/2027</option>
+                 <option value="02/2027">02/2027</option>
+                 <option value="03/2027">03/2027</option>
+                 <option value="04/2027">04/2027</option>
+                 <option value="05/2027">05/2027</option>
+                 <option value="06/2027">06/2027</option>
+                 <option value="07/2027">07/2027</option>
+                 <option value="08/2027">08/2027</option>
+                 <option value="09/2027">09/2027</option>
+                 <option value="10/2027">10/2027</option>
+                 <option value="11/2027">11/2027</option>
+                 <option value="12/2027">12/2027</option>
+               </select>
+               </form>`,
+    profileData: [Object.assign({}, DEFAULT_CREDITCARD_RECORD)],
+    expectedResult: [{
+      "guid": "123",
+      "cc-exp-month": "09",
+      "cc-exp-year": "25",
+    }],
+    expectedOptionElements: [{
+      "cc-exp": "selected-cc-exp",
+    }],
+  },
 ];
 
 for (let testcase of TESTCASES) {
   add_task(async function() {
     do_print("Starting testcase: " + testcase.description);
 
     let doc = MockDocument.createTestDocument("http://localhost:8080/test/",
                                               testcase.document);
     let form = doc.querySelector("form");
     let formLike = FormLikeFactory.createFromForm(form);
     let handler = new FormAutofillHandler(formLike);
 
     handler.collectFormFields();
-    let adaptedAddresses = handler.getAdaptedProfiles(testcase.profileData);
-    Assert.deepEqual(adaptedAddresses, testcase.expectedResult);
+    let adaptedRecords = handler.getAdaptedProfiles(testcase.profileData);
+    Assert.deepEqual(adaptedRecords, testcase.expectedResult);
 
     if (testcase.expectedOptionElements) {
       testcase.expectedOptionElements.forEach((expectedOptionElement, i) => {
         for (let field in expectedOptionElement) {
           let select = form.querySelector(`[autocomplete=${field}]`);
           let expectedOption = doc.getElementById(expectedOptionElement[field]);
           Assert.notEqual(expectedOption, null);