@cloudscape-design/browser-test-tools 3.0.82 → 3.0.84

package/browser-scripts/scroll.d.ts

@@ -2,9 +2,10 @@ export interface ScrollPosition {
     top: number;
     left: number;
 }
-export declare function scrollToBottom(selector: string): void;
-export declare function scrollToRight(selector: string): void;
-export declare function elementScrollTo(selector: string, top: number, left: number): void;
+export declare function scrollAction(action: 'scrollToOffset' | 'scrollToRight' | 'scrollToBottom', selector: string, offset?: {
+    top: number;
+    left: number;
+}): void;
 export declare function getElementScrollPosition(selector: string): ScrollPosition;
 export declare function windowScrollTo(top: number, left: number): void;
 export declare function getWindowScrollPosition(): ScrollPosition;

package/browser-scripts/scroll.js

@@ -1,39 +1,53 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.scrollToBottom = scrollToBottom;
-exports.scrollToRight = scrollToRight;
-exports.elementScrollTo = elementScrollTo;
+exports.scrollAction = scrollAction;
 exports.getElementScrollPosition = getElementScrollPosition;
 exports.windowScrollTo = windowScrollTo;
 exports.getWindowScrollPosition = getWindowScrollPosition;
-function scrollToBottom(selector) {
-    var element = document.querySelector(selector);
+function scrollAction(action, selector, offset) {
+    const element = document.querySelector(selector);
     if (!element) {
         throw new Error('Element ' + selector + ' has not been found at the page');
     }
-    element.scrollTop = element.scrollHeight;
-}
-function scrollToRight(selector) {
-    var element = document.querySelector(selector);
-    if (!element) {
-        throw new Error('Element ' + selector + ' has not been found at the page');
+    const overflowDirection = action === 'scrollToOffset' ? 'overflow' : action === 'scrollToBottom' ? 'overflowY' : 'overflowX';
+    const overflowStyles = getComputedStyle(element)[overflowDirection].split(' ');
+    if (!overflowStyles.includes('auto') && !overflowStyles.includes('scroll') && element !== document.documentElement) {
+        throw new Error(`Element ${selector} is not scrollable`);
     }
-    element.scrollLeft = element.scrollWidth;
-}
-function elementScrollTo(selector, top, left) {
-    var element = document.querySelector(selector);
-    if (!element) {
-        throw new Error('Element ' + selector + ' has not been found at the page');
+    if (overflowStyles.length === 2 && offset) {
+        const hasErrorScrollX = !['auto', 'scroll'].includes(overflowStyles[0]) && offset.left > 0;
+        const hasErrorScrollY = !['auto', 'scroll'].includes(overflowStyles[1]) && offset.top > 0;
+        if (hasErrorScrollX || hasErrorScrollY) {
+            throw new Error(`Element ${selector} is not scrollable in ${hasErrorScrollX ? 'left' : 'top'} direction`);
+        }
+    }
+    switch (action) {
+        case 'scrollToOffset':
+            if (!offset) {
+                throw new Error('Cannot scroll to offset without an offset');
+            }
+            element.scrollTop = offset.top;
+            element.scrollLeft = offset.left;
+            break;
+        case 'scrollToBottom':
+            element.scrollTop = element.scrollHeight;
+            break;
+        case 'scrollToRight':
+            element.scrollLeft = element.scrollWidth;
+            break;
+        default:
+            throw new Error(`Unsupported scroll action ${action}`);
     }
-    element.scrollTop = top;
-    element.scrollLeft = left;
 }
 function getElementScrollPosition(selector) {
-    var element = document.querySelector(selector);
+    const element = document.querySelector(selector);
     if (!element) {
-        // We cannnot use our custom error types as they are not available inside the browser context
         throw new Error('Element ' + selector + ' has not been found at the page');
     }
+    const overflowStyles = getComputedStyle(element).overflow.split(' ');
+    if (!overflowStyles.includes('auto') && !overflowStyles.includes('scroll')) {
+        throw new Error('Element ' + selector + ' is not scrollable');
+    }
     return { top: element.scrollTop, left: element.scrollLeft };
 }
 function windowScrollTo(top, left) {

package/internal/manifest.json

@@ -1,3 +1,3 @@
 {
-  "commit": "2fd905e0e2858655ee300f57394dfc2511dcbc1d"
+  "commit": "a96c1a1a731d3cee17a8709afb89e5ad982a5ebf"
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cloudscape-design/browser-test-tools",
-  "version": "3.0.82",
+  "version": "3.0.84",
   "repository": {
     "type": "git",
     "url": "https://github.com/cloudscape-design/browser-test-tools.git"
@@ -38,7 +38,7 @@
     "@types/wait-on": "^5.3.4",
     "@typescript-eslint/eslint-plugin": "^5.41.0",
     "@typescript-eslint/parser": "^5.41.0",
-    "@vitest/coverage-istanbul": "^3.0.6",
+    "@vitest/coverage-istanbul": "^3.0.7",
     "eslint": "^8.26.0",
     "eslint-config-prettier": "^8.5.0",
     "eslint-plugin-header": "^3.1.1",
@@ -50,7 +50,7 @@
     "npm-run-all": "^4.1.5",
     "prettier": "^2.7.1",
     "typescript": "^5.7.3",
-    "vitest": "^3.0.6"
+    "vitest": "^3.0.7"
   },
   "exports": {
     "./chrome-launcher": "./chrome-launcher.js",

package/page-objects/base.d.ts

@@ -25,6 +25,7 @@ export default class BasePageObject {
     getElementScroll(selector: string): Promise<ScrollPosition>;
     elementScrollTo(selector: string, { top, left }: Partial<ScrollPosition>): Promise<void>;
     waitForVisible(selector: string, shouldDisplay?: boolean, timeout?: number): Promise<void>;
+    waitForExist(selector: string, shouldExist?: boolean, timeout?: number): Promise<true>;
     waitForAssertion(expression: () => Promise<void>): Promise<void>;
     waitForJsTimers(timeout?: number): Promise<void>;
     isFocused(selector: string): Promise<boolean>;

package/page-objects/base.js

@@ -135,7 +135,7 @@ class BasePageObject {
         return this.browser.execute(browser_scripts_1.getElementScrollPosition, selector);
     }
     async elementScrollTo(selector, { top = 0, left = 0 }) {
-        await this.browser.execute(browser_scripts_1.elementScrollTo, selector, top, left);
+        await this.browser.execute(browser_scripts_1.scrollAction, 'scrollToOffset', selector, { top, left });
     }
     async waitForVisible(selector, shouldDisplay = true, timeout) {
         await this.browser.waitUntil(async () => {
@@ -148,6 +148,15 @@ class BasePageObject {
                 : `Element "${selector}" is still visible after waiting`,
         });
     }
+    waitForExist(selector, shouldExist = true, timeout) {
+        return this.browser.$(selector).waitForExist({
+            reverse: !shouldExist,
+            timeout,
+            timeoutMsg: shouldExist
+                ? `Element "${selector}" is not existing upon waiting`
+                : `Element "${selector}" is still existing after waiting`,
+        });
+    }
     async waitForAssertion(expression) {
         const retryOptions = { minTimeout: 100, retries: 5 };
         await (0, p_retry_1.default)(expression, retryOptions);

package/page-objects/screenshot.js

@@ -18,10 +18,10 @@ class ScreenshotPageObject extends base_1.default {
         return this.keys('Tab');
     }
     async scrollToBottom(selector) {
-        await this.browser.execute(browser_scripts_1.scrollToBottom, selector);
+        await this.browser.execute(browser_scripts_1.scrollAction, 'scrollToBottom', selector);
     }
     async scrollToRight(selector) {
-        await this.browser.execute(browser_scripts_1.scrollToRight, selector);
+        await this.browser.execute(browser_scripts_1.scrollAction, 'scrollToRight', selector);
     }
     async fullPageScreenshot() {
         // preserve scroll position in order to avoid side effects after screenshot taking