sefiutils 1.0.46 → 1.0.47

package/src/seUtils.ts

@@ -0,0 +1,836 @@
+/**
+ * (C) Jens von Pilgrim, 2023
+ */
+import dotenv from "dotenv";
+dotenv.config() // read ".env"
+
+
+import * as fs from "fs";
+import * as fsPromises from "fs/promises";
+import path from "path";
+import { By, Locator, WebDriver, WebElement } from 'selenium-webdriver';
+
+export function getRemoteAddressAndPort(): { address: string; port: number; } {
+    const address = process.env.SEFI_SELENIUM_REMOTE_URL || "http://localhost:4444/wd/hub";
+    const port = Number(address.match(/:(\d+)\/?/)?.[1] || 80);
+    return { address, port };
+}
+
+/**
+ * Compares a given string with either a string or a regex.
+ * @param str string to compare
+ * @param stringOrRegEx string or regex to compare with 
+ * @param options (ignoreCase is ignored if stringOrRegEx is a regex)
+ * @returns 
+ */
+export function cmpStrings(str: string | undefined, stringOrRegEx: undefined | string | RegExp, options?: { ignoreCase?: boolean }) {
+    if (stringOrRegEx === null || stringOrRegEx === undefined) {
+        return str === undefined || str === null;
+    }
+    if (str === null || str === undefined) {
+        return false;
+    }
+
+    if (stringOrRegEx instanceof RegExp) {
+        return stringOrRegEx.test(str!);
+    }
+
+    return (options?.ignoreCase)
+        ? str!.toLocaleLowerCase() === (stringOrRegEx as string)!.toLocaleLowerCase()
+        : str === stringOrRegEx;
+
+}
+
+export async function execScript<T>(driver: WebDriver, scriptName: string, fct: string): Promise<T> {
+    const scriptPath = path.join(path.dirname(__filename), scriptName);
+    const script = fs.readFileSync(scriptPath, "utf-8");
+    const res = await driver.executeScript(script + `
+        return ${fct}();
+    `);
+    return res as T;
+}
+
+export interface Bounds {
+    top: number;
+    left: number;
+    bottom: number;
+    right: number;
+}
+
+
+export function boundsToString(bounds: Bounds) {
+    return `(${bounds.left};${bounds.top})x(${bounds.right};${bounds.bottom})`
+}
+
+export function toFloor(bounds: Bounds[]) {
+    const floors: Bounds[] = [];
+    for (const b of bounds) {
+        floors.push({
+            top: Math.floor(b.top),
+            bottom: Math.floor(b.bottom),
+            left: Math.floor(b.left),
+            right: Math.floor(b.right)
+        })
+    }
+    return floors;
+}
+
+/**
+ * Coordinates are sometimes floats. We compare two numbers with a delta of 1 to ignore rounding problems. 
+ */
+export function circa(n1: number, n2: number) {
+    const delta = n1 - n2;
+    return Math.abs(delta) < 1;
+}
+
+
+
+export async function waitFor<T>(callback: () => Promise<T>, timeout = 1000, intervalTime = 100): Promise<T> {
+    // try first time
+    const start = new Date().getTime();
+    try {
+        const result = await callback();
+        return result;
+    } catch (error) {
+        // ignore error
+    }
+    // if error, try until timeout ms have passed
+    return new Promise<T>((resolve, reject) => {
+        const interval = setInterval(async () => {
+            try {
+                const result = await callback();
+                clearInterval(interval);
+                resolve(result);
+            } catch (error) {
+                const duration = new Date().getTime() - start;
+                if (duration > timeout) {
+                    clearInterval(interval);
+                    reject(error);
+                }
+            }
+        }, intervalTime);
+    });
+}
+
+
+/**
+ * Takes screenshot of current window and saves it to the given file.
+ * The folder is created if it does not yet exists.
+ */
+export async function saveScreenshot(driver: WebDriver, fileName: string): Promise<void> {
+    const pngBase64 = await driver.takeScreenshot();
+    const dirName = path.dirname(fileName);
+    if (!fs.existsSync(dirName)) {
+        await fsPromises.mkdir(dirName, { recursive: true });
+    }
+    await fsPromises.writeFile(fileName, pngBase64, 'base64');
+}
+
+
+
+/**
+ * Helper function for printing out an element (tag, id if present)
+ */
+export async function describe(we: WebElement) {
+    let s = await we.getTagName();
+    const id = await we.getAttribute("id");
+    if (id) {
+        s += "#" + id;
+    } else {
+        const clazz = await we.getAttribute("class");
+        if (clazz) {
+            s += "." + clazz;
+        }
+        let text = await we.getText();
+        s += ` ("${text.substring(0, 7)}${text.length > 7 ? '…' : ''})"`;
+    }
+    return s;
+}
+
+/**
+ * Gets the element by means of `WebElement` by its id attribute,
+ * either of the whole document (if driver is given) or of the given parent element.
+ */
+export async function getElementById(driverOrParent: WebDriver | WebElement, id: string): Promise<WebElement> {
+    const el = await driverOrParent.findElement(By.id(id));
+    return el;
+}
+
+/**
+ * Gets the first element by means of `WebElement` by its class attribute,
+ * either of the whole document (if driver is given) or of the given parent element.
+ */
+export async function getElementByClass(driverOrParent: WebDriver | WebElement, clazz: string): Promise<WebElement> {
+    const el = await driverOrParent.findElement(By.className(clazz));
+    return el;
+}
+
+/**
+ * Gets all element by means of `WebElement` by its class attribute,
+ * either of the whole document (if driver is given) or of the given parent element.
+ */
+export async function getElementsByClass(driverOrParent: WebDriver | WebElement, clazz: string): Promise<WebElement[]> {
+    const els = await driverOrParent.findElements(By.className(clazz));
+    return els;
+}
+
+/**
+ * Gets the first element by means of `WebElement` by its tag name,
+ * either of the whole document (if driver is given) or of the given parent element.
+ */
+export async function getElementByTag(driverOrParent: WebDriver | WebElement, tagName: string): Promise<WebElement> {
+    const el = await driverOrParent.findElement(By.css(tagName));
+    return el;
+}
+
+/**
+ * Gets all elements by means of `WebElement` by its tag name,
+ * either of the whole document (if driver is given) or of the given parent element.
+ */
+export async function getElementsByTag(driverOrParent: WebDriver | WebElement, tagName: string): Promise<WebElement[]> {
+    const els = await driverOrParent.findElements(By.css(tagName));
+    return els;
+}
+
+/**
+ * Gets all elements by means of `WebElement` by its tag name,
+ * either of the whole document (if driver is given) or of the given parent element.
+ */
+export async function getElementsByTags(driverOrParent: WebDriver | WebElement, tagNames: string[]): Promise<WebElement[]> {
+    const els: WebElement[] = [];
+    for (const tagName of tagNames) {
+        const elByTag = await driverOrParent.findElements(By.css(tagName));
+        els.push(...elByTag);
+    }
+    return els;
+}
+
+/**
+ * Returns first element containing given text or undefined,
+ * either of the whole document (if driver is given) or of the given parent element.
+ * 
+ * Test in browser console: `$x("//*[contains(text(), 'Hello')]")`
+ */
+export async function getElementContainingText(driverOrParent: WebDriver | WebElement, text: string): Promise<WebElement | undefined> {
+    try {
+        // cf. https://stackoverflow.com/questions/3655549/xpath-containstext-some-string-doesnt-work-when-used-with-node-with-more
+        //const el = await driver.findElement(By.xpath(`//*[contains(text(), "${text}")]`));
+        const el = await driverOrParent.findElement(By.xpath(`//*[text()[contains(., '${text}')]]`));
+        return el;
+    } catch (error) {
+        return undefined;
+    }
+}
+
+
+/**
+ * Returns the bounding client rect (the bounding box relative to the viewport)
+ * of an element (found by its id attribute) by means of a JavaScript call.
+ */
+export async function getBoundingClientRect(driver: WebDriver, id: string): Promise<DOMRect> {
+    const bcr = await driver.executeScript('return document.getElementById("' + id + '").getBoundingClientRect()');
+    return bcr as DOMRect;
+}
+
+/**
+ * Returns all {@link getBoundingClientRect} values of the elements
+ * found in the given element list.
+ * The element list is computed by means of JavaScript code,
+ * e.g. `document.getElementsByClassName('grid').item(0).children`.
+ * 
+ * @param elementList JavaScript code to determine the element list
+ */
+export async function getBoundingClientRects(driver: WebDriver, jsElementList: string): Promise<DOMRect[]> {
+    const bcr = await driver.executeScript(
+        `return (()=>{ 
+            const elements = ${jsElementList};
+            const bounds=[];
+            for (let el of elements) { bounds.push(el.getBoundingClientRect()) }
+            return bounds;
+        })()`) as DOMRect[];
+    return bcr;
+}
+
+/**
+ * Returns the node content's rect, in particular of the text, of a element with the given id.
+ */
+export async function getNodeContentsRect(driver: WebDriver, id: string): Promise<DOMRect> {
+    const bcr = await driver.executeScript(
+        `return (() => {
+            const range = document.createRange();
+            range.selectNodeContents(document.getElementById("${id}"));
+            return range.getClientRects()[0]
+        })()`) as DOMRect;
+    return bcr;
+}
+
+/**
+ * Returns the node content's rect, in particular of the text, of multiple elements 
+ * (selected via evalutation of the jsElementString).
+ */
+export async function getNodeContentsRects(driver: WebDriver,  jsElementList: string): Promise<DOMRect[]> {
+    const bcr = await driver.executeScript(
+        `return (() => {
+            const elements = ${jsElementList};
+            const bounds=[];
+            for (let el of elements) { 
+                const range = document.createRange();
+                range.selectNodeContents(el);
+                bounds.push(range.getClientRects()[0])
+            }
+            return bounds
+        })()`) as DOMRect[];
+    return bcr;
+}
+
+/**
+ * Returns the rects using the driver API.
+ */
+export async function getRects(driver: WebDriver, locator: Locator): Promise<Bounds[]> {
+    const elements = await driver.findElements(locator);
+    const bounds: Bounds[] = [];
+    for (const element of elements) {
+        const rect = await element.getRect();
+        bounds.push({
+            top: rect.x, left: rect.y,
+            bottom: rect.x + rect.width, right: rect.y + rect.height
+        });
+    }
+    return bounds;
+}
+
+/**
+ * Returns the rects of the first child (of each found element) using the driver API.
+ */
+export async function getRectsOfContent(driver: WebDriver, locator: Locator): Promise<Bounds[]> {
+    const elements = await driver.findElements(locator);
+    const bounds: Bounds[] = [];
+    for (const element of elements) {
+        const rect = await element.getRect();
+        bounds.push({
+            top: rect.x, left: rect.y,
+            bottom: rect.x + rect.width, right: rect.y + rect.height
+        });
+    }
+    return bounds;
+}
+
+
+
+
+/**
+ * Returns all text content of the elements
+ * found in the given element list.
+ * The elements list is computed by means of JavaScript code,
+ * e.g. `document.getElementsByClassName('grid').item(0).children`.
+ * 
+ * This is useful in combination with {@link getBoundingClientRects} in 
+ * order to describe the items.
+ * 
+ * @param elementList JavaScript code to determine the element list
+ */
+export async function getTextContents(driver: WebDriver, jsElementList: string): Promise<string[]> {
+    const tcs = await driver.executeScript(
+        `const elements = ${jsElementList};
+         const tcs=[];
+         for (let el of elements) { tcs.push(el.textContent) }
+         return tcs;
+        `) as string[];
+    return tcs;
+}
+
+/**
+ * Returns the text content of the whole document.
+ */
+export async function getDocumentTextContent(driver: WebDriver): Promise<string> {
+    return await driver.executeScript(`return document.documentElement.textContent`)
+};
+
+/**
+ * Returns all computed styles of the elements
+ * found in the given element list.
+ * The elements list is computed by means of JavaScript code,
+ * e.g. `document.getElementsByClassName('grid').item(0).children`.
+ * 
+ * @param elementList JavaScript code to determine the element list
+ */
+export async function getComputedStyles(driver: WebDriver, jsElementList: string, style: string): Promise<string[]> {
+    const tcs = await driver.executeScript(
+        `const elements = ${jsElementList};
+         const tcs=[];
+         for (let el of elements) { tcs.push(getComputedStyle(el).${style}) }
+         return tcs;
+        `) as string[];
+    return tcs;
+}
+
+
+/**
+ * Returns the inner size of the windows bounding client rect (the bounding box relative to the viewport)
+ * of an element (found by its is attribute) by means of a JavaScript call.
+ * The window size contains the scrollbars. I.e. it is a bit larger than {@link getViewPortSize}.
+ */
+export async function getInnerSizeOfWindow(driver: WebDriver): Promise<{ width: number, height: number }> {
+    const w = await driver.executeScript('return window.innerWidth') as number;
+    const h = await driver.executeScript('return window.innerHeight') as number;
+    return { width: w, height: h };
+}
+
+/**
+ * Returns the viewport size, which is the inner window size but not with the scrollbars.
+ * I.e. the viewport size is a bit smaller than {@link getInnerSizeOfWindow} (if scrollbars are visible).
+ * The value is retrieved by means of JavaScript.
+ */
+export async function getViewPortSize(driver: WebDriver): Promise<{ width: number, height: number }> {
+    const [clientWidthOfHTML, clientHeightOfHTML] = await Promise.all([
+        driver.executeScript("return document.documentElement.clientWidth"),
+        driver.executeScript("return document.documentElement.clientHeight")]) as number[];
+    return { width: clientWidthOfHTML, height: clientHeightOfHTML };
+}
+
+/**
+ * Returns true if the element identified by its id attribute is with the view port.
+ * That does not necessarily means that it is visible, since its display or visible attribute may
+ * hide the element.
+ */
+export async function isInViewPort(driver: WebDriver, id: string) {
+    const innerSize = await getInnerSizeOfWindow(driver);
+    const [x, y] = await Promise.all([
+        driver.executeScript('return window.scrollX'),
+        driver.executeScript('return window.scrollY')]) as number[];
+    const bounds = await getBoundingClientRect(driver, id);
+    return bounds.x + bounds.width >= x && bounds.y + bounds.height >= y
+        && bounds.x < x + innerSize.width && bounds.y < y + innerSize.height
+}
+
+/**
+ * Sets the window so that the {@link getViewPortSize} matches the given width and height.
+ */
+export async function setBrowserWindowSize(driver: WebDriver, width: number, height: number): Promise<void> {
+    // const rect = await driver.manage().window().getRect();
+    await waitForSetRect(driver, width, height);
+    // await driver.manage().window().setRect({ width: width, height: height });
+    // return waitFor(async () => {
+    //     const rectAfter = await driver.manage().window().getRect();
+
+    //     if (check && (rectAfter.width != width || rectAfter.height != height)) {
+    //         throw new Error(`Cannot set window to size (${width}, ${height}). Size is probably too small or too large, got ${rectAfter.width}/${rectAfter.height},  was before ${rect.width}/${rect.height}.`);
+    //     }
+    // });
+}
+
+async function waitForSetRect(driver: WebDriver, width: number, height: number): Promise<void> {
+    const rectBefore = await driver.manage().window().getRect();
+
+    await driver.manage().window().setRect({ width: width, height: height });
+    return waitFor(async () => {
+        const rectAfter = await driver.manage().window().getRect();
+        if (rectAfter.width != width || rectAfter.height != height) {
+            throw new Error(`Cannot set window to size (${width}, ${height}). Size is probably too small or too large, got ${rectAfter.width}/${rectAfter.height}, was before ${rectBefore.width}/${rectBefore.height}.`);
+        }
+    });
+}
+
+/**
+ * Sets the window so that the {@link getViewPortSize} matches the given width and height. Warning: This does not work reliably.
+ */
+export async function setViewPortSize(driver: WebDriver, width: number, height: number): Promise<void> {
+    const rect = await driver.manage().window().getRect();
+    const innerBefore = await getInnerSizeOfWindow(driver);
+    const deltaX = rect.width - innerBefore.width;
+    const deltaY = rect.height - innerBefore.height;
+    await waitForSetRect(driver, width + deltaX, height + deltaY);
+
+    const [innerAfter, viewport] = await Promise.all([getInnerSizeOfWindow(driver), getViewPortSize(driver)]);
+
+    // adjust scrollbars if necessary
+    const sbHeight = innerAfter.height - viewport.height;
+    const sbWidth = innerAfter.width - viewport.width;
+    await waitForSetRect(driver, width + deltaX + sbWidth, height + deltaY + sbHeight);
+}
+
+export async function getInheritedBackgroundColorsByJS(driver: WebDriver, nodelist: string) {
+    const colors = await driver.executeScript(`
+        const list = ${nodelist};
+        function getDefaultBackground() {
+            var div = document.createElement("div")
+            document.head.appendChild(div)
+            var bg = getComputedStyle(div).backgroundColor
+            document.head.removeChild(div)
+            return bg
+        }
+        const defaultStyle = getDefaultBackground()
+        function getInheritedBackgroundColor(el) {
+            var backgroundColor = getComputedStyle(el).backgroundColor
+            if (backgroundColor != defaultStyle) return backgroundColor
+            if (!el.parentElement) return defaultStyle
+            return getInheritedBackgroundColor(el.parentElement)
+        }
+        const colors = []
+        for (let e of list) {
+            colors.push(getInheritedBackgroundColor(e));
+        }
+        return colors;
+      `) as string[];
+    return colors;
+}
+
+export async function getInheritedColorsByJS(driver: WebDriver, nodelist: string) {
+    const colors = await driver.executeScript(`
+        const list = ${nodelist};
+        function getDefaultColor() {
+            var div = document.createElement("div")
+            document.head.appendChild(div)
+            var bg = getComputedStyle(div).color
+            document.head.removeChild(div)
+            return bg
+        }
+        const defaultStyle = getDefaultColor()
+        function getInheritedColor(el) {
+            var color = getComputedStyle(el).color
+            if (color != defaultStyle) return color
+            if (!el.parentElement) return defaultStyle
+            return getInheritedColor(el.parentElement)
+        }
+        const colors = []
+        for (let e of list) {
+            colors.push(getInheritedColor(e));
+        }
+        return colors;
+      `) as string[];
+    return colors;
+}
+
+function rgb2hex(rgba: string) {
+    return "#" +
+        rgba.match(/^rgba?\((\d+),\s*(\d+),\s*(\d+)(?:,\s*(\d+\.{0,1}\d*))?\)$/)!
+            .slice(1)
+            .map((n, i) => (i === 3
+                ? Math.round(parseFloat(n) * 255)
+                : parseFloat(n)).toString(16).padStart(2, '0').replace('NaN', ''))
+            .join('');
+}
+
+export async function getAllTextNodes(driver: WebDriver): Promise<{ text: string; color: string; background: string; line: string; }[]> {
+    const res = await driver.executeScript(`
+    
+const TRANSPARENT = "rgba(0, 0, 0, 0)";
+const all = []; 
+const view = document.defaultView;
+function collect(e) {
+    const styles = view.getComputedStyle(e);
+    const pStyles = view.getComputedStyle(e.parentElement);
+    const childNodes = e.childNodes;
+    for (let i=0; i<childNodes.length; i++) {
+        const node = childNodes.item(i);
+        if (node instanceof Element) {
+           collect(node);
+        } else if (node instanceof Text && node.textContent.trim().length>0) {
+            all.push({ 
+                text: node.textContent.trim(), 
+                color: styles?.color!==TRANSPARENT?styles?.color:pStyles?.color,
+                background: styles?.backgroundColor!==TRANSPARENT?styles?.backgroundColor:pStyles?.backgroundColor,
+                line: styles?.textDecorationLine==='none'?pStyles?.textDecorationLine:styles?.textDecorationLine
+            });
+        }
+    }
+}
+collect(document.body);
+
+
+    return all;
+    `) as { text: string, color: string, background: string, line: string }[];
+
+    res.forEach(e => {
+        e.color = rgb2hex(e.color);
+        e.background = rgb2hex(e.background);
+    });
+
+
+    return res;
+}
+
+/**
+ * Retrieves all buttons (element button or input with property submit or button) or anchors with href.
+ * @param driver
+ * @returns 
+ */
+export async function getButtonsAndHRefs(driver: WebDriver): Promise<WebElement[]> {
+    const elements: WebElement[] = await execScript(driver,
+        "execScripts/getButtonsAndHRefs.js", "getButtonsAndHRefs");
+    return elements;
+}
+
+/**
+ * Retrieves a button or link with the given text.
+ * The text is matched case insensitive and may be a substring of the button/link text.
+ * If there are multiple matches, the best one is returned using {@link findBestMatchingIndex}.
+ * @param driver
+ * @param variations Variations in order of priority
+ * @returns the matching element or undefined
+ */
+export async function findButtonOrHRefWithText(driver: WebDriver, variations: string[]): Promise<WebElement | undefined> {
+    const clickableElements = (await getButtonsAndHRefs(driver))
+    const candidates: WebElement[] = [];
+    const texts: string[] = [];
+    for (const el of clickableElements) {
+        const text = (await el.getText());
+        texts.push(text);
+        candidates.push(el);
+    }
+    if (candidates.length === 1) {
+        return candidates[0];
+    } else {
+        const index = findBestMatchingIndex(texts, variations);
+        if (index >= 0) {
+            return candidates[index];
+        }
+    }
+    return undefined;
+}
+
+/**
+ * Returns a submit button or any other button (if onlySubmit is false). 
+ * If there is only one submit button, it is returned.
+ * If there are multiple (submit) buttons, the best one is returned using {@link findBestMatchingIndex}.
+ * If there is no best matching text, the position hint is used.
+ * If the position hint is less 0 or greater than the number of submit buttons, the first one is returned.
+ * @param textCandidates 
+ * @param posHint 
+ * @param onlySubmit only submit buttons are considered, otherwise, all buttons are considered 
+ * @returns a button or undefined
+ */
+export async function findSubmitButton(driver: WebDriver, textCandidates: string[], posHint = -1, onlySubmit = true): Promise<WebElement | undefined> {
+    const clickableElements = (await getButtonsAndHRefs(driver));
+    const candidates: WebElement[] = [];
+    const onlySubmitCandidates: WebElement[] = [];
+    for (const el of clickableElements) {
+        const type = (await el.getAttribute("type"))?.toLowerCase();
+        const tag = (await el.getTagName())?.toLowerCase();
+        if (tag === "button"|| type == "submit" || type == "button") {
+            if (type === "submit" || !onlySubmit) {
+                candidates.push(el);
+            }
+            if (type === "submit") {
+                onlySubmitCandidates.push(el);
+            }
+        }
+    }
+    if (candidates.length <= 1) {
+        return candidates[0]; // maybe undefined
+    }
+    if (onlySubmitCandidates.length === 1) {
+        return onlySubmitCandidates[0];
+    }
+    const texts: string[] = [];
+    for (const el of candidates) {
+        const text = await el.getText();
+        texts.push(text);
+    }
+    const index = findBestMatchingIndex(texts, textCandidates);
+    if (index >= 0) {
+        return candidates[index];
+    }
+    if (posHint >= 0 && posHint < candidates.length) {
+        return candidates[posHint];
+    }
+    return candidates[0]; // maybe undefined
+}
+
+/**
+ * Scrolls to the element and clicks it.
+ * If element is not defined, an error is thrown.
+ */
+export async function scrollIntoViewAndClick(element: WebElement) {
+    if (!element) {
+        throw new Error("Element is undefined");
+    }
+    const driver = element.getDriver();
+    await driver.executeScript("arguments[0].scrollIntoView(true);", element);
+    await new Promise(r => setTimeout(r, 700)); // let the page update, this should be super fast
+    await element.click();
+}
+
+/**
+ * Returns best matching candidate index or -1 if none matches.
+ * Best matching means that the text of the candidate is either
+ *  - equal to one of the variations
+ *  - equal to one of the variations ignoring case
+ *  - contains one of the variations
+ *  - contains one of the variations ignoring case
+ *  - has the smallest edit distance to one of the variations 
+ *  (lower case, only variations and candidates with a length twice as long as maxDistance are considered
+ * @param candidates The candidates of which the index is to be returned
+ * @param variations The variations in order of priority
+ * @param maxDistance The maximum edit distance to be considered
+ */
+export function findBestMatchingIndex(candidates: string[], variations: string[], maxDistance = 2): number {
+
+    const lcVariations = variations.map(v => v.toLowerCase());
+    const lcCandidates = candidates.map(c => c.toLowerCase());
+
+    const minLength = maxDistance * 2;
+
+    const searches = [
+        () => candidates.findIndex(c => variations.includes(c)),
+        () => lcCandidates.findIndex(c => lcVariations.includes(c)),
+        () => candidates.findIndex(c => variations.some(v => c.includes(v))),
+        () => lcCandidates.findIndex(c => lcVariations.some(v => c.includes(v))),
+        () => {
+            let bestDist = Number.MAX_SAFE_INTEGER;
+            let bestIndex = -1;
+            for (const variation of variations) {
+                if (variation.length >= minLength) {
+                    for (let index = 0; index < candidates.length; index++) {
+                        const candidate = candidates[index];
+                        if (candidate.length >= minLength) {
+                            const dist = editDistance(candidate, variation, maxDistance);
+                            if (dist <= 1) { // short cut
+                                return index;
+                            }
+                            if (dist < bestDist && dist <= maxDistance) {
+                                bestDist = dist;
+                                bestIndex = index;
+                            }
+                        }
+                    }
+                }
+            }
+            return bestIndex;
+        }
+    ]
+
+    for (const search of searches) {
+        const index = search();
+        if (index >= 0) {
+            return index;
+        }
+    }
+
+    return -1;
+}
+
+/**
+ * Returns the best matching input element identified by the given label candidates.
+ * If the label is found, the input element should be either a child of that label or the attribute for and id should be used.
+ * If no such input element is found, the input element of the given type is found by position.
+ * If nothing is found, undefined is returned.
+ * 
+ * @param labelCandidates The label candidates in order of priority
+ * @param typeHints The type (and tag) hints in order of priority, e.g. text, password, or textarea (or select, if findSelectAsWell is true)
+ * @param positionHint The position hint, e.g. 0 for first, 1 for second, etc.; 
+ *      -1 is default and means, the position hint is ignored and the first match
+ *      (if label is not found) according to the type hint is used. 
+ *      The position is always counting all input elements without regard to the type.
+ * @package findSelectAsWell If true, select elements are also considered; otherwise, only input and textarea elements are considered
+ */
+export async function getInputElementByLabel(driver: WebDriver, labelCandidates: string[], typeHints: string[], positionHint = -1, findSelectAsWell = false) {
+    const tagsToFind = ["input", "textarea"];
+    if (findSelectAsWell) {
+        tagsToFind.push("select");
+    }
+    try {
+        const weLabels = await getElementsByTag(driver, "label");
+        if (weLabels.length >= 1) {
+            const txtLabels: string[] = [];
+            for (const weLabel of weLabels) {
+                try {
+                    const text = await weLabel.getText();
+                    txtLabels.push(text);
+                } catch (error) {
+                    txtLabels.push("");
+                }
+            }
+            const idxCandidate = findBestMatchingIndex(txtLabels, labelCandidates);
+            if (idxCandidate >= 0) {
+                // field is child of label
+                try {
+                    const inputFields = await getElementsByTags(weLabels[idxCandidate], tagsToFind);
+                    if (inputFields.length > 0) {
+                        return inputFields[0];
+                    }
+                } catch (error) {
+                    // expected
+                }
+
+                // for and id is used:
+                const forAttribute = (await weLabels[idxCandidate].getAttribute("for")) || "";
+                if (forAttribute !== "") {
+                    const inputFields = await getElementsByTags(driver, tagsToFind);
+                    for (const webElement of inputFields) {
+                        const id = await webElement.getAttribute("id");
+                        if (id === forAttribute) {
+                            return webElement;
+                        }
+                    }
+                }
+            }
+        }
+
+        // try to find input field by type
+        const inputFields = await getElementsByTags(driver, tagsToFind);
+        if (inputFields.length >= 1) {
+            let pos = 0;
+            for (const webElement of inputFields) {
+                const type = (await webElement.getAttribute("type"))?.toLowerCase();
+                const tag = (await webElement.getTagName()).toLowerCase();
+                if (typeHints.includes(type) || typeHints.includes(tag)) {
+                    if (pos >= positionHint) {
+                        return webElement;
+                    }
+                }
+                pos++;
+            }
+        }
+    } catch (error) {
+        console.log("Error in getInputElementByLabel", error);
+    }
+    return undefined;
+}
+
+// from https://github.com/tj/commander.js/blob/master/lib/suggestSimilar.js
+
+
+function editDistance(a: string, b: string, maxDistance: number) {
+    // https://en.wikipedia.org/wiki/Damerau–Levenshtein_distance
+    // Calculating optimal string alignment distance, no substring is edited more than once.
+    // (Simple implementation.)
+
+    // Quick early exit, return worst case.
+    if (Math.abs(a.length - b.length) > maxDistance) return Math.max(a.length, b.length);
+
+    // distance between prefix substrings of a and b
+    const d = [];
+
+    // pure deletions turn a into empty string
+    for (let i = 0; i <= a.length; i++) {
+        d[i] = [i];
+    }
+    // pure insertions turn empty string into b
+    for (let j = 0; j <= b.length; j++) {
+        d[0][j] = j;
+    }
+
+    // fill matrix
+    for (let j = 1; j <= b.length; j++) {
+        for (let i = 1; i <= a.length; i++) {
+            let cost = 1;
+            if (a[i - 1] === b[j - 1]) {
+                cost = 0;
+            } else {
+                cost = 1;
+            }
+            d[i][j] = Math.min(
+                d[i - 1][j] + 1, // deletion
+                d[i][j - 1] + 1, // insertion
+                d[i - 1][j - 1] + cost // substitution
+            );
+            // transposition
+            if (i > 1 && j > 1 && a[i - 1] === b[j - 2] && a[i - 2] === b[j - 1]) {
+                d[i][j] = Math.min(d[i][j], d[i - 2][j - 2] + 1);
+            }
+        }
+    }
+
+    return d[a.length][b.length];
+}