import Routing from '../../../../pages/eui/10x/routing-10x.js'
import EuiSelectPage from '../../../../pages/eui/10x/eui/eui-select-10x.po.js'
import CookieBannerActions from '../../../../actions/cookieBanner.js'

describe('eUI - <eui-select> Component Object ', async () => {
  let page = new EuiSelectPage();
  let testFolder = './/eui-select//';
  it('should navigate to <eui-select> demo page', async () => {
    browser.addTestMeta({ uuid: "d5a9e050-79fb-11ec-90d6-0242ac120003", zephyrKey: "CCQA-1869", zephyrStep: "453926", reportGroups: ["eUI.10x.eui"] });
    await page.open(Routing.getEUIDirectivesUrl('eui-select'));
    await CookieBannerActions.cookieBanner(true);
    let pgTitle = await $(page.pageTitle);
    await pgTitle.scrollIntoView();
    await expect(await $(pgTitle)).toBeDisplayedInViewport({ message: '<euiSelect> page title is not displayed on page' });
    await expect(await $(page.appDocPageById('eui-select'))).toExist({message:'Page Id is not existing on page'});
    await chaiExpect(await pgTitle.getText()).equal('eui-select', 'Page title text is not as expected');
    await expect(await $(page.navigationList)).toBeDisplayedInViewport({ message: 'Navigation List -> is not displayed on page' });
  });
  it('should verify the presence and number of component objects <eui-select> on page ', async () => {
    browser.addTestMeta({ zephyrStep: "453927" });
    let sectionId = 'Default';
    let index = 1;
    let selectByIndex1 = await (await page.selectByIndex(index).element());
    await expect(await $(page.sectionById(sectionId))).toBeDisplayed({ message: '<Default> section -> is not displayed on page' });
    await expect(selectByIndex1).toExist({ message: 'Select by index ' + index + ' is not existing on page' });
    await chaiExpect(await page.selectByIndex(index).defaultComponentsCount()).equal(28, 'There should be 28 <eui-select> components on the page.');
    if (browser.config.useWdioImageComparison) {
      await selectByIndex1.scrollIntoView();
      await chaiExpect(await browser.checkElement(selectByIndex1, testFolder + 'img_selectByIndex1', { hideElements: [await $('//eui-app-toolbar')] })).equal(0, 'Image comparison failed for selectByIndex1');
    }
  });
  it('should verify the <eui-select>  multiple ', async () => {
    browser.addTestMeta({ zephyrStep: "453928" });
    let sectionId = 'multiple';
    let sectionElement = await $(page.sectionById(sectionId));
    await expect(sectionElement).toExist('<' + sectionId + '> section -> does not exist on page');
    await sectionElement.scrollIntoView();

    let selectMultiple = await (await page.selectFromSectionByIndex(sectionId, 1).element());

    await expect(selectMultiple).toExist({ message: 'Multiple is not existing on page' });
    await chaiExpect(await page.selectFromSectionByIndex(sectionId, 1).isMultiple()).equal(true, 'Select is not multipled');
    if (browser.config.useWdioImageComparison) {
      await chaiExpect(await browser.checkElement(selectMultiple, testFolder + 'img_selectMultiple', { hideElements: [await $('//eui-app-toolbar')] })).equal(0, 'Image comparison failed for selectMultiple');
    }
  });
  it('should verify the <eui-select>  size ', async () => {
    browser.addTestMeta({ zephyrStep: "453929" });
    let sectionId = 'size';
    let sectionElement = await $(page.sectionById(sectionId));
    await expect(sectionElement).toExist('<' + sectionId + '> section -> does not exist on page');
    await sectionElement.scrollIntoView();
    let selectSize1 = await $(page.selectFromSectionByIndex(sectionId, 1).currentPath);
    let selectSize2 = await $(page.selectFromSectionByIndex(sectionId, 2).currentPath);
    let selectSize3 = await $(page.selectFromSectionByIndex(sectionId, 3).currentPath);
    let selectSize4 = await $(page.selectFromSectionByIndex(sectionId, 4).currentPath);
    let selectSize5 = await $(page.selectFromSectionByIndex(sectionId, 5).currentPath);
    await expect(selectSize1).toHaveAttrContaining('size', '1');
    await expect(selectSize2).toHaveAttrContaining('size', '2');
    await expect(selectSize3).toHaveAttrContaining('size', '3');
    await expect(selectSize4).toHaveAttrContaining('size', '4');
    await expect(selectSize5).toHaveAttrContaining('size', '5');
    if(browser.config.useWdioImageComparison) {
      await selectSize1.scrollIntoView();
      await chaiExpect(await browser.checkElement(selectSize1, testFolder+'img_selectSize1', {hideElements: [await $('//eui-app-toolbar')]})).equal(0, 'Image comparison failed for selectSize1');
      await selectSize2.scrollIntoView();
      await chaiExpect(await browser.checkElement(selectSize2, testFolder+'img_selectSize2', {hideElements: [await $('//eui-app-toolbar')]})).equal(0, 'Image comparison failed for selectSize2');
      await selectSize3.scrollIntoView();
      await chaiExpect(await browser.checkElement(selectSize3, testFolder+'img_selectSize3', {hideElements: [await $('//eui-app-toolbar')]})).equal(0, 'Image comparison failed for selectSize3');
      await selectSize4.scrollIntoView();
      await chaiExpect(await browser.checkElement(selectSize4, testFolder+'img_selectSize4', {hideElements: [await $('//eui-app-toolbar')]})).equal(0, 'Image comparison failed for selectSize4');
      await selectSize5.scrollIntoView();
      await chaiExpect(await browser.checkElement(selectSize5, testFolder+'img_selectSize5', {hideElements: [await $('//eui-app-toolbar')]})).equal(0, 'Image comparison failed for selectSize5');
    }
  });
  it('should verify the <eui-select>  disabled ', async () => {
    browser.addTestMeta({ zephyrStep: "453930" });
    let sectionId = 'disabled';
    let sectionElement = await $(page.sectionById(sectionId));
    await expect(sectionElement).toExist('<' + sectionId + '> section -> does not exist on page');
    await sectionElement.scrollIntoView();

    let selectDisabled = await (await page.selectFromSectionByIndex(sectionId, 1).element());
    let selectNotDisabled = await (await page.selectFromSectionByIndex(sectionId, 2).element());

    await expect(selectDisabled).toExist({ message: 'selectDisabled is not existing on page' });
    await expect(selectDisabled).toHaveAttr('disabled');
    await expect(selectNotDisabled).toExist({ message: 'selectNotDisabled is not existing on page' });
    if (browser.config.useWdioImageComparison) {
        await chaiExpect(await browser.checkElement(selectDisabled, testFolder + 'img_selectDisabled', { hideElements: [await $('//eui-app-toolbar')] })).equal(0, 'Image comparison failed for selectDisabled');
        await chaiExpect(await browser.checkElement(selectNotDisabled, testFolder + 'img_selectNotDisabled', { hideElements: [await $('//eui-app-toolbar')] })).equal(0, 'Image comparison failed for selectNotDisabled');
    }
  });
  it('should verify the <eui-select>  placeholder ', async () => {
    browser.addTestMeta({ zephyrStep: "453931" });
    let sectionId = 'placeholder';
    let sectionElement = await $(page.sectionById(sectionId));
    await expect(sectionElement).toExist('<' + sectionId + '> section -> does not exist on page');
    await sectionElement.scrollIntoView();

    let placeholder = await (await page.selectFromSectionByIndex(sectionId, 1).element());

    await expect(placeholder).toExist({ message: 'placeholder is not existing on page' });
    await expect(placeholder).toHaveAttr('placeholder');
    if (browser.config.useWdioImageComparison) {
        await chaiExpect(await browser.checkElement(placeholder, testFolder + 'img_placeholder', { hideElements: [await $('//eui-app-toolbar')] })).equal(0, 'Image comparison failed for placeholder');
    }
  });
  it('should verify the <eui-select>  readonly ', async () => {
    browser.addTestMeta({ zephyrStep: "453932" });
    let sectionId = 'readonly';
    let sectionElement = await $(page.sectionById(sectionId));
    await expect(sectionElement).toExist('<' + sectionId + '> section -> does not exist on page');
    await sectionElement.scrollIntoView();

    let selectReadonly = await (await page.selectFromSectionByIndex(sectionId, 2).element());

    await expect(selectReadonly).toExist({ message: 'selectReadonly is not existing on page' });
    await chaiExpect(await page.selectFromSectionByIndex(sectionId, 2).isReadonly()).equal(true, 'selectReadonly is not readonly');
    let removeReadOnlyButton = await (await page.euiButtonCOfromSectionWithIdByIndex(sectionId, 2).element());
    if(removeReadOnlyButton.isExisting && removeReadOnlyButton.isDisplayed) {
      await removeReadOnlyButton.click();
    }
    if (browser.config.useWdioImageComparison) {
      await chaiExpect(await browser.checkElement(selectReadonly, testFolder + 'img_selectReadonly', { hideElements: [await $('//eui-app-toolbar')] })).equal(0, 'Image comparison failed for selectReadonly');
    }
  });
  it('should verify the <eui-select>  invalid ', async () => {
    browser.addTestMeta({ zephyrStep: "453933" });
    let sectionId = 'invalid';
    let sectionElement = await $(page.sectionById(sectionId));
    await expect(sectionElement).toExist('<' + sectionId + '> section -> does not exist on page');
    await sectionElement.scrollIntoView();

    let selectInvalid = await (await page.selectFromSectionByIndex(sectionId, 1).element());

    await expect(selectInvalid).toExist({ message: 'selectInvalid is not existing on page' });
    await chaiExpect(await page.selectFromSectionByIndex(sectionId, 1).isInvalid()).equal(true, 'selectInvalid is not invalid');
    if (browser.config.useWdioImageComparison) {
        await chaiExpect(await browser.checkElement(selectInvalid, testFolder + 'img_selectInvalid', { hideElements: [await $('//eui-app-toolbar')] })).equal(0, 'Image comparison failed for selectInvalid');
    }
  });
});
