import { expect, test } from '../../../fixtures';
import { LoginPage } from '../../../pom/login.page';
import { MyCompanyPage } from '../../../pom/setting/my_company.page';
import { randomString } from '../../../utils/array';

test.describe('UI my company profile tests', async () => {
    let loginPage: LoginPage;
    let myCompanyPage: MyCompanyPage;

    test.beforeEach(async ({ page, conf }) => {
        loginPage = new LoginPage(page);
        myCompanyPage = new MyCompanyPage(page);

        await loginPage.open();
        await loginPage.login(conf.data.username, conf.data.password);
        await expect(loginPage.baseLoc.dashboardContainer).toBeVisible();
    });

    test('SETTING_001 - Verify UI my company profile', {
        tag: ['@SETTING_001', '@my_company', '@ui']
    }, async ({ conf }) => {

        await test.step('Click menu my company, verify các field', async () => {
            await myCompanyPage.open();
            await expect(myCompanyPage.myCompanyLoc.title).toBeVisible();

            // Verify screenshot
            await expect(myCompanyPage.page.locator('#root')).toMatchAriaSnapshot(`
              - heading "Detail" [level=2]
              - img
              - text: Name *
              - textbox "Name *": (Portal-Auto-Lawyer)
              - text: Phone Number
              - textbox "Phone Number": /\\(\\d+\\) \\d+-\\d+/
              - text: Email Address
              - textbox "Email Address"
              - text: Address
              - textbox "Address": /\\d+ Autotest-Lawyer/
              - text: Suite, unit, etc
              - textbox "Suite, unit, etc"
              - text: City
              - textbox "City": Dallas
              - text: State
              - textbox "State": Texas
              - text: Zip/Postal Code
              - textbox "Zip/Postal Code"
              - button "Update"
              `);
        });
    });
});

test.describe('Validation my company profile tests', async () => {
    let loginPage: LoginPage;
    let myCompanyPage: MyCompanyPage;

    test.beforeEach(async ({ page, conf }) => {
        loginPage = new LoginPage(page);
        myCompanyPage = new MyCompanyPage(page);

        await loginPage.open();
        await loginPage.login(conf.data.username, conf.data.password);
        await expect(loginPage.baseLoc.dashboardContainer).toBeVisible();
        await myCompanyPage.open();
    });

    
    test('SETTING_002 - Verify validation my company profile', {
        tag: ['@SETTING_002', '@my_company', '@validation']
    }, async ({ conf }) => {
        test.slow();
        await test.step('Clear the "Name" field and click "Update".', async () => {
            await expect(myCompanyPage.dashboardLoc.modal.inputByID("input_name")).toBeVisible();
            await myCompanyPage.page.waitForTimeout(2_000); 
            await myCompanyPage.dashboardLoc.modal.inputByID("input_name").clear({force: true});
            await myCompanyPage.page.getByRole('button', { name: 'Update' }).click();

            await expect(myCompanyPage.page.getByText('The name field is required.')).toBeVisible();
            await myCompanyPage.page.locator('input[name="email_address"]').click();

        });

        await test.step('Enter an invalid email in "Email Address" and click "Update".', async () => {
            await myCompanyPage.page.locator('input[name="email_address"]').fill('abcd');
            await myCompanyPage.page.waitForTimeout(2_000);
            await myCompanyPage.page.getByRole('button', { name: 'Update' }).click();
            await expect(myCompanyPage.page.getByText('The email address field is')).toBeVisible();
        });
    });

    
    test('SETTING_003 - Verify when user update data detail success', {
        tag: ['@SETTING_003', '@my_company', '@validation']
    }, async ({ conf }) => {
        test.slow();
        let randomPhoneNumber: string;
        await test.step('Update "Phone Number" to "(435) 453-4533".', async () => {
            randomPhoneNumber = `(${randomString(3)}) 453-4555`;
            await myCompanyPage.page.locator("//input[@name='phone_number']").click();
            await myCompanyPage.page.locator("//input[@name='phone_number']").fill('          ');
            await myCompanyPage.page.locator("//input[@name='phone_number']").pressSequentially(randomPhoneNumber, { delay: 100 });
            await myCompanyPage.page.waitForTimeout(2000);
        });

        await test.step('Click the "Update" button.', async () => {
            await myCompanyPage.page.getByRole('button', { name: 'Update' }).click();
            await expect(myCompanyPage.dashboardLoc.msgSuccess).toBeVisible();
            await expect(myCompanyPage.page.locator("//input[@name='phone_number']")).toHaveValue(randomPhoneNumber);
        });
    });

    test('SETTING_004 - Verify when user update data detail fail', {
        tag: ['@SETTING_004', '@my_company', '@validation']
    }, async ({ conf }) => {
        await test.step('Update "Email Address" to "invalid-email".', async () => {
            await myCompanyPage.page.locator('input[name="email_address"]').fill('abcd');
            await myCompanyPage.page.waitForTimeout(2000);
        });

        await test.step('Click the "Update" button.', async () => {
            await myCompanyPage.page.getByRole('button', { name: 'Update' }).click();
            await expect(myCompanyPage.myCompanyLoc.msgInvalidEmail).toBeVisible();
        });
    });
});

