Untitled

import test, { expect, Page } from '@playwright/test';
import BaseUiComponent, { ElementAttributes } from './baseui.component';

interface ButtonElementAttributes extends ElementAttributes {
    form?: string;
}

/**
 * Button component.
 */
export default class ButtonComponent extends BaseUiComponent {
    /**
     * ButtonComponent constructor.
     * @param { Page } page playwright instance
     * @param { ElementAttributes } attributes element attributes
     */
    constructor(page: Page, attributes: ButtonElementAttributes) {
        super(page, attributes);
        if (typeof this.locBase === 'undefined') {
            this.locBase = this.page.getByRole('button');
        }
        if (attributes.form) this.locBase = this.page.locator(`[form=${attributes.form}]`);
        if (attributes.text && typeof this.locBase !== 'undefined') {
            this.locBase = this.locBase.filter({ hasText: attributes.text });
        }
    }

    /**
     * Clicks button.
     * @param { boolean } force whether to force click the button
     */
    async click(force: boolean = false) {
        await this.locBase.click({ force: force });
    }

    /**
     * First checks if button is visible and then clicks it.
     */
    async clickIfVisible() {
        await test.step('checks if button is visible and then clicks it', async () => {
            (await this.locBase.isVisible()) && (await this.locBase.click());
        });
    }

    /**
     * Gets button text.
     * @returns { Promise<string|null> } button text
     */
    async getText(): Promise<string | null> {
        return this.locBase.textContent();
    }

    /**
     * Checks button visibility.
     * @param { boolean } isVisible button visibility.
     */
    async checkVisibility(isVisible: boolean) {
        await test.step('checks button visibility', async () => {
            await expect(this.locBase).toBeVisible({ visible: isVisible });
        });
    }

    /**
     * Hovers and clicks button
     */
    async hoverAndClick() {
        await test.step('hover and click button', async () => {
            await this.locBase.hover();
            await this.locBase.click();
        });
    }
}