import Routing from '../../../../pages/eui/10x/routing-10x.js'
import CookieBannerActions from '../../../../actions/cookieBanner.js'
import LayoutOverlayPanel from '../../../../pages/eui/10x/ux/ux-layout-overlay-panel-10x.po.js'

describe('eUI - <ux-layout-overlay-panel> Component Object @CCQA-692', async() => {
  let layoutOverlayPanelPage = new LayoutOverlayPanel();
  it('should navigate to <ux-layout-overlay-panel> component', async() => {
    browser.addTestMeta({uuid:"63f4f0ba-7b61-11eb-9439-0242ac130002", zephyrKey: "CCQA-692", zephyrStep: "353073", reportGroups: ["eUI.10x.ux"]});
    await layoutOverlayPanelPage.open(Routing.getUxLayoutComponentUrl('ux-layout-overlay-panel'));
    await CookieBannerActions.cookieBanner(true);
    let pgTitle = await $(layoutOverlayPanelPage.pageTitle);
    let appDocPageId = await $(layoutOverlayPanelPage.appDocPageById('ux-layout-overlay-panel'));
    let navigationList = await $(layoutOverlayPanelPage.navigationList);
    await pgTitle.scrollIntoView();
    await expect(pgTitle).toBeDisplayed({wait:1000, message:'<ux-layout-overlay-panel> page title is not visible on page'});
    await expect(await pgTitle.getText()).toBe('ux-layout-overlay-panel', '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 verify the presence of the Component Object on the page ', async() => {
    browser.addTestMeta({zephyrStep: "353074"});
    let co1 = await $(layoutOverlayPanelPage.layoutOverlayPanelFromSectionById('Default').overlayoutPanel);
    let co2 = await $(layoutOverlayPanelPage.layoutOverlayPanelByIndex(1).currentPath);

    await expect(co1).toBeDisplayed({wait:1000, message:'<Default> section -> is not visible on page'});
    await expect(co2).toBeDisplayed({wait:1000, message:'Layout overlay panel by index "1" is not visible on page'});

    await expect(await layoutOverlayPanelPage.layoutOverlayPanelByIndex(1).defaultComponentsCount()).toBe(3,
      'There should be 3 <ux-layout-overlay-panel> components on the page.');
  });
  it('should verify the presence of the main elements of the Component Object on the page ', async() => {
    browser.addTestMeta({zephyrStep: "353075"});
    let sectionId = 'Default';
    let sectionElement = await $(layoutOverlayPanelPage.layoutOverlayPanelFromSectionById(sectionId).currentPath);
    await sectionElement.scrollIntoView();
    let co1 = await $(layoutOverlayPanelPage.layoutOverlayPanelByIndex(1).overlayoutPanel);
    await expect(co1).toBeDisplayed({wait:1000, message:'Layout overlay panel by index "1" is not visible on page'});
    await expect(await layoutOverlayPanelPage.layoutOverlayPanelFromSectionWithIdByIndex('Default', 1).isActive()).toBe(false,'isActive should be false ');
  });
  it('should click on <Toggle overlay panel> and verify the invisibility of the CO', async() => {
    browser.addTestMeta({zephyrStep: "353076"});
    let sectionId = 'Default';
    let sectionElement = await $(layoutOverlayPanelPage.layoutOverlayPanelFromSectionById(sectionId).currentPath);
    await sectionElement.scrollIntoView();

    let layoutOverlayPanel1 = layoutOverlayPanelPage.layoutOverlayPanelFromSectionWithIdByIndex('Default', 3);
    await expect(await layoutOverlayPanel1.isActive()).toBe(false, 'isActive should be false ');
    await (await $(layoutOverlayPanelPage.buttonByTextContains('Toggle overlay panel').byIndex(3).currentPath)).click();
    await expect(await layoutOverlayPanel1.isActive()).toBe(true, 'isActive should be true ');
    await (await $(layoutOverlayPanelPage.buttonByTextContains('isSmall').currentPath)).click();
    await expect(await layoutOverlayPanel1.isSmall()).toBe(true, 'isSmall should be true ');
    await (await $(layoutOverlayPanelPage.buttonByTextContains('isMedium').currentPath)).click();
    await expect(await layoutOverlayPanel1.isMedium()).toBe(true, 'isMedium should be true ');
    await (await $(layoutOverlayPanelPage.buttonByTextContains('isLarge').currentPath)).click();
    await expect(await layoutOverlayPanel1.isLarge()).toBe(true, 'isLarge should be true ');
    await expect(await layoutOverlayPanel1.isSmall()).toBe(false, 'isSmall should be false ');
  });
});
