import { test as base, expect } from "./conf";
import { ContactPage } from "../pom/contact/contact.page";

const test = base.extend<{ updateContactPage: ContactPage }>({
    updateContactPage: async ({ page, conf }, use) => {
        let dataFromAPI: any;   
        const contactPage = new ContactPage(page);

        await test.step("Search existing contact by email", async () => {
            await contactPage.contactLoc.searchInput.fill(conf.data.email_already_exist);
            const contactExists = contactPage.contactLoc.updating.contactAlreadyExits(conf.data.email_already_exist);
            await expect(contactExists).toBeVisible();
            await expect(contactExists).toBeInViewport();
        });

        await test.step("Open contact detail modal and verify data", async () => {
            const contactExists = contactPage.contactLoc.updating.contactAlreadyExits(conf.data.email_already_exist);
            await contactExists.click();

            await expect(contactPage.contactLoc.updating.emailDetail).toBeVisible();

            dataFromAPI = await contactPage.fetchDetailContact();

            const apiContact = await contactPage.convertToContactDetail(dataFromAPI);
            const uiContactRaw = await contactPage.getContactDetail();
            const uiContact = await contactPage.cleanDashInContactDetail(uiContactRaw);

            expect(apiContact).toEqual(uiContact);
        });

        await test.step("Open update contact form and verify data", async () => {
            await contactPage.dashboardLoc.buttonUpdate.click();
            await expect(contactPage.contactLoc.modalForm.first()).toBeVisible();
             
            const uiUpdateContact = await contactPage.getContactUpdateDetail();
            const apiUpdateContact = await contactPage.convertToContactUpdate(dataFromAPI);
            expect(apiUpdateContact).toEqual(uiUpdateContact);
        });

        use(contactPage);
    }
})

export { test }