askui 0.6.1 → 0.7.1

package/dist/cjs/execution/dsl.js

@@ -641,6 +641,11 @@ class FluentFilters extends FluentBase {
     /**
      * Filters for an UI element 'button'.
      *
+     * **Examples:**
+     * ```typescript
+     * await aui.moveMouseTo().button().exec()
+     * ```
+     *
      * @return {FluentFiltersOrRelations}
      */
     button() {
@@ -714,8 +719,17 @@ class FluentFilters extends FluentBase {
      * ```typescript
      * 'text' === withText('text') => true
      * 'test' === withText('text') => true
+     * 'Test' === withText('text') => true
+     * 'Text' === withText('text') => true
+     * 'TEXT' === withText('text') => true
+     * 'texst' === withText('text') => true
+     * 'texts' === withText('text') => true
+     *
+     * // usually false
+     * 'atebxtc' === withText('text') => false
      * 'other' === withText('text') => false
      * ```
+     * ![](https://docs.askui.com/img/gif/withText.gif)
      *
      * @param {string} text - A text to be matched.
      *
@@ -734,9 +748,11 @@ class FluentFilters extends FluentBase {
      * 'The rain in Spain' === withTextRegex('\b[Ss]\w+') => true
      * 'The rain in Portugal' === withTextRegex('\b[Ss]\w+') => false
      * 'The rain in switzerland' === withTextRegex('\b[Ss]\w+') => true
+     *
+     * await aui.get().text().withTextRegex('\b[Ss]\w+').exec()
      * ```
      *
-     * @param {string} regex_pattern - An regex pattern
+     * @param {string} regex_pattern - A regex pattern
      *
      * @return {FluentFiltersOrRelations}
      */
@@ -756,6 +772,8 @@ class FluentFilters extends FluentBase {
      * 'text' === withExactText('text') => true
      * 'test' === withExactText('text') => false
      * 'other' === withExactText('text') => false
+     *
+     * await aui.moveMouseTo().text().withExactText('Password').exec()
      * ```
      *
      * @param {string} text - A text to be matched.
@@ -775,6 +793,7 @@ class FluentFilters extends FluentBase {
      * 'This is an text' === containsText('other text') => false
      * 'This is an text' === containsText('other') => false
      * ```
+     * ![](https://docs.askui.com/img/gif/containsText.gif)
      *
      * @param {string} text - A text to be matched.
      *
@@ -784,17 +803,6 @@ class FluentFilters extends FluentBase {
         this._textStr = `contain text ${Separators.STRING}${text}${Separators.STRING}`;
         return new FluentFiltersOrRelations(this);
     }
-    /**
-     * Filters for elements having a specific color.
-     *
-     * @param {COLOR} color - A color to match
-     *
-     * @return {FluentFiltersOrRelations}
-     */
-    colored(color) {
-        this._textStr = `with color ${color}`;
-        return new FluentFiltersOrRelations(this);
-    }
 }
 exports.FluentFilters = FluentFilters;
 // Relations
@@ -827,7 +835,6 @@ class FluentFiltersOrRelations extends FluentFilters {
      *   DetectedElement {
      *      name: 'BUTTON',
      *      text: 'button',
-     *      colors: [ 'red', 'black', 'red' ],
      *      bndbox: BoundingBox {
      *         xmin: 900,
      *         ymin: 910,
@@ -850,21 +857,19 @@ class FluentFiltersOrRelations extends FluentFilters {
      * **Examples:**
      * ```text
      * example scene:
-     *  --------------------------   --------------------------
-     *  |  icon user colored black | |  icon  user colored red |
-     *  --------------------------   --------------------------
-     * ```
+     *  ---------------   ----------------
+     *  |  icon user  |   |  icon search |
+     *  ---------------   ---------------n```
      * ```typescript
-     * const icons = await aui.get().icon().withText('user').exec();
+     * const icons = await aui.get().icon().exec();
      * console.log(icons);
      * ```
-     * Using only the filter withText, the get command will return both icons because they share the same text
+     * Using only the filter icon, the get command will return both icons
      * ```text
      * console output: [
      *   DetectedElement {
      *      name: 'ICON',
      *      text: 'user',
-     *      colors: [ 'black', 'black', 'black' ],
      *      bndbox: BoundingBox {
      *         xmin: 1000,
      *         ymin: 1010,
@@ -874,8 +879,7 @@ class FluentFiltersOrRelations extends FluentFilters {
      *   },
      *   DetectedElement {
      *      name: 'ICON',
-     *      text: 'user',
-     *      colors: [ 'red', 'red', 'red' ],
+     *      text: 'search',
      *      bndbox: BoundingBox {
      *         xmin: 900,
      *         ymin: 910,
@@ -887,16 +891,15 @@ class FluentFiltersOrRelations extends FluentFilters {
      * ```
      * You can combine filters with **the `and()` relation** and specify exactly which icon you want
      * ```typescript
-     * const icons = await aui.get().icon().withText('user').and().colored('red').exec()
+     * const icons = await aui.get().icon().and().withText('user').exec()
      * console.log(icons)
      * ```
-     * The get command returns only the red icon although both icons have the same text
+     * The get command returns only the user icon although both elements are icons
      * ```text
      *  console output: [
      *   DetectedElement {
      *      name: 'ICON',
      *      text: 'user',
-     *      colors: [ 'red', 'red', 'red' ],
      *      bndbox: BoundingBox {
      *         xmin: 900,
      *         ymin: 910,
@@ -931,6 +934,7 @@ class FluentFiltersOrRelations extends FluentFilters {
      * // Returns nothing because innerEl is not inside outerEl
      * ...outerEl().in().innerEl()
      * ```
+     * ![](https://docs.askui.com/img/gif/in.gif)
      *
      * @return {FluentFilters}
      */
@@ -952,6 +956,7 @@ class FluentFiltersOrRelations extends FluentFilters {
      * // Returns no element because leftEl is left of rightEl
      * ...leftEl().rightOf().rightEl()
      * ```
+     * ![](https://docs.askui.com/img/gif/rightOf.gif)
      *
      * @return {FluentFilters}
      */
@@ -973,6 +978,7 @@ class FluentFiltersOrRelations extends FluentFilters {
      * // Returns no element because rightEl is left of leftEl
      * ...rightEl().leftOf().leftEl()
      * ```
+     * ![](https://docs.askui.com/img/gif/leftOf.gif)
      *
      * @return {FluentFilters}
      */
@@ -997,6 +1003,7 @@ class FluentFiltersOrRelations extends FluentFilters {
      * // Returns no element because text is above button
      * ...text().below().button()
      * ```
+     * ![](https://docs.askui.com/img/gif/below.gif)
      *
      * @return {FluentFilters}
      */
@@ -1021,6 +1028,7 @@ class FluentFiltersOrRelations extends FluentFilters {
      * // Returns no element because button is below text
      * ...button().above().text()
      * ```
+     * ![](https://docs.askui.com/img/gif/above.gif)
      *
      * @return {FluentFilters}
      */
@@ -1049,6 +1057,7 @@ class FluentFiltersOrRelations extends FluentFilters {
      * // Returns button 1 because button 1 is nearer to the text than button 2
      * ...button().nearestTo().text()
      * ```
+     * ![](https://docs.askui.com/img/gif/nearestTo.gif)
      *
      * @return {FluentFilters}
      */
@@ -1074,6 +1083,7 @@ class FluentFiltersOrRelations extends FluentFilters {
      * //  Returns no element because innerEl contains no outerEl
      * ...innerEl().contains().outerEl()
      * ```
+     * ![](https://docs.askui.com/img/gif/contains.gif)
      *
      * @return {FluentFilters}
      */
@@ -1667,6 +1677,11 @@ class FluentFiltersCondition extends FluentBase {
     /**
      * Filters for an UI element 'button'.
      *
+     * **Examples:**
+     * ```typescript
+     * await aui.moveMouseTo().button().exec()
+     * ```
+     *
      * @return {FluentFiltersOrRelationsCondition}
      */
     button() {
@@ -1740,8 +1755,17 @@ class FluentFiltersCondition extends FluentBase {
      * ```typescript
      * 'text' === withText('text') => true
      * 'test' === withText('text') => true
+     * 'Test' === withText('text') => true
+     * 'Text' === withText('text') => true
+     * 'TEXT' === withText('text') => true
+     * 'texst' === withText('text') => true
+     * 'texts' === withText('text') => true
+     *
+     * // usually false
+     * 'atebxtc' === withText('text') => false
      * 'other' === withText('text') => false
      * ```
+     * ![](https://docs.askui.com/img/gif/withText.gif)
      *
      * @param {string} text - A text to be matched.
      *
@@ -1760,9 +1784,11 @@ class FluentFiltersCondition extends FluentBase {
      * 'The rain in Spain' === withTextRegex('\b[Ss]\w+') => true
      * 'The rain in Portugal' === withTextRegex('\b[Ss]\w+') => false
      * 'The rain in switzerland' === withTextRegex('\b[Ss]\w+') => true
+     *
+     * await aui.get().text().withTextRegex('\b[Ss]\w+').exec()
      * ```
      *
-     * @param {string} regex_pattern - An regex pattern
+     * @param {string} regex_pattern - A regex pattern
      *
      * @return {FluentFiltersOrRelationsCondition}
      */
@@ -1782,6 +1808,8 @@ class FluentFiltersCondition extends FluentBase {
      * 'text' === withExactText('text') => true
      * 'test' === withExactText('text') => false
      * 'other' === withExactText('text') => false
+     *
+     * await aui.moveMouseTo().text().withExactText('Password').exec()
      * ```
      *
      * @param {string} text - A text to be matched.
@@ -1801,6 +1829,7 @@ class FluentFiltersCondition extends FluentBase {
      * 'This is an text' === containsText('other text') => false
      * 'This is an text' === containsText('other') => false
      * ```
+     * ![](https://docs.askui.com/img/gif/containsText.gif)
      *
      * @param {string} text - A text to be matched.
      *
@@ -1810,17 +1839,6 @@ class FluentFiltersCondition extends FluentBase {
         this._textStr = `contain text ${Separators.STRING}${text}${Separators.STRING}`;
         return new FluentFiltersOrRelationsCondition(this);
     }
-    /**
-     * Filters for elements having a specific color.
-     *
-     * @param {COLOR} color - A color to match
-     *
-     * @return {FluentFiltersOrRelationsCondition}
-     */
-    colored(color) {
-        this._textStr = `with color ${color}`;
-        return new FluentFiltersOrRelationsCondition(this);
-    }
 }
 exports.FluentFiltersCondition = FluentFiltersCondition;
 // Relations
@@ -1853,7 +1871,6 @@ class FluentFiltersOrRelationsCondition extends FluentFiltersCondition {
      *   DetectedElement {
      *      name: 'BUTTON',
      *      text: 'button',
-     *      colors: [ 'red', 'black', 'red' ],
      *      bndbox: BoundingBox {
      *         xmin: 900,
      *         ymin: 910,
@@ -1876,21 +1893,19 @@ class FluentFiltersOrRelationsCondition extends FluentFiltersCondition {
      * **Examples:**
      * ```text
      * example scene:
-     *  --------------------------   --------------------------
-     *  |  icon user colored black | |  icon  user colored red |
-     *  --------------------------   --------------------------
-     * ```
+     *  ---------------   ----------------
+     *  |  icon user  |   |  icon search |
+     *  ---------------   ---------------n```
      * ```typescript
-     * const icons = await aui.get().icon().withText('user').exec();
+     * const icons = await aui.get().icon().exec();
      * console.log(icons);
      * ```
-     * Using only the filter withText, the get command will return both icons because they share the same text
+     * Using only the filter icon, the get command will return both icons
      * ```text
      * console output: [
      *   DetectedElement {
      *      name: 'ICON',
      *      text: 'user',
-     *      colors: [ 'black', 'black', 'black' ],
      *      bndbox: BoundingBox {
      *         xmin: 1000,
      *         ymin: 1010,
@@ -1900,8 +1915,7 @@ class FluentFiltersOrRelationsCondition extends FluentFiltersCondition {
      *   },
      *   DetectedElement {
      *      name: 'ICON',
-     *      text: 'user',
-     *      colors: [ 'red', 'red', 'red' ],
+     *      text: 'search',
      *      bndbox: BoundingBox {
      *         xmin: 900,
      *         ymin: 910,
@@ -1913,16 +1927,15 @@ class FluentFiltersOrRelationsCondition extends FluentFiltersCondition {
      * ```
      * You can combine filters with **the `and()` relation** and specify exactly which icon you want
      * ```typescript
-     * const icons = await aui.get().icon().withText('user').and().colored('red').exec()
+     * const icons = await aui.get().icon().and().withText('user').exec()
      * console.log(icons)
      * ```
-     * The get command returns only the red icon although both icons have the same text
+     * The get command returns only the user icon although both elements are icons
      * ```text
      *  console output: [
      *   DetectedElement {
      *      name: 'ICON',
      *      text: 'user',
-     *      colors: [ 'red', 'red', 'red' ],
      *      bndbox: BoundingBox {
      *         xmin: 900,
      *         ymin: 910,
@@ -1957,6 +1970,7 @@ class FluentFiltersOrRelationsCondition extends FluentFiltersCondition {
      * // Returns nothing because innerEl is not inside outerEl
      * ...outerEl().in().innerEl()
      * ```
+     * ![](https://docs.askui.com/img/gif/in.gif)
      *
      * @return {FluentFiltersCondition}
      */
@@ -1978,6 +1992,7 @@ class FluentFiltersOrRelationsCondition extends FluentFiltersCondition {
      * // Returns no element because leftEl is left of rightEl
      * ...leftEl().rightOf().rightEl()
      * ```
+     * ![](https://docs.askui.com/img/gif/rightOf.gif)
      *
      * @return {FluentFiltersCondition}
      */
@@ -1999,6 +2014,7 @@ class FluentFiltersOrRelationsCondition extends FluentFiltersCondition {
      * // Returns no element because rightEl is left of leftEl
      * ...rightEl().leftOf().leftEl()
      * ```
+     * ![](https://docs.askui.com/img/gif/leftOf.gif)
      *
      * @return {FluentFiltersCondition}
      */
@@ -2023,6 +2039,7 @@ class FluentFiltersOrRelationsCondition extends FluentFiltersCondition {
      * // Returns no element because text is above button
      * ...text().below().button()
      * ```
+     * ![](https://docs.askui.com/img/gif/below.gif)
      *
      * @return {FluentFiltersCondition}
      */
@@ -2047,6 +2064,7 @@ class FluentFiltersOrRelationsCondition extends FluentFiltersCondition {
      * // Returns no element because button is below text
      * ...button().above().text()
      * ```
+     * ![](https://docs.askui.com/img/gif/above.gif)
      *
      * @return {FluentFiltersCondition}
      */
@@ -2075,6 +2093,7 @@ class FluentFiltersOrRelationsCondition extends FluentFiltersCondition {
      * // Returns button 1 because button 1 is nearer to the text than button 2
      * ...button().nearestTo().text()
      * ```
+     * ![](https://docs.askui.com/img/gif/nearestTo.gif)
      *
      * @return {FluentFiltersCondition}
      */
@@ -2100,6 +2119,7 @@ class FluentFiltersOrRelationsCondition extends FluentFiltersCondition {
      * //  Returns no element because innerEl contains no outerEl
      * ...innerEl().contains().outerEl()
      * ```
+     * ![](https://docs.askui.com/img/gif/contains.gif)
      *
      * @return {FluentFiltersCondition}
      */
@@ -2110,6 +2130,11 @@ class FluentFiltersOrRelationsCondition extends FluentFiltersCondition {
     /**
      * Expects that filtered element exists.
      *
+     * **Examples:**
+     * ```typescript
+     * await aui.expect().text().withText('Login').exists().exec()
+     * ```
+     *
      * @return {ExecCondition}
      */
     exists() {
@@ -2119,6 +2144,11 @@ class FluentFiltersOrRelationsCondition extends FluentFiltersCondition {
     /**
      * Expects that filtered element does not exist.
      *
+     * **Examples:**
+     * ```typescript
+     * await aui.expect().text().withText('Login').notExists().exec()
+     * ```
+     *
      * @return {ExecCondition}
      */
     notExists() {
@@ -2135,8 +2165,13 @@ class FluentCommand extends FluentBase {
         super(undefined);
     }
     /**
-     * Expects a condition, e.g., `exists()` or `notExits()`,
-     *  e.g., `...expect().text().withText('Login').exists()`.
+     * Expects a condition, e.g., `exists()` or `notExits()`.
+     *
+     * **Examples:**
+     * ```typescript
+     * await aui.expect().text().withText('Login').exists().exec()
+     * await aui.expect().text().withText('Login').notExists().exec()
+     * ```
      *
      * @return {FluentFiltersCondition}
      */
@@ -2147,6 +2182,11 @@ class FluentCommand extends FluentBase {
     /**
      * Clicks on the filtered element.
      *
+     * **Example:**
+     * ```typescript
+     * await aui.click().button().withText('Submit').exec()
+     * ```
+     *
      * @return {FluentFilters}
      */
     click() {
@@ -2156,6 +2196,11 @@ class FluentCommand extends FluentBase {
     /**
      * Move mouse over the filtered element.
      *
+     * **Example:**
+     * ```typescript
+     * await aui.moveMouseTo().button().withText('Submit').exec()
+     * ```
+     *
      * @return {FluentFilters}
      */
     moveMouseTo() {
@@ -2163,7 +2208,16 @@ class FluentCommand extends FluentBase {
         return new FluentFilters(this);
     }
     /**
-     * Types a text inside the filtered element.
+     * Puts the focus on the filtered element and types in the text.
+     *
+     * **Examples:**
+     * ```typescript
+     * await aui.typeIn('Type some text').textfield().exec()
+     *
+     * // mask the text so it is not send to the askui-inference server
+     * await aui.typeIn('Type some text', { isSecret: true, secretMask: '**' }).textfield().exec()
+     * ```
+     * ![](https://docs.askui.com/img/gif/typeIn.gif)
      *
      * @param {string} text - A text to type
      *
@@ -2176,6 +2230,13 @@ class FluentCommand extends FluentBase {
     /**
      * Moves mouse to the filtered element and scrolls in the x and y direction.
      *
+     * **macOS**: May not work as expected!
+     *
+     * **Example:**
+     * ```typescript
+     * await aui.scroll(0, 10).textarea().exec()
+     * ```
+     *
      * @param {number} x_offset - A (positive/negative) x direction.
      * @param {number} y_offset - A (positive/negative) y direction.
      *
@@ -2187,7 +2248,14 @@ class FluentCommand extends FluentBase {
     }
     /**
      * Moves the mouse relatively to an element in the direction.
-     * This can be used when the mouse should not hover over on an element anymore.
+     * This can be used when the mouse should not hover over an element anymore.
+     *
+     * **Examples:**
+     * ```typescript
+     * // Move mouse 30 pixels below button
+     * await aui.moveMouseRelativelyTo(0, 30).button().withText('Submit').exec()
+     * ```
+     * ![](https://docs.askui.com/img/gif/moveMouseRelativelyTo.gif)
      *
      * @param {number} x_offset - A (positive/negative) x direction.
      * @param {number} y_offset - A (positive/negative) y direction.
@@ -2199,10 +2267,19 @@ class FluentCommand extends FluentBase {
         return new FluentFilters(this);
     }
     /**
-     * Swipe an element in the x and y direction
+     * Swipe an element in the x and y direction.
+     * Holds the left mouse button down on Windows, Linux and macOS and drags the element.
+     * On touch devices it taps the element and then drags it.
      *
-     * @param {number} x_offset - A x direction. positive an negative values are accepted
-     * @param {number} y_offset - A y direction. positive an negative values are accepted
+     * **Example:**
+     * ```typescript
+     * // Swipe the element 500 to the right
+     * await aui.swipe(500, 0).image().exec()
+     * ```
+     * ![](https://docs.askui.com/img/gif/swipe.gif)
+     *
+     * @param {number} x_offset - A x direction. positive and negative values are accepted
+     * @param {number} y_offset - A y direction. positive and negative values are accepted
      *
      * @return {FluentFilters}
      */
@@ -2212,6 +2289,14 @@ class FluentCommand extends FluentBase {
     }
     /**
      * Types a text at the current position.
+     * If you need to focus the element first, use typeIn()
+     *
+     * **Examples:**
+     * ```typescript
+     * await aui.type('Type some text').exec()
+     *
+     * // mask the text so it is not send to the askui-inference serverawait aui.type('Type some text', { isSecret: true, secretMask: '**' }).exec()
+     * ```
      *
      * @param {string} text - A text to type
      *
@@ -2250,6 +2335,14 @@ class FluentCommand extends FluentBase {
      *
      * **Important**: Mouse must be positioned in a scrollable area.
      *
+     * **macOS**: May not work as expected!
+     *
+     * **Example:**
+     * ```typescript
+     * // Scroll 10 up in y direction
+     * await aui.scroll(0, 10).exec()
+     * ```
+     *
      * @param {number} x_offset - A (positive/negative) x direction.
      * @param {number} y_offset - A (positive/negative) y direction.
      *
@@ -2260,7 +2353,13 @@ class FluentCommand extends FluentBase {
         return new Exec(this);
     }
     /**
-     * Executes a shell command.
+     * Executes a shell command on the device.
+     *
+     * **Example:**
+     * ```typescript
+     * // Open the lastpass app
+     * await aui.execOnShell('monkey -p com.lastpass.authenticator 1').exec()
+     * ```
      *
      * @param {string} shell_command - A shell command which is executed.
      *
@@ -2325,7 +2424,7 @@ class FluentCommand extends FluentBase {
         return new Exec(this);
     }
     /**
-     * Toggles mouse down.
+     * Toggles mouse down (Left mouse key).
      *
      * @return {Exec}
      */
@@ -2334,7 +2433,7 @@ class FluentCommand extends FluentBase {
         return new Exec(this);
     }
     /**
-     * Toggles mouse up.
+     * Toggles mouse up (Left mouse key).
      *
      * @return {Exec}
      */
@@ -3003,6 +3102,11 @@ class FluentFiltersGetter extends FluentBase {
     /**
      * Filters for an UI element 'button'.
      *
+     * **Examples:**
+     * ```typescript
+     * await aui.moveMouseTo().button().exec()
+     * ```
+     *
      * @return {FluentFiltersOrRelationsGetter}
      */
     button() {
@@ -3076,8 +3180,17 @@ class FluentFiltersGetter extends FluentBase {
      * ```typescript
      * 'text' === withText('text') => true
      * 'test' === withText('text') => true
+     * 'Test' === withText('text') => true
+     * 'Text' === withText('text') => true
+     * 'TEXT' === withText('text') => true
+     * 'texst' === withText('text') => true
+     * 'texts' === withText('text') => true
+     *
+     * // usually false
+     * 'atebxtc' === withText('text') => false
      * 'other' === withText('text') => false
      * ```
+     * ![](https://docs.askui.com/img/gif/withText.gif)
      *
      * @param {string} text - A text to be matched.
      *
@@ -3096,9 +3209,11 @@ class FluentFiltersGetter extends FluentBase {
      * 'The rain in Spain' === withTextRegex('\b[Ss]\w+') => true
      * 'The rain in Portugal' === withTextRegex('\b[Ss]\w+') => false
      * 'The rain in switzerland' === withTextRegex('\b[Ss]\w+') => true
+     *
+     * await aui.get().text().withTextRegex('\b[Ss]\w+').exec()
      * ```
      *
-     * @param {string} regex_pattern - An regex pattern
+     * @param {string} regex_pattern - A regex pattern
      *
      * @return {FluentFiltersOrRelationsGetter}
      */
@@ -3118,6 +3233,8 @@ class FluentFiltersGetter extends FluentBase {
      * 'text' === withExactText('text') => true
      * 'test' === withExactText('text') => false
      * 'other' === withExactText('text') => false
+     *
+     * await aui.moveMouseTo().text().withExactText('Password').exec()
      * ```
      *
      * @param {string} text - A text to be matched.
@@ -3137,6 +3254,7 @@ class FluentFiltersGetter extends FluentBase {
      * 'This is an text' === containsText('other text') => false
      * 'This is an text' === containsText('other') => false
      * ```
+     * ![](https://docs.askui.com/img/gif/containsText.gif)
      *
      * @param {string} text - A text to be matched.
      *
@@ -3146,17 +3264,6 @@ class FluentFiltersGetter extends FluentBase {
         this._textStr = `contain text ${Separators.STRING}${text}${Separators.STRING}`;
         return new FluentFiltersOrRelationsGetter(this);
     }
-    /**
-     * Filters for elements having a specific color.
-     *
-     * @param {COLOR} color - A color to match
-     *
-     * @return {FluentFiltersOrRelationsGetter}
-     */
-    colored(color) {
-        this._textStr = `with color ${color}`;
-        return new FluentFiltersOrRelationsGetter(this);
-    }
 }
 exports.FluentFiltersGetter = FluentFiltersGetter;
 // Relations
@@ -3189,7 +3296,6 @@ class FluentFiltersOrRelationsGetter extends FluentFiltersGetter {
      *   DetectedElement {
      *      name: 'BUTTON',
      *      text: 'button',
-     *      colors: [ 'red', 'black', 'red' ],
      *      bndbox: BoundingBox {
      *         xmin: 900,
      *         ymin: 910,
@@ -3212,21 +3318,19 @@ class FluentFiltersOrRelationsGetter extends FluentFiltersGetter {
      * **Examples:**
      * ```text
      * example scene:
-     *  --------------------------   --------------------------
-     *  |  icon user colored black | |  icon  user colored red |
-     *  --------------------------   --------------------------
-     * ```
+     *  ---------------   ----------------
+     *  |  icon user  |   |  icon search |
+     *  ---------------   ---------------n```
      * ```typescript
-     * const icons = await aui.get().icon().withText('user').exec();
+     * const icons = await aui.get().icon().exec();
      * console.log(icons);
      * ```
-     * Using only the filter withText, the get command will return both icons because they share the same text
+     * Using only the filter icon, the get command will return both icons
      * ```text
      * console output: [
      *   DetectedElement {
      *      name: 'ICON',
      *      text: 'user',
-     *      colors: [ 'black', 'black', 'black' ],
      *      bndbox: BoundingBox {
      *         xmin: 1000,
      *         ymin: 1010,
@@ -3236,8 +3340,7 @@ class FluentFiltersOrRelationsGetter extends FluentFiltersGetter {
      *   },
      *   DetectedElement {
      *      name: 'ICON',
-     *      text: 'user',
-     *      colors: [ 'red', 'red', 'red' ],
+     *      text: 'search',
      *      bndbox: BoundingBox {
      *         xmin: 900,
      *         ymin: 910,
@@ -3249,16 +3352,15 @@ class FluentFiltersOrRelationsGetter extends FluentFiltersGetter {
      * ```
      * You can combine filters with **the `and()` relation** and specify exactly which icon you want
      * ```typescript
-     * const icons = await aui.get().icon().withText('user').and().colored('red').exec()
+     * const icons = await aui.get().icon().and().withText('user').exec()
      * console.log(icons)
      * ```
-     * The get command returns only the red icon although both icons have the same text
+     * The get command returns only the user icon although both elements are icons
      * ```text
      *  console output: [
      *   DetectedElement {
      *      name: 'ICON',
      *      text: 'user',
-     *      colors: [ 'red', 'red', 'red' ],
      *      bndbox: BoundingBox {
      *         xmin: 900,
      *         ymin: 910,
@@ -3293,6 +3395,7 @@ class FluentFiltersOrRelationsGetter extends FluentFiltersGetter {
      * // Returns nothing because innerEl is not inside outerEl
      * ...outerEl().in().innerEl()
      * ```
+     * ![](https://docs.askui.com/img/gif/in.gif)
      *
      * @return {FluentFiltersGetter}
      */
@@ -3314,6 +3417,7 @@ class FluentFiltersOrRelationsGetter extends FluentFiltersGetter {
      * // Returns no element because leftEl is left of rightEl
      * ...leftEl().rightOf().rightEl()
      * ```
+     * ![](https://docs.askui.com/img/gif/rightOf.gif)
      *
      * @return {FluentFiltersGetter}
      */
@@ -3335,6 +3439,7 @@ class FluentFiltersOrRelationsGetter extends FluentFiltersGetter {
      * // Returns no element because rightEl is left of leftEl
      * ...rightEl().leftOf().leftEl()
      * ```
+     * ![](https://docs.askui.com/img/gif/leftOf.gif)
      *
      * @return {FluentFiltersGetter}
      */
@@ -3359,6 +3464,7 @@ class FluentFiltersOrRelationsGetter extends FluentFiltersGetter {
      * // Returns no element because text is above button
      * ...text().below().button()
      * ```
+     * ![](https://docs.askui.com/img/gif/below.gif)
      *
      * @return {FluentFiltersGetter}
      */
@@ -3383,6 +3489,7 @@ class FluentFiltersOrRelationsGetter extends FluentFiltersGetter {
      * // Returns no element because button is below text
      * ...button().above().text()
      * ```
+     * ![](https://docs.askui.com/img/gif/above.gif)
      *
      * @return {FluentFiltersGetter}
      */
@@ -3411,6 +3518,7 @@ class FluentFiltersOrRelationsGetter extends FluentFiltersGetter {
      * // Returns button 1 because button 1 is nearer to the text than button 2
      * ...button().nearestTo().text()
      * ```
+     * ![](https://docs.askui.com/img/gif/nearestTo.gif)
      *
      * @return {FluentFiltersGetter}
      */
@@ -3436,6 +3544,7 @@ class FluentFiltersOrRelationsGetter extends FluentFiltersGetter {
      * //  Returns no element because innerEl contains no outerEl
      * ...innerEl().contains().outerEl()
      * ```
+     * ![](https://docs.askui.com/img/gif/contains.gif)
      *
      * @return {FluentFiltersGetter}
      */
@@ -3460,8 +3569,8 @@ class Getter extends FluentCommand {
      * A detected element has the following properties:
      * - `name` of the element
      * - `text` content of element
-     * - `colors` of element
      * - `bndbox`: location of element described with coordinates of a bounding box
+     *
      * **Examples:**
      * ```typescript
      * const text = await aui.get().text().withText('Sign').exec();
@@ -3472,7 +3581,6 @@ class Getter extends FluentCommand {
      *   DetectedElement {
      *      name: 'TEXT',
      *      text: 'Sign In',
-     *      colors: [ 'black', 'gray', 'gray' ],
      *      bndbox: BoundingBox {
      *         xmin: 1128.2720982142857,
      *         ymin: 160.21332310267857,
@@ -3494,8 +3602,8 @@ class Getter extends FluentCommand {
      * A detected element has the following properties:
      * - `name` of the element
      * - `text` content of element
-     * - `colors` of element
      * - `bndbox`: location of element described with coordinates of a bounding box
+     *
      * **Examples:**
      * ```typescript
      * const detectedElements = await aui.getAll().exec();
@@ -3506,7 +3614,6 @@ class Getter extends FluentCommand {
      *   DetectedElement {
      *      name: 'TEXT',
      *      text: 'Sign In',
-     *      colors: [ 'black', 'gray', 'gray' ],
      *      bndbox: BoundingBox {
      *         xmin: 1128.2720982142857,
      *         ymin: 160.21332310267857,
@@ -3516,7 +3623,6 @@ class Getter extends FluentCommand {
      *   DetectedElement {
      *      name: 'ICON',
      *      text: 'search',
-     *      colors: [ 'black', 'red', 'gray' ],
      *      bndbox: BoundingBox {
      *         xmin: 250.8204241071428,
      *         ymin: 300.21332310267857,