playwright-fluent/lib/actions/handle-actions/is-handle-visible/tests/is-handle-visible.chromium.test.js

Fluent API around playwright

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const tslib_1 = require("tslib");
const path = tslib_1.__importStar(require("path"));
const playwright_1 = require("playwright");
const SUT = tslib_1.__importStar(require("../index"));
const is_handle_visible_1 = require("../is-handle-visible");
const utils_1 = require("../../../../utils");
describe('handle is visible', () => {
    let browser = undefined;
    // eslint-disable-next-line @typescript-eslint/no-empty-function
    beforeEach(() => { });
    afterEach(async () => {
        if (browser) {
            await browser.close();
        }
    });
    test('should return false when selector is hidden - chromium', async () => {
        // Given
        browser = await playwright_1.chromium.launch({ headless: true });
        const browserContext = await browser.newContext({ viewport: null });
        const page = await browserContext.newPage();
        const url = `file:${path.join(__dirname, 'is-handle-visible.test.html')}`;
        await page.goto(url);
        await (0, utils_1.sleep)(1000);
        const handle = await page.$('#hidden');
        // When
        const result = await SUT.isHandleVisible(handle, is_handle_visible_1.defaultVerboseOptions);
        // Then
        expect(handle).toBeDefined();
        expect(result).toBe(false);
    });
    test('should return true when selector is visible in the current viewport', async () => {
        // Given
        browser = await playwright_1.chromium.launch({ headless: true });
        const browserContext = await browser.newContext({ viewport: null });
        const page = await browserContext.newPage();
        const url = `file:${path.join(__dirname, 'is-handle-visible.test.html')}`;
        await page.goto(url);
        await (0, utils_1.sleep)(1000);
        const handle = await page.$('#visible');
        // When
        const result = await SUT.isHandleVisible(handle, is_handle_visible_1.defaultVerboseOptions);
        // Then
        expect(handle).toBeDefined();
        expect(result).toBe(true);
    });
    test('should return false when selector is transparent', async () => {
        // Given
        browser = await playwright_1.chromium.launch({ headless: true });
        const browserContext = await browser.newContext({ viewport: null });
        const page = await browserContext.newPage();
        const url = `file:${path.join(__dirname, 'is-handle-visible.test.html')}`;
        await page.goto(url);
        await (0, utils_1.sleep)(1000);
        const handle = await page.$('#transparent');
        // When
        const result = await SUT.isHandleVisible(handle, is_handle_visible_1.defaultVerboseOptions);
        // Then
        expect(handle).toBeDefined();
        expect(result).toBe(false);
    });
    test('should return false when selector is out of screen', async () => {
        // Given
        browser = await playwright_1.chromium.launch({ headless: true });
        const browserContext = await browser.newContext({ viewport: null });
        const page = await browserContext.newPage();
        const url = `file:${path.join(__dirname, 'is-handle-visible.test.html')}`;
        await page.goto(url);
        await (0, utils_1.sleep)(1000);
        const handle = await page.$('#out-of-screen');
        // When
        const result = await SUT.isHandleVisible(handle, is_handle_visible_1.defaultVerboseOptions);
        // Then
        expect(handle).toBeDefined();
        expect(result).toBe(false);
    });
    test('should return true when selector is visible but out of viewport', async () => {
        // Given
        browser = await playwright_1.chromium.launch({ headless: true });
        const browserContext = await browser.newContext({ viewport: null });
        const page = await browserContext.newPage();
        const url = `file:${path.join(__dirname, 'is-handle-visible.test.html')}`;
        await page.goto(url);
        await (0, utils_1.sleep)(1000);
        const handle = await page.$('#out-of-viewport');
        // When
        const result = await SUT.isHandleVisible(handle, is_handle_visible_1.defaultVerboseOptions);
        // Then
        expect(handle).toBeDefined();
        expect(result).toBe(true);
    });
    test('should return false when selector is visible then removed from DOM', async () => {
        // Given
        browser = await playwright_1.chromium.launch({ headless: true });
        const browserContext = await browser.newContext({ viewport: null });
        const page = await browserContext.newPage();
        const url = `file:${path.join(__dirname, 'is-handle-visible.test.html')}`;
        await page.goto(url);
        await (0, utils_1.sleep)(1000);
        const handle = await page.$('#visible-then-removed');
        // When
        const result = await SUT.isHandleVisible(handle, is_handle_visible_1.defaultVerboseOptions);
        // Then
        expect(handle).toBeDefined();
        expect(result).toBe(true);
        // When selector is removed from DOM
        await (0, utils_1.waitUntil)(async () => !(await SUT.isHandleVisible(handle, is_handle_visible_1.defaultVerboseOptions)), 'yo', {
            stabilityInMilliseconds: 0,
            throwOnTimeout: false,
            timeoutInMilliseconds: 6000,
            verbose: false,
            wrapPredicateExecutionInsideTryCatch: false,
        });
        const resultWhenRemovedFromDom = await SUT.isHandleVisible(handle, is_handle_visible_1.defaultVerboseOptions);
        // Then
        expect(resultWhenRemovedFromDom).toBe(false);
    });
});