import Routing from '../../../../pages/eui/10x/routing-10x.js'
import CookieBannerActions from '../../../../actions/cookieBanner.js'
import DynamicPopoverPage from '../../../../pages/eui/10x/ux/ux-dynamic-popover-10x.po.js'

describe('eUI - <ux-dynamic-popover> Component Object', async () => {
  let dynPopoverPage = new DynamicPopoverPage();
  it('should navigate to <ux-dynamic-popover> component', async () => {
    browser.addTestMeta({uuid:"63e42a1c-96ac-11eb-a8b3-0242ac130003", zephyrKey: "CCQA-777", zephyrStep: "367039", reportGroups: ["eUI.10x.ux"]});
    await dynPopoverPage.open(Routing.getUxComponentUrl('ux-dynamic-popover'));
    await CookieBannerActions.cookieBanner(true);
    let pgTitle = await $(dynPopoverPage.pageTitle);
    let appDocPageId = await $(dynPopoverPage.appDocPageById('ux-dynamic-popover'));
    let navigationList = await $(dynPopoverPage.navigationList);

    await expect(pgTitle).toBeDisplayed({wait:1000, message:'<ux-dynamic-popover> page title is not visible on page'});
    await expect(pgTitle).toHaveText('ux-dynamic-popover', {wait: 1000, message: 'Page title text is not as expected'});
    await expect(appDocPageId).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 open the default dynamic popover ', async () => {
    browser.addTestMeta({zephyrStep: "367040"});
    let sectionId= 'Default';
    let scrollIntoSection = await $(dynPopoverPage.sectionById(sectionId));
    await scrollIntoSection.scrollIntoView();
    let icon = await $("//eui-showcase-doc-sample[@id='"+sectionId+"']//i");
    await expect(icon).toBeDisplayedInViewport({message:'Icon is not visible on page'});
    await icon.click();
    let popover = dynPopoverPage.popoverByIndex(1);
    await expect(await $(popover.dataE2E)).toBeDisplayedInViewport({message:'Dynamic popover by index 1 is not visible on page'});
    await expect(await $(dynPopoverPage.popoverByTextContains('This is popover title').dataE2E)).
      toBeDisplayedInViewport({message:'Dynamic popover by text "This is popover title" is not visible on page'});
    await expect(await $(dynPopoverPage.popoverByTextEqualsAndIndex('This is popover title', 1).dataE2E)).
     toBeDisplayedInViewport({message:'Dynamic popover by text "This is popover title" and index 1 is not visible on page'});
    await expect(await $$(popover.byDefault().dataE2E)).toBeElementsArrayOfSize(1);
    await icon.click();
  });
  it('should verify the dynamic popover component properties ', async () => {
    browser.addTestMeta({zephyrStep: "316149"});
    let sectionId = 'customHeaderClass';
    let scrollIntoSection = await $(dynPopoverPage.sectionById(sectionId));
    await scrollIntoSection.scrollIntoView();
    let icon = await $("//eui-showcase-doc-sample[@id='"+sectionId+"']//i");
    await expect(icon).toBeDisplayedInViewport({message:'Icon is not visible on page'});
    await icon.click();

    let popover = dynPopoverPage.popoverByIndex(1);
    await expect(await $(popover.dataE2E)).toBeDisplayedInViewport({message:'Dynamic popover by index 1 is not visible on page'});
    await expect(await $(popover.popoverArrow)).toBeDisplayedInViewport({message:'Dynamic popover popoverArrow from customHeaderClass section is not visible on page'});
    await expect(await $(popover.popoverArrowInner)).
      toBeDisplayedInViewport({message:'Dynamic popover popoverArrowInner from customHeaderClass section is not visible on page'});
    await expect(await $(popover.popoverHeader)).
      toBeDisplayedInViewport({message:'Dynamic popover popoverHeader from customHeaderClass section is not visible on page'});
    await expect(await $(popover.popoverHeaderTitle)).
      toBeDisplayedInViewport({message:'Dynamic popover popoverHeaderTitle from customHeaderClass section is not visible on page'});
    await expect(await $(popover.popoverHeaderTitle)).toHaveTextContaining('THIS IS POPOVER TITLE');
    await expect(await popover.isShownCloseIcon()).toBe(true);
    await expect(await $(popover.popoverClose)).toBeDisplayedInViewport({message:'Dynamic popover popoverClose is not visible on page'});
    await expect(await $(popover.popoverCloseIcon)).toBeDisplayedInViewport({message:'Dynamic popover popoverCloseIcon is not visible on page'});
    await expect(await $(popover.popoverContent)).toBeDisplayedInViewport({message:'Dynamic popover popoverContent is not visible on page'});
    await expect(await popover.hasNoContentPadding()).toBe(false);
    await (await $(popover.popoverCloseIcon)).click();
  });
  it('should verify the "isVisible" method ', async () => {
    browser.addTestMeta({zephyrStep: "367043"});
    let sectionId= 'isDismissable';
    let scrollIntoSection = await $(dynPopoverPage.sectionById(sectionId));
    await scrollIntoSection.scrollIntoView();

    let icon = await $("//eui-showcase-doc-sample[@id='"+sectionId+"']//i");
    await expect(icon).toBeDisplayedInViewport({message:'Icon is not visible on page'});
    await icon.click();

    let popover = dynPopoverPage.popoverByIndex(1);
    await expect(await $(popover.dataE2E)).toBeDisplayedInViewport({message:'Dynamic popover by index 1 is not visible on page'});
    await expect(await popover.isVisible()).toBe(true);
    await icon.click();
  });
  it('should verify mouse over the icon ', async () => {
    browser.addTestMeta({zephyrStep: "367044"});
    let sectionId= 'Positions';
    let scrollIntoSection = await $(dynPopoverPage.sectionById(sectionId));
    await scrollIntoSection.scrollIntoView();
    let icon = await $("//eui-showcase-doc-sample[@id='"+sectionId+"']//i");
    await expect(icon).toBeDisplayedInViewport({message:'Icon is not visible on page'});
    await icon.moveTo();

    let popover = dynPopoverPage.popoverByIndex(1);
    await expect(await $(popover.dataE2E)).toBeDisplayedInViewport({message:'Dynamic popover from section Positions is not visible on page'});
    await expect(await popover.isVisible()).toBe(true);
  });
});
