import Routing from '../../../pages/eui/14x/routing.js'
import EuiSplitButtonPage from '../../../pages/eui/14x/eui-split-button.po.js'
import * as CookieBannerActions from '../../../actions/cookieBanner.js';
import BaseActions from '../../../actions/V14/base-actions.js';

describe('eUI - <eui-split-button> Component Object',async () => {
  let page = new EuiSplitButtonPage();
  let testFolder = './/v14x//eui-split-button//';
  let pageName = 'eui-split-button'
  it('should navigate to <eui-split-button> demo page ',async () => {
    browser.addTestMeta({uuid:"5771a024-4402-42f4-b66f-df8a0bb7ad18", zephyrKey: "CCQA-1814", zephyrStep: "445933", reportGroups: ["eUI.14x.eui"]});
    await page.open(Routing.getEUICompositionsComponentUrl('eui-split-button'));
    await CookieBannerActions.cookieBanner(true);
    await BaseActions.verifyPageTitle(pageName);
    await expect(await $(page.navigationList)).toBeDisplayedInViewport({message:'Navigation List -> is not displayed on page'});
  });
  it('should verify the <eui-split-button> identification methods',async () => {
    browser.addTestMeta({zephyrStep: "445934"});
    let sectionId= 'Default';
    await BaseActions.verifySection(sectionId, pageName);

    let splitButton = page.splitButtonByIndexFromSection(sectionId, 1);
    let button = page.buttonCoFromSectionWithIndex(sectionId, 1);
    let euiButton = page.euiDropdownCoFromSectionWithIndex(sectionId, 1);

    await expect(await $(splitButton)).toBeDisplayedInViewport({message:'Split-Button -> is not displayed on page'});
    await expect(await (await button.element())).toBeDisplayedInViewport({message:'Button -> is not displayed on page'});
    await expect(await (await euiButton.element())).toBeDisplayedInViewport({message:'Eui Button -> is not displayed on page'});
    
    await chaiExpect(await (await $$(page.splitButton)).length).equal(28, 'There should be 28 <eui-split-button> components on the page.');

    if(browser.config.useWdioImageComparison) {
      await chaiExpect(await browser.checkElement(await $(splitButton), testFolder+'img_DefaultSplitButtonIndex1', 
      {hideElements: [await $('//eui-app-toolbar')]})).equal(0, 'Image comparison failed for img_DefaultSplitButtonIndex1');
    }
  });
  it('should verify Type Classes split buttons presence and image comparison',async () => {
    browser.addTestMeta({zephyrStep: "445935"});
    let sectionId = 'type-classes';
    await BaseActions.verifySection(sectionId, pageName);
    let splitButton = page.splitButtonByIndexFromSection(sectionId, 1);
    let button = page.buttonCoFromSectionWithIndex(sectionId, 1);
    let euiButton = page.euiDropdownCoFromSectionWithIndex(sectionId, 1);

    await expect(await $(splitButton)).toBeDisplayedInViewport({message:'Primary-Split-Button -> is not displayed on page'});
    await expect(await (await button.element())).toBeDisplayedInViewport({message:'Primary-Button -> is not displayed on page'});
    await expect(await (await euiButton.element())).toBeDisplayedInViewport({message:'Primary-Eui-Button -> is not displayed on page'});
    
    if(browser.config.useWdioImageComparison) {
      await chaiExpect(await browser.checkElement(await $(splitButton), testFolder+'img_TypeClassesPrimarySplitButton', 
      {hideElements: [await $('//eui-app-toolbar')]})).equal(0, 'Image comparison failed for img_TypeClassesPrimarySplitButton');
    };

    splitButton = page.splitButtonByIndexFromSection(sectionId, 2);
    button = page.buttonCoFromSectionWithIndex(sectionId, 2);
    euiButton = page.euiDropdownCoFromSectionWithIndex(sectionId, 2);
 
    await expect(await $(splitButton)).toBeDisplayedInViewport({message:'Secondary-Split-Button -> is not displayed on page'});
    await expect(await (await button.element())).toBeDisplayedInViewport({message:'Secondary-Button -> is not displayed on page'});
    await expect(await (await euiButton.element())).toBeDisplayedInViewport({message:'Secondary-Eui-Button -> is not displayed on page'});
    
    if(browser.config.useWdioImageComparison) {
      await chaiExpect(await browser.checkElement(await $(splitButton), testFolder+'img_TypeClassesSecondarySplitButton', 
      {hideElements: [await $('//eui-app-toolbar')]})).equal(0, 'Image comparison failed for img_TypeClassesSecondarySplitButton');
    };

    splitButton = page.splitButtonByIndexFromSection(sectionId, 3);
    button = page.buttonCoFromSectionWithIndex(sectionId, 3);
    euiButton = page.euiDropdownCoFromSectionWithIndex(sectionId, 3);

    await expect(await $(splitButton)).toBeDisplayedInViewport({message:'Success-Split-Button -> is not displayed on page'});
    await expect(await (await button.element())).toBeDisplayedInViewport({message:'Success-Button -> is not displayed on page'});
    await expect(await (await euiButton.element())).toBeDisplayedInViewport({message:'Success-Eui-Button -> is not displayed on page'});
    
    if(browser.config.useWdioImageComparison) {
      await chaiExpect(await browser.checkElement(await $(splitButton), testFolder+'img_TypeClassesSuccessSplitButton', 
      {hideElements: [await $('//eui-app-toolbar')]})).equal(0, 'Image comparison failed for img_TypeClassesSuccessSplitButton');
    };

    splitButton = page.splitButtonByIndexFromSection(sectionId, 4);
    button = page.buttonCoFromSectionWithIndex(sectionId, 4);
    euiButton = page.euiDropdownCoFromSectionWithIndex(sectionId, 4);

    await expect(await $(splitButton)).toBeDisplayedInViewport({message:'Info-Split-Button -> is not displayed on page'});
    await expect(await (await button.element())).toBeDisplayedInViewport({message:'Info-Button -> is not displayed on page'});
    await expect(await (await euiButton.element())).toBeDisplayedInViewport({message:'Info-Eui-Button -> is not displayed on page'});
    
    if(browser.config.useWdioImageComparison) {
      await chaiExpect(await browser.checkElement(await $(splitButton), testFolder+'img_TypeClassesInfoSplitButton', 
      {hideElements: [await $('//eui-app-toolbar')]})).equal(0, 'Image comparison failed for img_TypeClassesInfoSplitButton');
    };
    
    splitButton = page.splitButtonByIndexFromSection(sectionId, 5);
    button = page.buttonCoFromSectionWithIndex(sectionId, 5);
    euiButton = page.euiDropdownCoFromSectionWithIndex(sectionId, 5);

    await expect(await $(splitButton)).toBeDisplayedInViewport({message:'Warning-Split-Button -> is not displayed on page'});
    await expect(await (await button.element())).toBeDisplayedInViewport({message:'Warning-Button -> is not displayed on page'});
    await expect(await (await euiButton.element())).toBeDisplayedInViewport({message:'Warning-Eui-Button -> is not displayed on page'});
    
    if(browser.config.useWdioImageComparison) {
      await chaiExpect(await browser.checkElement(await $(splitButton), testFolder+'img_TypeClassesWarningSplitButton', 
      {hideElements: [await $('//eui-app-toolbar')]})).equal(0, 'Image comparison failed for img_TypeClassesWarningSplitButton');
    };
    
    splitButton = page.splitButtonByIndexFromSection(sectionId, 6);
    button = page.buttonCoFromSectionWithIndex(sectionId, 6);
    euiButton = page.euiDropdownCoFromSectionWithIndex(sectionId, 6);

    await expect(await $(splitButton)).toBeDisplayedInViewport({message:'Danger-Split-Button -> is not displayed on page'});
    await expect(await (await button.element())).toBeDisplayedInViewport({message:'Danger-Button -> is not displayed on page'});
    await expect(await (await euiButton.element())).toBeDisplayedInViewport({message:'Danger-Eui-Button -> is not displayed on page'});
    
    if(browser.config.useWdioImageComparison) {
      await chaiExpect(await browser.checkElement(await $(splitButton), testFolder+'img_TypeClassesDangerSplitButton', 
      {hideElements: [await $('//eui-app-toolbar')]})).equal(0, 'Image comparison failed for img_TypeClassesDangerSplitButton');
    };

    splitButton = page.splitButtonByIndexFromSection(sectionId, 7);
    button = page.buttonCoFromSectionWithIndex(sectionId, 7);
    euiButton = page.euiDropdownCoFromSectionWithIndex(sectionId, 7);

    await expect(await $(splitButton)).toBeDisplayedInViewport({message:'Accent-Split-Button -> is not displayed on page'});
    await expect(await (await button.element())).toBeDisplayedInViewport({message:'Accent-Button -> is not displayed on page'});
    await expect(await (await euiButton.element())).toBeDisplayedInViewport({message:'Accent-Eui-Button -> is not displayed on page'});
    
    if(browser.config.useWdioImageComparison) {
      await chaiExpect(await browser.checkElement(await $(splitButton), testFolder+'img_TypeClassesAccentSplitButton', 
      {hideElements: [await $('//eui-app-toolbar')]})).equal(0, 'Image comparison failed for img_TypeClassesAccentSplitButton');
    };
  });
  it('should verify Disabled split buttons presence and image comparison',async () => {
    browser.addTestMeta({zephyrStep: "445936"});
    let sectionId= 'disabled';
    await BaseActions.verifySection(sectionId, pageName);
    let splitButton = page.splitButtonByIndexFromSection(sectionId, 1);
    let button = page.buttonCoFromSectionWithIndex(sectionId, 1);
    let euiButton = page.euiDropdownCoFromSectionWithIndex(sectionId, 1);

    await expect(await $(splitButton)).toBeDisplayedInViewport({message:'Default-Split-Button -> is not displayed on page'});
    await expect(await (await button.element())).toBeDisplayedInViewport({message:'Default-Button -> is not displayed on page'});
    await expect(await (await euiButton.element())).toBeDisplayedInViewport({message:'Default-Eui-Button -> is not displayed on page'});
    
    if(browser.config.useWdioImageComparison) {
      await chaiExpect(await browser.checkElement(await $(splitButton), testFolder+'img_DisabledDefaultSplitButton', 
      {hideElements: [await $('//eui-app-toolbar')]})).equal(0, 'Image comparison failed for img_DisabledDefaultSplitButton');
    };

    splitButton = page.splitButtonByIndexFromSection(sectionId, 2);
    button = page.buttonCoFromSectionWithIndex(sectionId, 2);
    euiButton = page.euiDropdownCoFromSectionWithIndex(sectionId, 2);

    await expect(await $(splitButton)).toBeDisplayedInViewport({message:'Primary-Split-Button -> is not displayed on page'});
    await expect(await (await button.element())).toBeDisplayedInViewport({message:'Primary-Button -> is not displayed on page'});
    await expect(await (await euiButton.element())).toBeDisplayedInViewport({message:'Primary-Eui-Button -> is not displayed on page'});
    
    if(browser.config.useWdioImageComparison) {
      await chaiExpect(await browser.checkElement(await $(splitButton), testFolder+'img_DisabledPrimarySplitButton', 
      {hideElements: [await $('//eui-app-toolbar')]})).equal(0, 'Image comparison failed for img_DisabledPrimarySplitButton');
    };

    splitButton = page.splitButtonByIndexFromSection(sectionId, 3);
    button = page.buttonCoFromSectionWithIndex(sectionId, 3);
    euiButton = page.euiDropdownCoFromSectionWithIndex(sectionId, 3);

    await expect(await $(splitButton)).toBeDisplayedInViewport({message:'Secondary-Split-Button -> is not displayed on page'});
    await expect(await (await button.element())).toBeDisplayedInViewport({message:'Secondary-Button -> is not displayed on page'});
    await expect(await (await euiButton.element())).toBeDisplayedInViewport({message:'Secondary-Eui-Button -> is not displayed on page'});
    
    if(browser.config.useWdioImageComparison) {
      await chaiExpect(await browser.checkElement(await $(splitButton), testFolder+'img_DisabledSecondarySplitButton', 
      {hideElements: [await $('//eui-app-toolbar')]})).equal(0, 'Image comparison failed for img_DisabledSecondarySplitButton');
    };

    splitButton = page.splitButtonByIndexFromSection(sectionId, 4);
    button = page.buttonCoFromSectionWithIndex(sectionId, 4);
    euiButton = page.euiDropdownCoFromSectionWithIndex(sectionId, 4);

    await expect(await $(splitButton)).toBeDisplayedInViewport({message:'Success-Split-Button -> is not displayed on page'});
    await expect(await (await button.element())).toBeDisplayedInViewport({message:'Success-Button -> is not displayed on page'});
    await expect(await (await euiButton.element())).toBeDisplayedInViewport({message:'Success-Eui-Button -> is not displayed on page'});
    
    if(browser.config.useWdioImageComparison) {
      await chaiExpect(await browser.checkElement(await $(splitButton), testFolder+'img_DisabledSuccessSplitButton', 
      {hideElements: [await $('//eui-app-toolbar')]})).equal(0, 'Image comparison failed for img_DisabledSuccessSplitButton');
    };
    
    splitButton = page.splitButtonByIndexFromSection(sectionId, 5);
    button = page.buttonCoFromSectionWithIndex(sectionId, 5);
    euiButton = page.euiDropdownCoFromSectionWithIndex(sectionId, 5);

    await expect(await $(splitButton)).toBeDisplayedInViewport({message:'Info-Split-Button -> is not displayed on page'});
    await expect(await (await button.element())).toBeDisplayedInViewport({message:'Info-Button -> is not displayed on page'});
    await expect(await (await euiButton.element())).toBeDisplayedInViewport({message:'Info-Eui-Button -> is not displayed on page'});
    
    if(browser.config.useWdioImageComparison) {
      await chaiExpect(await browser.checkElement(await $(splitButton), testFolder+'img_DisabledInfoSplitButton', 
      {hideElements: [await $('//eui-app-toolbar')]})).equal(0, 'Image comparison failed for img_DisabledInfoSplitButton');
    };
    
    splitButton = page.splitButtonByIndexFromSection(sectionId, 6);
    button = page.buttonCoFromSectionWithIndex(sectionId, 6);
    euiButton = page.euiDropdownCoFromSectionWithIndex(sectionId, 6);

    await expect(await $(splitButton)).toBeDisplayedInViewport({message:'Warning-Split-Button -> is not displayed on page'});
    await expect(await (await button.element())).toBeDisplayedInViewport({message:'Warning-Button -> is not displayed on page'});
    await expect(await (await euiButton.element())).toBeDisplayedInViewport({message:'Warning-Eui-Button -> is not displayed on page'});
    
    if(browser.config.useWdioImageComparison) {
      await chaiExpect(await browser.checkElement(await $(splitButton), testFolder+'img_DisabledWarningSplitButton', 
      {hideElements: [await $('//eui-app-toolbar')]})).equal(0, 'Image comparison failed for img_DisabledWarningSplitButton');
    };

    splitButton = page.splitButtonByIndexFromSection(sectionId, 7);
    button = page.buttonCoFromSectionWithIndex(sectionId, 7);
    euiButton = page.euiDropdownCoFromSectionWithIndex(sectionId, 7);

    await expect(await $(splitButton)).toBeDisplayedInViewport({message:'Danger-Split-Button -> is not displayed on page'});
    await expect(await (await button.element())).toBeDisplayedInViewport({message:'Danger-Button -> is not displayed on page'});
    await expect(await (await euiButton.element())).toBeDisplayedInViewport({message:'Danger-Eui-Button -> is not displayed on page'});
    
    if(browser.config.useWdioImageComparison) {
      await chaiExpect(await browser.checkElement(await $(splitButton), testFolder+'img_DisabledDangerSplitButton', 
      {hideElements: [await $('//eui-app-toolbar')]})).equal(0, 'Image comparison failed for img_DisabledDangerSplitButton');
    };

    splitButton = page.splitButtonByIndexFromSection(sectionId, 8);
    button = page.buttonCoFromSectionWithIndex(sectionId, 8);
    euiButton = page.euiDropdownCoFromSectionWithIndex(sectionId, 8);

    await expect(await $(splitButton)).toBeDisplayedInViewport({message:'Accent-Split-Button -> is not displayed on page'});
    await expect(await (await button.element())).toBeDisplayedInViewport({message:'Accent-Button -> is not displayed on page'});
    await expect(await (await euiButton.element())).toBeDisplayedInViewport({message:'Accent-Eui-Button -> is not displayed on page'});
    
    if(browser.config.useWdioImageComparison) {
      await chaiExpect(await browser.checkElement(await $(splitButton), testFolder+'img_DisabledAccentSplitButton', 
      {hideElements: [await $('//eui-app-toolbar')]})).equal(0, 'Image comparison failed for img_DisabledAccentSplitButton');
    };


  });
  it('should verify Outlined split buttons presence and image comparison',async () => {
    browser.addTestMeta({zephyrStep: "445937"});
    let sectionId= 'outline';

    let splitButton = page.splitButtonByIndexFromSection(sectionId, 1);
    let button = page.buttonCoFromSectionWithIndex(sectionId, 1);
    let euiButton = page.euiDropdownCoFromSectionWithIndex(sectionId, 1);

   await expect(await $(splitButton)).toBeDisplayedInViewport({message:'Default-Split-Button -> is not displayed on page'});
   await expect(await (await button.element())).toBeDisplayedInViewport({message:'Default-Button -> is not displayed on page'});
   await expect(await (await euiButton.element())).toBeDisplayedInViewport({message:'Default-Eui-Button -> is not displayed on page'});
    
    if(browser.config.useWdioImageComparison) {
      await chaiExpect(await browser.checkElement(await $(splitButton), testFolder+'img_OutlineDefaultSplitButton', 
      {hideElements: [await $('//eui-app-toolbar')]})).equal(0, 'Image comparison failed for img_OutlineDefaultSplitButton');
    };

    splitButton = page.splitButtonByIndexFromSection(sectionId, 2);
    button = page.buttonCoFromSectionWithIndex(sectionId, 2);
    euiButton = page.euiDropdownCoFromSectionWithIndex(sectionId, 2);

   await expect(await $(splitButton)).toBeDisplayedInViewport({message:'Primary-Split-Button -> is not displayed on page'});
   await expect(await (await button.element())).toBeDisplayedInViewport({message:'Primary-Button -> is not displayed on page'});
   await expect(await (await euiButton.element())).toBeDisplayedInViewport({message:'Primary-Eui-Button -> is not displayed on page'});
    
    if(browser.config.useWdioImageComparison) {
      await chaiExpect(await browser.checkElement(await $(splitButton), testFolder+'img_OutlinePrimarySplitButton', 
      {hideElements: [await $('//eui-app-toolbar')]})).equal(0, 'Image comparison failed for img_OutlinePrimarySplitButton');
    };

    splitButton = page.splitButtonByIndexFromSection(sectionId, 3);
    button = page.buttonCoFromSectionWithIndex(sectionId, 3);
    euiButton = page.euiDropdownCoFromSectionWithIndex(sectionId, 3);

   await expect(await $(splitButton)).toBeDisplayedInViewport({message:'Secondary-Split-Button -> is not displayed on page'});
   await expect(await (await button.element())).toBeDisplayedInViewport({message:'Secondary-Button -> is not displayed on page'});
   await expect(await (await euiButton.element())).toBeDisplayedInViewport({message:'Secondary-Eui-Button -> is not displayed on page'});
    
    if(browser.config.useWdioImageComparison) {
      await chaiExpect(await browser.checkElement(await $(splitButton), testFolder+'img_OutlineSecondarySplitButton', 
      {hideElements: [await $('//eui-app-toolbar')]})).equal(0, 'Image comparison failed for img_OutlineSecondarySplitButton');
    };

    splitButton = page.splitButtonByIndexFromSection(sectionId, 4);
    button = page.buttonCoFromSectionWithIndex(sectionId, 4);
    euiButton = page.euiDropdownCoFromSectionWithIndex(sectionId, 4);

   await expect(await $(splitButton)).toBeDisplayedInViewport({message:'Success-Split-Button -> is not displayed on page'});
   await expect(await (await button.element())).toBeDisplayedInViewport({message:'Success-Button -> is not displayed on page'});
   await expect(await (await euiButton.element())).toBeDisplayedInViewport({message:'Success-Eui-Button -> is not displayed on page'});
    
    if(browser.config.useWdioImageComparison) {
      await chaiExpect(await browser.checkElement(await $(splitButton), testFolder+'img_OutlineSuccessSplitButton', 
      {hideElements: [await $('//eui-app-toolbar')]})).equal(0, 'Image comparison failed for img_OutlineSuccessSplitButton');
    };
    
    splitButton = page.splitButtonByIndexFromSection(sectionId, 5);
    button = page.buttonCoFromSectionWithIndex(sectionId, 5);
    euiButton = page.euiDropdownCoFromSectionWithIndex(sectionId, 5);

   await expect(await $(splitButton)).toBeDisplayedInViewport({message:'Info-Split-Button -> is not displayed on page'});
   await expect(await (await button.element())).toBeDisplayedInViewport({message:'Info-Button -> is not displayed on page'});
   await expect(await (await euiButton.element())).toBeDisplayedInViewport({message:'Info-Eui-Button -> is not displayed on page'});
    
    if(browser.config.useWdioImageComparison) {
      await chaiExpect(await browser.checkElement(await $(splitButton), testFolder+'img_OutlineInfoSplitButton', 
      {hideElements: [await $('//eui-app-toolbar')]})).equal(0, 'Image comparison failed for img_OutlineInfoSplitButton');
    };
    
    splitButton = page.splitButtonByIndexFromSection(sectionId, 6);
    button = page.buttonCoFromSectionWithIndex(sectionId, 6);
    euiButton = page.euiDropdownCoFromSectionWithIndex(sectionId, 6);

   await expect(await $(splitButton)).toBeDisplayedInViewport({message:'Warning-Split-Button -> is not displayed on page'});
   await expect(await (await button.element())).toBeDisplayedInViewport({message:'Warning-Button -> is not displayed on page'});
   await expect(await (await euiButton.element())).toBeDisplayedInViewport({message:'Warning-Eui-Button -> is not displayed on page'});
    
    if(browser.config.useWdioImageComparison) {
      await chaiExpect(await browser.checkElement(await $(splitButton), testFolder+'img_OutlineWarningSplitButton', 
      {hideElements: [await $('//eui-app-toolbar')]})).equal(0, 'Image comparison failed for img_OutlineWarningSplitButton');
    };

    splitButton = page.splitButtonByIndexFromSection(sectionId, 7);
    button = page.buttonCoFromSectionWithIndex(sectionId, 7);
    euiButton = page.euiDropdownCoFromSectionWithIndex(sectionId, 7);

   await expect(await $(splitButton)).toBeDisplayedInViewport({message:'Danger-Split-Button -> is not displayed on page'});
   await expect(await (await button.element())).toBeDisplayedInViewport({message:'Danger-Button -> is not displayed on page'});
   await expect(await (await euiButton.element())).toBeDisplayedInViewport({message:'Danger-Eui-Button -> is not displayed on page'});
    
    if(browser.config.useWdioImageComparison) {
      await chaiExpect(await browser.checkElement(await $(splitButton), testFolder+'img_OutlineDangerSplitButton', 
      {hideElements: [await $('//eui-app-toolbar')]})).equal(0, 'Image comparison failed for img_OutlineDangerSplitButton');
    };
    splitButton = page.splitButtonByIndexFromSection(sectionId, 8);
    button = page.buttonCoFromSectionWithIndex(sectionId, 8);
    euiButton = page.euiDropdownCoFromSectionWithIndex(sectionId, 8);

   await expect(await $(splitButton)).toBeDisplayedInViewport({message:'Accent-Split-Button -> is not displayed on page'});
   await expect(await (await button.element())).toBeDisplayedInViewport({message:'Accent-Button -> is not displayed on page'});
   await expect(await (await euiButton.element())).toBeDisplayedInViewport({message:'Accent-Eui-Button -> is not displayed on page'});
    
    if(browser.config.useWdioImageComparison) {
      await chaiExpect(await browser.checkElement(await $(splitButton), testFolder+'img_OutlineAccentSplitButton', 
      {hideElements: [await $('//eui-app-toolbar')]})).equal(0, 'Image comparison failed for img_OutlineAccentSplitButton');
    };
  });
  it('should verify Sizes split buttons presence and image comparison',async () => {
    browser.addTestMeta({zephyrStep: "445938"});
    await (await $(page.sectionById('outline'))).scrollIntoView();
    let sectionId= 'sizes';

    let splitButton = page.splitButtonByIndexFromSection(sectionId, 1);
    let button = page.buttonCoFromSectionWithIndex(sectionId, 1);
    let euiButton = page.euiDropdownCoFromSectionWithIndex(sectionId, 1);

   await expect(await $(splitButton)).toBeDisplayedInViewport({message:'Primary-Split-Button -> is not displayed on page'});
   await expect(await (await button.element())).toBeDisplayedInViewport({message:'Primary-Button -> is not displayed on page'});
   await expect(await (await euiButton.element())).toBeDisplayedInViewport({message:'Primary-Eui-Button -> is not displayed on page'});
    
    if(browser.config.useWdioImageComparison) {
      await chaiExpect(await browser.checkElement(await $(splitButton), testFolder+'img_SizesSSplitButton', 
      {hideElements: [await $('//eui-app-toolbar')]})).equal(0, 'Image comparison failed for img_SizesSSplitButton');
    };

    splitButton = page.splitButtonByIndexFromSection(sectionId, 2);
    button = page.buttonCoFromSectionWithIndex(sectionId, 2);
    euiButton = page.euiDropdownCoFromSectionWithIndex(sectionId, 2);

   await expect(await $(splitButton)).toBeDisplayedInViewport({message:'Secondary-Split-Button -> is not displayed on page'});
   await expect(await (await button.element())).toBeDisplayedInViewport({message:'Secondary-Button -> is not displayed on page'});
   await expect(await (await euiButton.element())).toBeDisplayedInViewport({message:'Secondary-Eui-Button -> is not displayed on page'});
    
    if(browser.config.useWdioImageComparison) {
      await chaiExpect(await browser.checkElement(await $(splitButton), testFolder+'img_SizesMSplitButton', 
      {hideElements: [await $('//eui-app-toolbar')]})).equal(0, 'Image comparison failed for img_SizesMSplitButton');
    };

    splitButton = page.splitButtonByIndexFromSection(sectionId, 3);
    button = page.buttonCoFromSectionWithIndex(sectionId, 3);
    euiButton = page.euiDropdownCoFromSectionWithIndex(sectionId, 3);

   await expect(await $(splitButton)).toBeDisplayedInViewport({message:'Success-Split-Button -> is not displayed on page'});
   await expect(await (await button.element())).toBeDisplayedInViewport({message:'Success-Button -> is not displayed on page'});
   await expect(await (await euiButton.element())).toBeDisplayedInViewport({message:'Success-Eui-Button -> is not displayed on page'});
    
    if(browser.config.useWdioImageComparison) {
      await chaiExpect(await browser.checkElement(await $(splitButton), testFolder+'img_SizesLSplitButton', 
      {hideElements: [await $('//eui-app-toolbar')]})).equal(0, 'Image comparison failed for img_SizesLSplitButton');
    };
  });
});
