More minor fixes (#244)

packages/password/rules.json

@@ -170,6 +170,9 @@
   "claro.com.br": {
     "password-rules": "minlength: 8; required: lower; allowed: upper, digit, [-!@#$%&*_+=<>];"
   },
+  "classmates.com": {
+    "password-rules": "minlength: 6; maxlength: 20; allowed: lower, upper, digit, [!@#$%^&*];"
+  },
   "clien.net": {
     "password-rules": "minlength: 5; required: lower, upper; required: digit;"
   },
@@ -482,9 +485,6 @@
   "microsoft.com": {
     "password-rules": "minlength: 8; required: lower; required: upper; required: digit; required: special;"
   },
-  "minecraft.com": {
-    "password-rules": "minlength: 8; required: lower, upper; required: digit; allowed: ascii-printable;"
-  },
   "mintmobile.com": {
     "password-rules": "minlength: 8; maxlength: 20; required: lower; required: upper; required: digit; required: special; allowed: [!#$%&()*+:;=@[^_`{}~]];"
   },
@@ -509,6 +509,9 @@
   "myhealthrecord.com": {
     "password-rules": "minlength: 8; maxlength: 20; allowed: lower, upper, digit, [_.!$*=];"
   },
+  "mysedgwick.com": {
+    "password-rules": "minlength: 8; maxlength: 16; allowed: lower; required: upper; required: digit; required: [@#%^&+=!]; allowed: [-~_$.,;]"
+  },
   "mysubaru.com": {
     "password-rules": "minlength: 8; maxlength: 15; required: lower; required: upper; required: digit; allowed: [!#$%()*+,./:;=?@\\^`~];"
   },

src/Form/Form.js

@@ -265,7 +265,11 @@ class Form {
 
     categorizeInputs () {
         const selector = this.matching.cssSelector('FORM_INPUTS_SELECTOR')
-        this.form.querySelectorAll(selector).forEach(input => this.addInput(input))
+        if (this.form.matches(selector)) {
+            this.addInput(this.form)
+        } else {
+            this.form.querySelectorAll(selector).forEach(input => this.addInput(input))
+        }
     }
 
     get submitButtons () {

src/Form/matching.js

@@ -485,7 +485,7 @@ class Matching {
         if (!ccFieldSelector) {
             return false
         }
-        const hasCCSelectorChild = formEl.querySelector(ccFieldSelector)
+        const hasCCSelectorChild = formEl.matches(ccFieldSelector) || formEl.querySelector(ccFieldSelector)
         // If the form contains one of the specific selectors, we have high confidence
         if (hasCCSelectorChild) return true
 

src/Form/selectors-css.js

@@ -49,6 +49,7 @@ input[autocomplete="card-number"],
 input[name="ccnumber"],
 input[name="cc-number"],
 input[name*=card i][name*=number i],
+input[name*=cardnumber i],
 input[id*=cardnumber i],
 input[id*=card-number i],
 input[id*=card_number i]`

src/Form/test-cases/index.js

@@ -253,5 +253,6 @@ export default [
     // Issues with buttons here is due to lots of hidden forms and weird markup, they don't affect the actual UX
     { html: 'boardgamearena_signup.html', expectedFailures: ['birthday'], expectedSubmitFalsePositives: 2, expectedSubmitFalseNegatives: 5 },
     { html: 'eventbrite_checkout-signup.html' },
-    { html: 'eventbrite_fake-signup.html' }
+    { html: 'eventbrite_fake-signup.html' },
+    { html: 'ryanair_cc-card-name.html' }
 ]

src/Form/test-cases/ryanair_cc-card-name.html

@@ -0,0 +1,13 @@
+<!-- https://pi.ryanairpi.com/mt/en?platform=desktop&basketId=277542e9-b913-4843-8682-cda6eb8d8712 -->
+<!-- This is loaded in an iframe and it's the sole content of that iframe -->
+<app-root _nghost-flv-c18="" ng-version="13.3.11">
+    <div _ngcontent-flv-c18="" class="credit-card-iframe ng-untouched ng-pristine ng-invalid">
+        <ry-input-d _ngcontent-flv-c18="" name="cardNumber" pattern="[0-9 ]*" type="tel" formcontrolname="cardNumber"
+                    _nghost-flv-c15="" class="ng-untouched ng-pristine ng-invalid">
+            <div _ngcontent-flv-c15="" class="_input-container" data-ref="ry-input-label">
+                <div _ngcontent-flv-c15="" class="_icon"></div>
+                <input _ngcontent-flv-c15="" class="b2 date-placeholder" type="tel" name="cardNumber" autocomplete=""
+                       min="undefined" max="undefined" pattern="[0-9 ]*" data-hj-suppress="true" data-manual-scoring="cardNumber"></div>
+            <label _ngcontent-flv-c15="" class="b2">Card number *</label><!----><!----><!----><span
+                _ngcontent-flv-c15="" class="_helper b2"></span></ry-input-d><!----><!----></div>
+</app-root>

src/Scanner.js

@@ -133,7 +133,7 @@ class DefaultScanner {
 
         let element = input
         // traverse the DOM to search for related inputs
-        while (element.parentElement && element.parentElement !== document.body) {
+        while (element.parentElement && element.parentElement !== document.documentElement) {
             // If parent includes a form return the current element to avoid overlapping forms
             if (element.parentElement?.querySelector('form')) {
                 return element

src/autofill-utils.js

@@ -126,6 +126,8 @@ const setValueForSelect = (el, val) => {
     const isMonth = subtype.includes('Month')
     const isZeroBasedNumber = isMonth &&
         el.options[0].value === '0' && el.options.length === 12
+    const stringVal = String(val)
+    const numberVal = Number(val)
 
     // Loop first through all values because they tend to be more precise
     for (const option of el.options) {
@@ -136,7 +138,7 @@ const setValueForSelect = (el, val) => {
         }
         // TODO: try to match localised month names
         // TODO: implement alternative versions of values (abbreviations for States/Provinces or variations like USA, US, United States, etc.)
-        if (value === String(val)) {
+        if (value === stringVal || Number(value) === numberVal) {
             if (option.selected) return false
             option.selected = true
             fireEventsOnSelect(el)
@@ -145,7 +147,7 @@ const setValueForSelect = (el, val) => {
     }
 
     for (const option of el.options) {
-        if (option.innerText === String(val)) {
+        if (option.innerText === stringVal || Number(option.innerText) === numberVal) {
             if (option.selected) return false
             option.selected = true
             fireEventsOnSelect(el)