@protontech/autofill 0.0.22991789 → 0.0.33690782

package/utils/credit-card.js

@@ -0,0 +1,259 @@
+import { ccFields, CCFieldType } from "@protontech/autofill/types";
+import { not, or } from "./combinators";
+import { getLabelFor } from "./dom";
+import { getAutocompletes } from "./extract";
+import { getCachedSubType, isClassifiable, setCachedSubType } from "./flags";
+import { matchCCExp, matchCCExpMonth, matchCCExpYear, matchCCFirstName, matchCCLastName, matchCCName, matchCCNumber, matchCCOutlier, matchCCSecurityCode, matchCCV } from "./re";
+import { sanitizeString, sanitizeStringWithSpaces } from "./text";
+import { isVisible } from "./visible";
+export const CC_ATTRIBUTES = ["autocomplete", "name", "id", "class", "form", "aria-label", "aria-labelledby", "placeholder", "data-testid", "data-stripe", "data-recurly", "data-encrypted-name"];
+export const CC_INPUT_TYPES = ["tel", "phone", "text", "number", "password"];
+const CC_EXP_YEAR_FORMAT = ["YYYY", "AAAA", "YY", "AA"];
+const CC_EXP_MONTH_FORMAT = ["MM", "LL"];
+const CC_EXP_FULL_RE = /(mmyy|mmaa|yymm|aamm)/;
+const CC_EXP_SEPARATOR = ["", "/", "-"];
+const CC_EXP_DEFAULT_FORMAT = { separator: "/", fullYear: false, monthFirst: true };
+const CC_EXP_FORMATS = [
+    { fullYear: true, monthFirst: true },
+    { fullYear: false, monthFirst: true },
+    { fullYear: true, monthFirst: false },
+    { fullYear: false, monthFirst: false },
+];
+const MAX_LENGTH_FORMAT_MAP = {
+    4: { separator: "", fullYear: false, monthFirst: true },
+    5: { separator: "/", fullYear: false, monthFirst: true },
+    6: { separator: "", fullYear: true, monthFirst: true },
+    7: { separator: "/", fullYear: true, monthFirst: true },
+};
+const YEAR_OPTION = (new Date().getFullYear() + 1).toString();
+const generateExpirationString = ({ fullYear, separator, monthFirst }) => {
+    const month = "01";
+    const year = fullYear ? "2025" : "25";
+    return monthFirst ? `${month}${separator}${year}` : `${year}${separator}${month}`;
+};
+const getExpirationFormatFromPattern = (pattern) => {
+    try {
+        const regex = new RegExp(`^${pattern}$`);
+        for (const format of CC_EXP_FORMATS) {
+            for (const separator of CC_EXP_SEPARATOR) {
+                const testString = generateExpirationString({ ...format, separator });
+                if (regex.test(testString)) {
+                    return {
+                        separator,
+                        fullYear: format.fullYear,
+                        monthFirst: format.monthFirst,
+                    };
+                }
+            }
+        }
+    }
+    catch (_a) {
+        return undefined;
+    }
+};
+const getCCFormatHaystack = (input) => {
+    var _a;
+    const { placeholder, className, id, name } = input;
+    const ariaLabel = input.getAttribute("aria-label");
+    const label = (_a = getLabelFor(input)) === null || _a === void 0 ? void 0 : _a.innerText;
+    return [className, id, name, ariaLabel, placeholder.replace(/\s/g, ""), label === null || label === void 0 ? void 0 : label.replace(/\s/g, "")].filter(Boolean).join(" ").toUpperCase();
+};
+const getExpirationFormatFromMaxLength = (maxLength) => MAX_LENGTH_FORMAT_MAP[maxLength];
+const getExpirationFormatFromAttributes = (input) => {
+    const haystack = getCCFormatHaystack(input);
+    for (const separator of CC_EXP_SEPARATOR) {
+        for (const year of CC_EXP_YEAR_FORMAT) {
+            for (const monthFirst of [true, false]) {
+                if (haystack.includes(monthFirst ? `MM${separator}${year}` : `${year}${separator}MM`)) {
+                    return {
+                        separator,
+                        fullYear: year.length === 4,
+                        monthFirst,
+                    };
+                }
+            }
+        }
+    }
+};
+export const getExpirationFormat = (field, allowFallback = true) => {
+    if (field instanceof HTMLInputElement) {
+        const validMaxLength = field.maxLength >= 4;
+        const validPattern = field.pattern && (field.maxLength === -1 || validMaxLength);
+        return (getExpirationFormatFromAttributes(field) ||
+            (validPattern && getExpirationFormatFromPattern(field.pattern)) ||
+            (validMaxLength && getExpirationFormatFromMaxLength(field.maxLength)) ||
+            (allowFallback ? CC_EXP_DEFAULT_FORMAT : undefined));
+    }
+};
+export const formatExpirationDate = (month, year, { fullYear, separator, monthFirst }) => {
+    const formattedYear = fullYear ? year.slice(0, 4) : year.slice(-2);
+    const formattedMonth = month.padStart(2, "0");
+    const components = monthFirst ? [formattedMonth, formattedYear] : [formattedYear, formattedMonth];
+    return components.join(separator);
+};
+const getSelectOptions = (el) => Array.from(el.options)
+    .map((opt) => opt.value)
+    .filter(Boolean);
+export const getInputExpirationMonthFormat = (input) => {
+    const haystack = getCCFormatHaystack(input);
+    if (CC_EXP_MONTH_FORMAT.some((pattern) => haystack.includes(pattern)))
+        return { padding: true };
+    return { padding: input.minLength === 2 || input.maxLength === 2 };
+};
+export const getInputExpirationYearFormat = (input) => {
+    if (input.minLength === 4)
+        return { fullYear: true };
+    const haystack = getCCFormatHaystack(input);
+    for (const year of CC_EXP_YEAR_FORMAT) {
+        if (haystack.includes(year))
+            return { fullYear: year.length === 4 };
+    }
+    return { fullYear: false };
+};
+export const getSelectExpirationYearFormat = (select) => {
+    const options = getSelectOptions(select);
+    if (options.some((value) => /^\d{4}$/.test(value)))
+        return { fullYear: true };
+    if (options.some((value) => /^\d{2}$/.test(value)))
+        return { fullYear: false };
+};
+export const getSelectExpirationMonthFormat = (select) => {
+    const options = getSelectOptions(select);
+    if (options.some((value) => /^0[1-9]$/.test(value)))
+        return { padding: true };
+    if (options.some((value) => /^([1-9]|1[0-2])$/.test(value)))
+        return { padding: false };
+};
+const AUTOCOMPLETE_OUTLIERS = ["given-name", "additional-name", "family-name", "name"];
+const guard = (options, predicate) => (field, autocompletes, haystack) => {
+    if (!options.password && field.getAttribute("type") === "password")
+        return false;
+    if (autocompletes.includes(options.autocomplete))
+        return true;
+    if (autocompletes.some((autocomplete) => AUTOCOMPLETE_OUTLIERS.includes(autocomplete)))
+        return false;
+    return predicate(field, autocompletes, haystack) && not(matchCCOutlier)(haystack);
+};
+const notCCIdentityOutlier = (autocompletes) => {
+    if (autocompletes.includes("billing"))
+        return false;
+    if (autocompletes.includes("shipping"))
+        return false;
+    return true;
+};
+const isCCFirstName = (_, autocompletes, haystack) => matchCCFirstName(haystack) && notCCIdentityOutlier(autocompletes);
+const isCCLastName = (_, autocompletes, haystack) => matchCCLastName(haystack) && notCCIdentityOutlier(autocompletes);
+const isCCName = (_, autocomplete, haystack) => matchCCName(haystack) && notCCIdentityOutlier(autocomplete);
+const isCCSecurityCode = (_, _auto, haystack) => or(matchCCV, matchCCSecurityCode)(haystack);
+const isCCNumber = (_, __, haystack) => matchCCNumber(haystack);
+const isCCExp = (field, _, haystack) => field instanceof HTMLInputElement && matchCCExp(haystack);
+const isCCExpMonth = (field, autocompletes, haystack) => {
+    if (autocompletes.includes("cc-exp"))
+        return false;
+    if (CC_EXP_FULL_RE.test(haystack))
+        return false;
+    if (matchCCExpMonth(haystack))
+        return true;
+    if (field instanceof HTMLSelectElement && matchCCExp(haystack)) {
+        return field.options.length >= 12 && field.options.length <= 14;
+    }
+    return false;
+};
+const isCCExpYear = (field, autocompletes, haystack) => {
+    if (autocompletes.includes("cc-exp"))
+        return false;
+    if (CC_EXP_FULL_RE.test(haystack))
+        return false;
+    if (matchCCExpYear(haystack))
+        return true;
+    if (field instanceof HTMLSelectElement && matchCCExp(haystack)) {
+        for (const option of field.options) {
+            if (option.innerText === YEAR_OPTION)
+                return true;
+            if (option.value === YEAR_OPTION)
+                return true;
+        }
+    }
+    return false;
+};
+const CC_MATCHERS = [
+    [CCFieldType.FIRSTNAME, guard({ autocomplete: "cc-given-name" }, isCCFirstName)],
+    [CCFieldType.LASTNAME, guard({ autocomplete: "cc-family-name" }, isCCLastName)],
+    [CCFieldType.NAME, guard({ autocomplete: "cc-name" }, isCCName)],
+    [CCFieldType.EXP_YEAR, guard({ autocomplete: "cc-exp-year" }, isCCExpYear)],
+    [CCFieldType.EXP_MONTH, guard({ autocomplete: "cc-exp-month" }, isCCExpMonth)],
+    [CCFieldType.EXP, guard({ autocomplete: "cc-exp" }, isCCExp)],
+    [CCFieldType.CSC, guard({ autocomplete: "cc-csc", password: true }, isCCSecurityCode)],
+    [CCFieldType.NUMBER, guard({ autocomplete: "cc-number", password: true }, isCCNumber)],
+];
+export const getCCHaystack = (field) => {
+    const attrs = CC_ATTRIBUTES.map((attr) => { var _a; return (_a = field === null || field === void 0 ? void 0 : field.getAttribute(attr)) !== null && _a !== void 0 ? _a : ""; });
+    const labelEl = getLabelFor(field);
+    const label = sanitizeString((() => {
+        if (!labelEl)
+            return "";
+        if (labelEl.innerText)
+            return labelEl.innerText;
+        if (labelEl.childElementCount === 0)
+            return "";
+        return Array.from(labelEl.children)
+            .map((el) => { var _a; return (_a = el === null || el === void 0 ? void 0 : el.innerText) !== null && _a !== void 0 ? _a : ""; })
+            .join(" ");
+    })());
+    return sanitizeStringWithSpaces(attrs.join(" ")) + " " + label;
+};
+export const getCachedCCSubtype = (el) => {
+    const subType = getCachedSubType(el);
+    if (subType && ccFields.has(subType))
+        return subType;
+};
+export const getCCFieldType = (field) => {
+    var _a;
+    const cachedSubType = getCachedCCSubtype(field);
+    if (cachedSubType)
+        return cachedSubType;
+    const type = field.getAttribute("type");
+    if (field.tagName === "INPUT" && type && !CC_INPUT_TYPES.includes(type))
+        return;
+    const haystack = getCCHaystack(field);
+    const autocompletes = getAutocompletes(field);
+    if (haystack) {
+        const ccType = (_a = CC_MATCHERS.find(([, test]) => test(field, autocompletes, haystack))) === null || _a === void 0 ? void 0 : _a[0];
+        if (ccType)
+            setCachedSubType(field, ccType);
+        return ccType;
+    }
+};
+export const matchCCFieldCandidate = (input, { visible }) => {
+    if (getCachedCCSubtype(input))
+        return true;
+    if (!visible)
+        return false;
+    const ccType = getCCFieldType(input);
+    if (ccType)
+        setCachedSubType(input, ccType);
+    return ccType !== undefined;
+};
+export const isCCInputField = (fnode) => {
+    const { isCC, visible } = fnode.noteFor("field");
+    if (!visible)
+        return false;
+    return isCC;
+};
+export const isCCSelectField = (fnode) => {
+    const select = fnode.element;
+    if (!(select instanceof HTMLSelectElement))
+        return false;
+    if (getCachedCCSubtype(select))
+        return true;
+    const visible = isVisible(select, { opacity: false });
+    if (!visible)
+        return false;
+    const isProcessable = isClassifiable(select);
+    if (!isProcessable)
+        return false;
+    const ccType = getCCFieldType(select);
+    if (ccType)
+        setCachedSubType(select, ccType);
+    return ccType !== undefined;
+};

package/utils/credit-card.samples.spec.d.ts

@@ -0,0 +1 @@
+export {};