@intuned/browser-dev 0.1.4-dev.0

package/dist/common/matching/matching.js

@@ -0,0 +1,317 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.filterAndRankMatches = filterAndRankMatches;
+exports.isMatchExact = isMatchExact;
+exports.matchStringsWithDomContent = matchStringsWithDomContent;
+exports.matchStringsWithDomContentInBrowser = matchStringsWithDomContentInBrowser;
+exports.normalizeSpacing = normalizeSpacing;
+exports.rankMatch = rankMatch;
+exports.removePunctuationAndSpaces = removePunctuationAndSpaces;
+exports.replaceWithBestMatches = replaceWithBestMatches;
+exports.selectBestMatch = selectBestMatch;
+var _utils = require("../../helpers/utils");
+const logger = {
+  info: message => console.info(message),
+  warning: message => console.warn(message),
+  error: message => console.error(message)
+};
+function normalizeSpacing({
+  text
+}) {
+  let normalized = text.replace(/\n/g, " ").replace(/\t/g, " ");
+  normalized = normalized.split(/\s+/).join(" ");
+  return normalized.trim();
+}
+function isMatchExact({
+  data,
+  value
+}) {
+  if (data === "" || value === "") {
+    return [false, ""];
+  }
+  const normalizedData = normalizeSpacing({
+    text: data
+  });
+  const normalizedValue = normalizeSpacing({
+    text: value
+  });
+  return [normalizedData.toLowerCase() === normalizedValue.toLowerCase(), normalizedValue];
+}
+function removePunctuationAndSpaces({
+  s
+}) {
+  const punctuation = "!\"#$%&'()*+,-./:;<=>?@[\\]^_`{|}~";
+  return s.split("").filter(c => !punctuation.includes(c) && c !== " ").join("");
+}
+function rankMatch({
+  original,
+  match
+}) {
+  try {
+    const normalizedOriginal = normalizeSpacing({
+      text: original
+    }).toLowerCase();
+    const normalizedMatch = normalizeSpacing({
+      text: match
+    }).toLowerCase();
+    const ratio = calculateSimilarityRatio(normalizedOriginal, normalizedMatch);
+    const lenOriginal = normalizedOriginal.length;
+    if (lenOriginal > 20 && ratio > 0.85) {
+      return "HIGH";
+    }
+    const normalizedOriginalNoPunct = removePunctuationAndSpaces({
+      s: normalizedOriginal
+    });
+    const normalizedMatchNoPunct = removePunctuationAndSpaces({
+      s: normalizedMatch
+    });
+    if (normalizedOriginalNoPunct === normalizedMatchNoPunct) {
+      return "HIGH";
+    }
+    return "LOW";
+  } catch (error) {
+    logger.warning("Error in rankMatch, falling back to simple comparison");
+    const normalizedOriginal = removePunctuationAndSpaces({
+      s: normalizeSpacing({
+        text: original
+      }).toLowerCase()
+    });
+    const normalizedMatch = removePunctuationAndSpaces({
+      s: normalizeSpacing({
+        text: match
+      }).toLowerCase()
+    });
+    if (normalizedOriginal === normalizedMatch) {
+      return "HIGH";
+    }
+    return "LOW";
+  }
+}
+function calculateSimilarityRatio(str1, str2) {
+  const longer = str1.length > str2.length ? str1 : str2;
+  const shorter = str1.length > str2.length ? str2 : str1;
+  if (longer.length === 0) {
+    return 1.0;
+  }
+  return (longer.length - editDistance(longer, shorter)) / longer.length;
+}
+function editDistance(str1, str2) {
+  const matrix = Array(str2.length + 1).fill(null).map(() => Array(str1.length + 1).fill(null));
+  for (let i = 0; i <= str1.length; i++) matrix[0][i] = i;
+  for (let j = 0; j <= str2.length; j++) matrix[j][0] = j;
+  for (let j = 1; j <= str2.length; j++) {
+    for (let i = 1; i <= str1.length; i++) {
+      if (str1[i - 1] === str2[j - 1]) {
+        matrix[j][i] = matrix[j - 1][i - 1];
+      } else {
+        matrix[j][i] = Math.min(matrix[j - 1][i - 1] + 1, matrix[j][i - 1] + 1, matrix[j - 1][i] + 1);
+      }
+    }
+  }
+  return matrix[str2.length][str1.length];
+}
+function selectBestMatch({
+  original,
+  matches
+}) {
+  const exactMatches = matches.filter(match => match.match_mode !== "fuzzy");
+  if (exactMatches.length > 0) {
+    const bestMatch = exactMatches[0];
+    return {
+      matchText: bestMatch.matched_value,
+      matchXpath: bestMatch.xpath,
+      matchType: bestMatch.match_source === "direct_text_node" ? "direct-text" : bestMatch.match_source === "attribute" ? {
+        attribute: "unknown"
+      } : "all-text"
+    };
+  }
+  const fuzzyMatches = matches.filter(match => match.match_mode === "fuzzy");
+  const rankedFuzzyMatches = fuzzyMatches.map(match => ({
+    match,
+    rank: rankMatch({
+      original,
+      match: match.matched_value
+    })
+  }));
+  const highRankedMatches = rankedFuzzyMatches.filter(item => item.rank === "HIGH");
+  const filteredFuzzyMatches = highRankedMatches.map(item => item.match);
+  if (filteredFuzzyMatches.length > 0) {
+    const sortedFuzzyMatches = filteredFuzzyMatches.sort((a, b) => (a.fuzzy_distance || Infinity) - (b.fuzzy_distance || Infinity));
+    const bestMatch = sortedFuzzyMatches[0];
+    return {
+      matchText: bestMatch.matched_value,
+      matchXpath: bestMatch.xpath,
+      matchType: bestMatch.match_source === "direct_text_node" ? "direct-text" : bestMatch.match_source === "attribute" ? {
+        attribute: "unknown"
+      } : "all-text"
+    };
+  }
+  return null;
+}
+async function matchStringsWithDomContent({
+  pageObject,
+  stringsList,
+  container = null
+}) {
+  try {
+    await (0, _utils.ensureBrowserScripts)(pageObject);
+    let handle;
+    if (container) {
+      handle = container;
+    } else {
+      handle = await pageObject.locator("html").elementHandle();
+    }
+    const matches = await pageObject.evaluate(async args => {
+      const [container, searchTexts] = args;
+      try {
+        if (typeof window.__INTUNED__ !== "undefined" && typeof window.__INTUNED__.matchStringsWithDomContent === "function") {
+          return await window.__INTUNED__.matchStringsWithDomContent(container, searchTexts);
+        } else {
+          return searchTexts.reduce((acc, text) => {
+            acc[text] = [];
+            return acc;
+          }, {});
+        }
+      } catch (error) {
+        console.error("Error matching strings with DOM content:", error);
+        return searchTexts.reduce((acc, text) => {
+          acc[text] = [];
+          return acc;
+        }, {});
+      }
+    }, [handle, stringsList]);
+    return matches;
+  } catch (error) {
+    logger.warning(`Error matching strings with DOM content: ${error}`);
+    return stringsList.reduce((acc, string) => {
+      acc[string] = [];
+      return acc;
+    }, {});
+  }
+}
+async function replaceWithBestMatches({
+  stringsToMatch,
+  pageObject,
+  container = null
+}) {
+  const matchesMap = await matchStringsWithDomContent({
+    pageObject,
+    stringsList: stringsToMatch,
+    container
+  });
+  const replacements = {};
+  const xpathMapping = {};
+  for (const [string, matches] of Object.entries(matchesMap)) {
+    const bestMatch = matches.length > 0 ? selectBestMatch({
+      original: string,
+      matches
+    }) : null;
+    replacements[string] = bestMatch;
+    if (bestMatch) {
+      xpathMapping[bestMatch.matchText] = [{
+        xpath: bestMatch.matchXpath,
+        matchType: bestMatch.matchType
+      }];
+    }
+  }
+  return {
+    replacements,
+    xpathMapping
+  };
+}
+async function filterAndRankMatches(frame, matches) {
+  const filteredMatches = matches.filter(match => {
+    const xpath = match.xpath;
+    return !(xpath.includes("[name()='svg']/") || xpath.includes("/path") || xpath.includes("/style"));
+  });
+  async function getVisibility(match) {
+    try {
+      const locator = frame.locator(`xpath=${match.xpath}`);
+      return await locator.isVisible({
+        timeout: 100
+      });
+    } catch {
+      return false;
+    }
+  }
+  const visibilityResults = await Promise.all(filteredMatches.map(match => getVisibility(match)));
+  const modeOrder = {
+    full: 3,
+    partial: 2,
+    fuzzy: 1
+  };
+  const sourceOrder = {
+    direct_text_node: 3,
+    text_content: 2,
+    attribute: 1
+  };
+  function sortKey(match, visible) {
+    const modeKey = modeOrder[match.match_mode.toLowerCase()] || 0;
+    const sourceKey = sourceOrder[match.match_source.toLowerCase()] || 0;
+    const visibleKey = visible ? 1 : 0;
+    let partialScore = 0;
+    if (match.match_mode.toLowerCase() === "partial" && match.matched_source_value && match.matched_value) {
+      const extraChars = match.matched_source_value.length - match.matched_value.length;
+      if (extraChars === 0) {
+        partialScore = 1;
+      } else {
+        partialScore = 1 / extraChars;
+      }
+    }
+    return modeKey + sourceKey + visibleKey + partialScore;
+  }
+  const matchesWithVisibility = filteredMatches.map((match, index) => ({
+    match,
+    visible: visibilityResults[index]
+  }));
+  const sortedMatchesWithVisibility = matchesWithVisibility.sort((a, b) => sortKey(b.match, b.visible) - sortKey(a.match, a.visible));
+  const sortedMatches = sortedMatchesWithVisibility.map(item => item.match);
+  const seenXpaths = new Set();
+  const uniqueMatches = [];
+  for (const match of sortedMatches) {
+    if (seenXpaths.has(match.xpath)) {
+      continue;
+    }
+    seenXpaths.add(match.xpath);
+    uniqueMatches.push(match);
+  }
+  return uniqueMatches;
+}
+async function matchStringsWithDomContentInBrowser(frame, stringsList, container = null) {
+  let handle;
+  if (container) {
+    handle = await container.elementHandle();
+  } else {
+    handle = await frame.locator("html").elementHandle();
+  }
+  logger.info(`Searching for ${stringsList.length} strings in the DOM, ${stringsList}`);
+  const matches = await frame.evaluate(async args => {
+    const [container, searchTexts] = args;
+    const result = await window.__INTUNED__.matchStringsWithDomContent(container, searchTexts);
+    return result;
+  }, [handle, stringsList]);
+  let frames = [];
+  if ("childFrames" in frame) {
+    frames = frame.childFrames();
+  } else if ("frames" in frame) {
+    frames = frame.frames();
+  }
+  for (const subframe of frames) {
+    try {
+      const frameMatches = await matchStringsWithDomContentInBrowser(subframe, stringsList, null);
+      for (const [string, stringMatches] of Object.entries(frameMatches)) {
+        if (string in matches) {
+          matches[string].extend(stringMatches);
+        } else {
+          matches[string] = stringMatches;
+        }
+      }
+    } catch {
+      continue;
+    }
+  }
+  return matches;
+}

package/dist/common/matching/types.js

@@ -0,0 +1 @@
+"use strict";

package/dist/common/noEmpty.js

@@ -0,0 +1,9 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = noEmpty;
+function noEmpty(value) {
+  return value !== null && value !== undefined;
+}

package/dist/common/saveSnapshotWithExamples.js

@@ -0,0 +1,60 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.__saveSnapshotWithExamples = __saveSnapshotWithExamples;
+exports.__saveSnapshotWithExamplesFromPage = __saveSnapshotWithExamplesFromPage;
+var _clientS = require("@aws-sdk/client-s3");
+var z = _interopRequireWildcard(require("zod"));
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+function shouldSkipCaptureSnapshots() {
+  return process.env.DISABLE_CAPTURE_EXAMPLE === "true";
+}
+async function __saveSnapshotWithExamplesFromPage(page, snapshotName, examples, s3Configs) {
+  const html = await page.content();
+  const url = page.url();
+  return __saveSnapshotWithExamples(snapshotName, examples, html, url, s3Configs);
+}
+async function __saveSnapshotWithExamples(snapshotName, examples, html, url, s3Configs) {
+  if (shouldSkipCaptureSnapshots()) {
+    return;
+  }
+  const origin = new URL(url).origin;
+  const defaultConfigs = {
+    accessKeyId: process.env.SNAPSHOT_S3_ACCESS_KEY_ID,
+    bucket: process.env.SNAPSHOT_S3_BUCKET,
+    folderName: process.env.SNAPSHOT_S3_FOLDER,
+    region: process.env.SNAPSHOT_S3_REGION,
+    secretAccessKey: process.env.SNAPSHOT_S3_SECRET_ACCESS_KEY
+  };
+  const schema = z.record(z.string(), z.any());
+  const parsedConfigs = schema.safeParse({
+    ...defaultConfigs,
+    ...s3Configs
+  });
+  if (parsedConfigs.success === false) {
+    return;
+  }
+  const configs = parsedConfigs.data;
+  const folderPath = `${configs.folderName}`;
+  const client = new _clientS.S3Client({
+    region: configs.region,
+    credentials: {
+      accessKeyId: configs.accessKeyId,
+      secretAccessKey: configs.secretAccessKey
+    }
+  });
+  const snapshotJson = {
+    origin,
+    html,
+    examples
+  };
+  await client.send(new _clientS.PutObjectCommand({
+    Bucket: configs.bucket,
+    Key: `${folderPath}/${snapshotName}.json`,
+    Body: JSON.stringify(snapshotJson),
+    ContentType: "application/json"
+  }));
+  console.log("Snapshot saved successfully.", snapshotName);
+}