import Routing from '../../../pages/eui/14x/routing.js'
import EuiAlertPage from '../../../pages/eui/14x/eui-alert.po.js'
import * as cookieBanner from '../../../actions/cookieBanner.js';
import BaseActions from '../../../actions/V14/base-actions.js';

describe('eUI - <eui-alert> Component Object ', async() => {

  let page = new EuiAlertPage();
  let pageName = 'eui-alert';
  let testFolder = './/v14x//eui-alert//';
  it('should navigate to <eui-alert> demo page', async() => {
    browser.addTestMeta({uuid:"276bedb6-cde0-11eb-b8bc-0242ac130003", zephyrKey: "CCQA-1104", zephyrStep: "407724", reportGroups: ["eUI.14x.eui"]});
    await page.open(Routing.getEUIComponentUrl('eui-alert'));
    await cookieBanner.cookieBanner(true);
    await BaseActions.verifyPageTitle(pageName);
    await expect(await $(page.navigationList)).toBeDisplayedInViewport({message:'Navigation List -> is not visible on page'});
  });

  // it('should verify the section titles ', async() => {
  //   browser.addTestMeta({zephyrStep: "407725"});
  //   let sectionId = 'Default';
  //   await BaseActions.verifySection(sectionId, pageName);
  //   sectionId = 'color-types';
  //   await BaseActions.verifySection(sectionId, pageName);
  //   let index = 1;
  //   await chaiExpect(await page.alertByIndex(index).defaultComponentsCount()).equal(12, 'There should be 12 <eui-alert> components on the page.')
  // });

  // it('should verify the <eui-alert> identification methods', async() => {
  //   browser.addTestMeta({zephyrStep: "407726"});
  //   let index = 1;
  //   let alertByIndex = await $(page.alertByIndex(index).currentPath);
  //   await expect(alertByIndex).toExist({message:'Alert with index ' + index + ' not existing on page'});
  //   await alertByIndex.scrollIntoView();

  //   if(browser.config.useWdioImageComparison) {
  //     await chaiExpect(await browser.checkElement(alertByIndex, testFolder+'img_alertByIndex', {hideElements: [await $('//eui-app-toolbar')]})).equal(0, 'Image comparison failed for alertByIndex');
  //   }

  //   let text = 'Sample text';
  //   let alertByTextContains = await $(page.alertByTextContains(text).currentPath);
  //   await expect(alertByTextContains).toExist({message:'Alert with text ' + text + ' not existing on page'});
  //   await alertByTextContains.scrollIntoView();

  //   if(browser.config.useWdioImageComparison) {
  //     await chaiExpect(await browser.checkElement(alertByTextContains, testFolder+'img_alertByTextContains', {hideElements: [await $('//eui-app-toolbar')]})).equal(0, 'Image comparison failed for alertByTextContains');
  //   }

  //   let sectionId = 'Default';
  //   await BaseActions.verifySection(sectionId, pageName);
  //   let alertFromSection = await $(page.alertFromSectionWithIdByIndex(sectionId, 1).currentPath);
  //   await expect(alertFromSection).toExist({message:'Alert from section "' + sectionId + '" and with index: ' + index + 'not existing on page'});
  //   await alertFromSection.scrollIntoView();
  //   if(browser.config.useWdioImageComparison) {
  //     await chaiExpect(await browser.checkElement(alertFromSection, testFolder+'img_alertFromSection', {hideElements: [await $('//eui-app-toolbar')]})).equal(0, 'Image comparison failed for alertFromSection');
  //   }
  // });

  // it('should verify the <eui-alert> color-types', async() => {
  //   browser.addTestMeta({zephyrStep: "407727"});
  //   let sectionId = 'color-types';
  //   await BaseActions.verifySection('color-types', pageName);
  //   let alertColor2 = await page.alertFromSectionWithIdByIndex(sectionId, 2).element();
  //   let alertColor3 = await page.alertFromSectionWithIdByIndex(sectionId, 3).element();
  //   let alertColor4 = await page.alertFromSectionWithIdByIndex(sectionId, 4).element();
  //   let alertColor5 = await page.alertFromSectionWithIdByIndex(sectionId, 5).element();

  //   await expect(alertColor2).toHaveAttrContaining('class', 'eui-alert--success');
  //   await expect(alertColor3).toHaveAttrContaining('class', 'eui-alert--secondary');
  //   await expect(alertColor4).toHaveAttrContaining('class', 'eui-alert--warning');
  //   await expect(alertColor5).toHaveAttrContaining('class', 'eui-alert--danger');

  //   if(browser.config.useWdioImageComparison) {
  //     await chaiExpect(await browser.checkElement(alertColor2, testFolder+'img_alertColor2', {hideElements: [await $('//eui-app-toolbar')]})).equal(0, 'Image comparison failed for alertColor2');
  //     await chaiExpect(await browser.checkElement(alertColor3, testFolder+'img_alertColor3', {hideElements: [await $('//eui-app-toolbar')]})).equal(0, 'Image comparison failed for alertColor3');
  //     await chaiExpect(await browser.checkElement(alertColor4, testFolder+'img_alertColor4', {hideElements: [await $('//eui-app-toolbar')]})).equal(0, 'Image comparison failed for alertColor4');
  //     await chaiExpect(await browser.checkElement(alertColor5, testFolder+'img_alertColor5', {hideElements: [await $('//eui-app-toolbar')]})).equal(0, 'Image comparison failed for alertColor5');
  //   }
  // });

  // it('should verify isCloseable method', async() => {
  //   browser.addTestMeta({zephyrStep: "407728"});
  //   let sectionId = 'Default';
  //   await expect(await page.alertFromSectionWithIdByIndex(sectionId, 1).isCloseable()).toBe(false);

  //   sectionId = 'Default';
  //   await BaseActions.verifySection(sectionId, pageName);
  //   await expect(await page.alertFromSectionWithIdByIndex(sectionId, 2).isCloseable()).toBe(true);
  //   let alertContainer = await page.alertFromSectionWithIdByIndex(sectionId, 2).element();
  //   await expect(alertContainer).toBeDisplayedInViewport({wait:3000, message:'Alert 2 contentContainer is not visible on page'});
  //   let alert = page.alertFromSectionWithId(sectionId);
  //   let alertClose = await $(alert.alertClose);
  //   if(browser.config.useWdioImageComparison) {
  //     await alertContainer.scrollIntoView();
  //     if (browser.config.env.endsWith('DEV')){
  //       await chaiExpect(await browser.checkElement(alertContainer, testFolder+'img_alertContainerDev', {hideElements: [await $('//eui-app-toolbar')]})).equal(0, 'Image comparison failed for alertContainer');
  //       await chaiExpect(await browser.checkElement(alertClose, testFolder+'img_alertCloseDev', {hideElements: [await $('//eui-app-toolbar')]})).equal(0, 'Image comparison failed for alertClose');

  //     }
  //     else{
  //       await chaiExpect(await browser.checkElement(alertContainer, testFolder+'img_alertContainer', {hideElements: [await $('//eui-app-toolbar')]})).equal(0, 'Image comparison failed for alertContainer');
  //       await chaiExpect(await browser.checkElement(alertClose, testFolder+'img_alertClose', {hideElements: [await $('//eui-app-toolbar')]})).equal(0, 'Image comparison failed for alertClose');
  //     }
  //   }
  //   await alertClose.click();
  //   await expect(await $(page.alertFromSectionWithIdByIndex(sectionId, 2).contentContainer)).not.
  //   toBeDisplayedInViewport({wait:3000, message:'Alert 2 contentContainer is  visible on page'});
  // });

  // it('should verify isMuted method ', async() => {
  //   browser.addTestMeta({zephyrStep: "407729"});
  //   let sectionId = 'color-types';
  //   await BaseActions.verifySection(sectionId, pageName);

  //   let alertMuted1 = await page.alertFromSectionWithIdByIndex(sectionId, 6).element();
  //   let alertMuted2 = await page.alertFromSectionWithIdByIndex(sectionId, 7).element();
  //   let alertMuted3 = await page.alertFromSectionWithIdByIndex(sectionId, 8).element();
  //   let alertMuted4 = await page.alertFromSectionWithIdByIndex(sectionId, 9).element();
  //   let alertMuted5 = await page.alertFromSectionWithIdByIndex(sectionId, 10).element();
  //   let alertColor5 = await page.alertFromSectionWithIdByIndex(sectionId, 5).element();

  //   await expect(await page.alertFromSectionWithIdByIndex(sectionId, 6).isMuted()).toBe(true);
  //   await expect(await page.alertFromSectionWithIdByIndex(sectionId, 5).isMuted()).toBe(false);

  //   if(browser.config.useWdioImageComparison) {
  //     await chaiExpect(await browser.checkElement(alertColor5, testFolder+'img_alertColor5', {hideElements: [await $('//eui-app-toolbar')]})).equal(0, 'Image comparison failed for alertColor5');
  //     await chaiExpect(await browser.checkElement(alertMuted1, testFolder+'img_alertMuted1', {hideElements: [await $('//eui-app-toolbar')]})).equal(0, 'Image comparison failed for alertMuted1');
  //     await chaiExpect(await browser.checkElement(alertMuted2, testFolder+'img_alertMuted2', {hideElements: [await $('//eui-app-toolbar')]})).equal(0, 'Image comparison failed for alertMuted2');
  //     await chaiExpect(await browser.checkElement(alertMuted3, testFolder+'img_alertMuted3', {hideElements: [await $('//eui-app-toolbar')]})).equal(0, 'Image comparison failed for alertMuted3');
  //     await chaiExpect(await browser.checkElement(alertMuted4, testFolder+'img_alertMuted4', {hideElements: [await $('//eui-app-toolbar')]})).equal(0, 'Image comparison failed for alertMuted4');
  //     await chaiExpect(await browser.checkElement(alertMuted5, testFolder+'img_alertMuted5', {hideElements: [await $('//eui-app-toolbar')]})).equal(0, 'Image comparison failed for alertMuted4');
  //   }
  // });
});
