import Routing from '../../../../pages/eui/10x/routing-10x.js'
import ModalPage from '../../../../pages/eui/10x/ux/ux-modal-10x.po.js'
import ButtonPage from '../../../../pages/eui/10x/ux/ux-button-10x.po.js'
import CookieBannerActions from '../../../../actions/cookieBanner.js'

describe('eUI - <ux-modal> Component Object', async () => {
  let modalPage = new ModalPage();
  let buttonPage = new ButtonPage();
  it('should navigate to <ux-modal> component', async () => {
    browser.addTestMeta({uuid:"0a6eb76c-832f-11eb-8dcd-0242ac130003", zephyrKey: "CCQA-739", zephyrStep: "363977", reportGroups: ["eUI.10x.ux"]});
    await modalPage.open(Routing.getUxComponentUrl('ux-modal'));
    await CookieBannerActions.cookieBanner(true);
    let pgTitle = await $(modalPage.pageTitle);
    let navigationList = await $(modalPage.navigationList);
    await expect(pgTitle).toBeDisplayed({wait:1000, message:'<ux-modal> page title is not visible on page'});
    await expect(pgTitle).toHaveText('ux-modal', 'Page title text is not as expected')
    await expect(await $(modalPage.appDocPageById('ux-modal'))).toExist({wait:1000, message:'Page Id is not present in page'});
    await expect(navigationList).toBeDisplayed({wait:1000, message:'Navigation List -> is not visible on page'});
  });
  it('should verify the presence of the Component Object on the page ', async () => {
    browser.addTestMeta({zephyrStep: "363978"});
    let sectionId = 'Default';
    let scrollIntoSection = await $(modalPage.sectionById(sectionId));
    await scrollIntoSection.scrollIntoView();
    let modal = modalPage.modalByIndex(1);
    await expect(await $(modalPage.sectionById(sectionId))).toBeDisplayedInViewport({message:'<Default> section -> is not visible on page'});
    await expect(await $(modal.dataE2E)).toExist({message:'Modal by index "1" is not existing on page'});
    await expect(await modal.defaultComponentsCount()).toBe(26,'There should be 26 <ux-modal> components on page.');
    let button = await $(buttonPage.buttonFromSectionWithIdByIndex(sectionId,2).button);
    await expect(button).toBeDisplayedInViewport({message:'button is not visible on page'});
    await button.click();
    await expect(await $(modalPage.modalByIndex(2).dataE2E)).toBeDisplayedInViewport({message:'Modal by index "2" is not visible on page'});
    let closeBtn = await $(modalPage.modalByIndex(2).closeBtn);
    await expect(closeBtn).toBeClickable({message:'closeBtn is not clickable'});
    await closeBtn.click();
    await expect(closeBtn).not.toBeDisplayedInViewport({message:'closeBtn is visible on page'});
  });
  it('should verify the Modal CO header and body ', async () => {
    browser.addTestMeta({zephyrStep: "363979"});
    let sectionId = 'Default';
    let scrollIntoSection = await $(modalPage.sectionById(sectionId));
    await scrollIntoSection.scrollIntoView();
    let button2 = await $(buttonPage.buttonFromSectionWithIdByIndex(sectionId,2).button);
    await expect(button2).toBeDisplayedInViewport({message:'button2 is not visible on page'});
    await button2.click();
    let modal2 = modalPage.modalByIndex(2);
    await expect(await $(modal2.dialog)).toBeDisplayedInViewport({message:'Modal dialog from section Default is not visible on page'});
    await expect(await $(modal2.header)).toBeDisplayedInViewport({message:'Modal header from section Default is not visible on page'});
    await expect(await $(modal2.headerTitle)).toBeDisplayedInViewport({message:'Modal headerTitle from section Default is not visible on page'});
    await expect(await $(modal2.headerTitle)).toHaveText('Modal title');
    await expect(await modal2.titleLabel()).toBe('Modal title');
    let closeBtn2 = await $(modalPage.modalByIndex(2).closeBtn);
    await expect(closeBtn2).toBeClickable({message:'closeBtn2 is not clickable'});
    await closeBtn2.click();
    await expect(closeBtn2).not.toBeDisplayedInViewport({message:'closeBtn2 is visible on page'});
    await (await $(buttonPage.buttonFromSectionWithIdByIndex(sectionId,6).button)).click();
    let modal6 = modalPage.modalByIndex(6);
    await expect(await $(modal6.header)).toBeDisplayedInViewport({message:'Modal header from section Default is not visible on page'});
    await expect(await $(modal6.headerPlaceholder)).toBeDisplayedInViewport({message:'Modal headerPlaceholder from section Default is not visible on page'});
    await expect(await $(modal6.body)).toBeDisplayedInViewport({message:'Modal body from section Default is not visible on page'});
    await expect(await $(modal6.bodyPlaceholder)).toBeDisplayedInViewport({message:'Modal bodyPlaceholder from section Default is not visible on page'});
    let closeBtn6 = await $(modalPage.modalByIndex(6).closeBtn);
    await expect(closeBtn6).toBeClickable({message:'closeBtn6 is not clickable'});
    await closeBtn6.click();
    await expect(closeBtn6).not.toBeDisplayedInViewport({message:'closeBtn6 is visible on page'});

    sectionId = 'misc-options';
    scrollIntoSection = await $(modalPage.sectionById(sectionId));
    await scrollIntoSection.scrollIntoView();

    button2 = await $(buttonPage.buttonFromSectionWithIdByIndex(sectionId,2).button);
    await expect(button2).toBeDisplayedInViewport({message:'button2 from section misc-options is not visible on page'});
    await button2.click();
    modal2 = modalPage.modalFromSectionWithIdByIndex(sectionId,2);
    await expect(await $(modal2.dialog)).toBeDisplayedInViewport({message:'Modal dialog from section misc-options is not visible on page'});
    await expect(await $(modal2.noPadding)).toBeDisplayedInViewport({message:'Modal noPadding from section misc-options is not visible on page'});
    await expect(await modal2.hasNoBodyPadding()).toBe(true, 'Modal hasNoBodyPadding from section misc-options should be true');
    let closeBtn19 = await $(modalPage.modalByIndex(19).closeBtn);
    await expect(closeBtn19).toBeClickable({message:'closeBtn19 is not clickable'});
    await closeBtn19.click();
    await expect(closeBtn19).not.toBeDisplayedInViewport({message:'closeBtn19 is visible on page'});
  });
  it('should verify the Modal CO Footer', async () => {
    browser.addTestMeta({zephyrStep: "363980"});
    let sectionId = 'Default';
    let scrollIntoSection = await $(modalPage.sectionById(sectionId));
    await scrollIntoSection.scrollIntoView();
    let button8 = await $(buttonPage.buttonFromSectionWithIdByIndex(sectionId,8).button);
    await button8.scrollIntoView();
    await expect(button8).toBeDisplayedInViewport({wait: 3000, message:'button8 from section Default is not visible on page'});
    if (await button8.isDisplayed() && await button8.isClickable()) {
      await button8.click();
      let modal8 = modalPage.modalByIndex(8);
      await expect(await $(modal8.dialog)).toBeDisplayedInViewport({message:'Modal dialog from section Default is not visible on page'});
      await expect(await $(modal8.footer)).toBeDisplayedInViewport({message:'Modal footer from section Default is not visible on page'});
      await expect(await $(modal8.footer)).toBeDisplayed({wait:1000, message:'Modal footer from section Default is not visible on page'});
      await expect(await modal8.isFooterVisible()).toBe(true, 'isFooterVisible should be true');
      await expect(await $(modal8.footerCustomAlignment)).toBeDisplayedInViewport({message:'Modal footerCustomAlignment from section Default is not visible on page'});
      await expect(await modal8.isFooterCustomAlignment()).toBe(true, 'isFooterCustomAlignment should be true');
      await expect(await $(modal8.footerContentPlaceholder)).toBeDisplayedInViewport({message:'Modal footerContentPlaceholder from section Default is not visible on page'});
      await expect(await $(modal8.footerDismissActionBtn)).toBeDisplayedInViewport({message:'Modal footerDismissActionBtn from section Default is not visible on page'});
      await expect(await modal8.isDismissActionVisible()).toBe(true, 'isDismissActionVisible should be true');
      await expect(await $(modal8.footerAcceptActionBtn)).toBeDisplayedInViewport({message:'Modal footerAcceptActionBtn from section Default is not visible on page'});
      await expect(await modal8.isAcceptActionVisible()).toBe(true, 'isAcceptActionVisible should be true');
      await expect(await $(modal8.buttonWithLabel)).toBeDisplayedInViewport({message:'Modal buttonWithLabel from section Default is not visible on page'});
      await expect(await modal8.isShowActionIcons()).toBe(true, 'isShowActionIcons should be true');
      let closeBtn8 = await $(modalPage.modalByIndex(8).closeBtn);
      await expect(closeBtn8).toBeClickable({message:'closeBtn8 is not clickable'});
      await closeBtn8.click();
      await expect(closeBtn8).not.toBeDisplayedInViewport({message:'closeBtn8 is visible on page'});
    }
    let button4 = await $(buttonPage.buttonFromSectionWithIdByIndex(sectionId,4).button);
    await button4.scrollIntoView();
    await expect(button4).toBeDisplayedInViewport({message:'button4 from section Default is not visible on page'});
    if (button4.isDisplayed && button4.isClickable()) {
      await button4.click();
      let modal4 = modalPage.modalByIndex(4);
      await expect(await $(modal4.dialog)).toBeDisplayedInViewport({message:'Modal dialog from section Default is not visible on page'});
      await expect(await $(modal4.footer)).toBeDisplayedInViewport({message:'Modal footer from section Default is not visible on page'});
      await expect(await $(modalPage.modalFromSectionWithIdByIndex(sectionId,4).buttonIcon)).toBeDisplayedInViewport({message:'Modal buttonIcon from section Default is not visible on page'});
      let closeBtn4 = await $(modalPage.modalByIndex(4).closeBtn);
      await expect(closeBtn4).toBeClickable({message:'closeBtn4 is not clickable'});
      await closeBtn4.click();
      await expect(closeBtn4).not.toBeDisplayedInViewport({message:'closeBtn4 is visible on page'});
    }
    let button5 =  await $(buttonPage.buttonFromSectionWithIdByIndex(sectionId,5).button);
    await expect(button5).toBeDisplayedInViewport({message:'button5 from section Default is not visible on page'});
    if (await button5.isDisplayed() && await button5.isClickable()) {
      await button5.click();
      let modal5 = modalPage.modalByIndex(5);
      await expect(await $(modal5.dialog)).toBeDisplayedInViewport({message:'Modal dialog from section Default is not visible on page'});
      await expect(await $(modal5.footer)).toBeDisplayedInViewport({message:'Modal footer from section Default is not visible on page'});
      await expect(await modal5.dismissActionLabel()).toBe('secondary', 'dismissActionLabel should be secondary ');
      await expect(await modal5.acceptActionLabel()).toBe('PRIMARY', 'acceptActionLabel should be PRIMARY ');
      let closeBtn5 = await $(modalPage.modalByIndex(5).closeBtn);
      await expect(closeBtn5).toBeClickable({message:'closeBtn5 is not clickable'});
      await closeBtn5.click();
      await expect(closeBtn5).not.toBeDisplayedInViewport({message:'closeBtn5 is visible on page'});
    }
  });
  it('should close the active modal and verify specific method', async () => {
    browser.addTestMeta({zephyrStep: "363981"});
    let sectionId = 'Default';
    let scrollIntoSection = await $(modalPage.sectionById(sectionId));
    await scrollIntoSection.scrollIntoView();
    let modal2 = modalPage.modalFromSectionWithIdByIndex(sectionId,2);
    await expect(await modal2.isModalOpen()).toBe(false, 'isModalOpen should be false');
    let button2 = await $(buttonPage.buttonFromSectionWithIdByIndex(sectionId,2).button);
    await expect(button2).toBeDisplayedInViewport({message:'button2 from Default is not visible on page'});
    if (button2.isDisplayed && button2.isClickable()) {
      await button2.click();
    }
    let modal = modalPage.modalByIndex(2);
    await expect(await $(modal.dialog)).toBeDisplayedInViewport({message:'Modal dialog from section misc-options is not visible on page'});
    await expect(await $(modal.header)).toBeDisplayedInViewport({message:'Modal header from section misc-options is not visible on page'});
    await expect(await modal2.isModalOpen()).toBe(true, 'isModalOpen should be false');
    let closeBtn2 = await $(modalPage.modalByIndex(2).closeBtn);
    await expect(closeBtn2).toBeClickable({message:'closeBtn2 is not clickable'});
    await closeBtn2.click();
    await expect(closeBtn2).not.toBeDisplayedInViewport({message:'closeBtn2 is visible on page'});
    await expect(await modal2.isModalOpen()).toBe(false, 'isModalOpen should be false');
  });
  it('should open modal without footer and verify specific method', async () => {
    browser.addTestMeta({zephyrStep: "363982"});
    let sectionId = 'Default';
    let scrollIntoSection = await $(modalPage.sectionById(sectionId));
    await scrollIntoSection.scrollIntoView();
    let button9 = await $(buttonPage.buttonFromSectionWithIdByIndex(sectionId,9).button);
    await expect(button9).toExist({message:'button9 from section Default is not existing on page'});
    await button9.scrollIntoView();
    await browser.execute("arguments[0].click();",  button9);
    await expect(await modalPage.modalFromSectionWithIdByIndex(sectionId,9).isFooterVisible()).toBe(false, 'isFooterVisible should be false');
    await browser.execute("arguments[0].click();",  await $(modalPage.modalFromSectionWithIdByIndex(sectionId,2).closeBtn));
    await expect(modalPage.modalByIndex(9).closeBtn).not.toBeDisplayedInViewport({message:'closeBtn9 is visible on page'});
  });
  it('should open draggable modal and verify specific method', async () => {
    browser.addTestMeta({zephyrStep: "363983"});
    let sectionId = 'draggable';
    let scrollIntoSection = await $(modalPage.sectionById(sectionId));
    await scrollIntoSection.scrollIntoView();
    let button = await $(buttonPage.buttonFromSectionWithIdByIndex(sectionId,1).button);
    browser.execute("arguments[0].click();",  button);
    await expect(await modalPage.modalFromSectionWithIdByIndex(sectionId,1).isDraggable()).toBe(true, 'isDraggable should be true');
    let closeBtn =  await $(modalPage.modalFromSectionWithIdByIndex(sectionId,1).closeBtn);
    await expect(closeBtn).toBeClickable({message:'closeBtn is not clickable'});
    await browser.execute("arguments[0].click();",  closeBtn);
    await expect(closeBtn).not.toBeDisplayedInViewport({message:'closeBtn is visible on page'});

    sectionId = 'Default';
    scrollIntoSection = await $(modalPage.sectionById(sectionId));
    await scrollIntoSection.scrollIntoView();
    button = await $(buttonPage.buttonFromSectionWithIdByIndex(sectionId,2).button);
    await browser.execute("arguments[0].click();",  button);
    await expect(await modalPage.modalFromSectionWithIdByIndex(sectionId,2).isDraggable()).toBe(false, 'isDraggable should be false');
    closeBtn = await $(modalPage.modalFromSectionWithIdByIndex(sectionId,2).closeBtn);
    await expect(closeBtn).toBeClickable({message:'closeBtn is not clickable'});
    await browser.execute("arguments[0].click();",  closeBtn);
    await expect(closeBtn).not.toBeDisplayedInViewport({message:'closeBtn is visible on page'});
  });
});
