import Routing from '../../../../pages/eui/10x/routing-10x.js'
import ProgressCirclePage from '../../../../pages/eui/10x/ux/ux-progress-circle-10x.po.js'
import CookieBannerActions from '../../../../actions/cookieBanner.js'

describe('eUI - <ux-progress-circle> Component Object', async () => {
  let prCirclePage = new ProgressCirclePage();
  it('should navigate to <ux-progress-circle> component', async () => {
    browser.addTestMeta({uuid:"5e0b53a2-ba17-11eb-8529-0242ac130003", zephyrKey: "CCQA-1049", zephyrStep: "397930", reportGroups: ["eUI.10x.ux"]});
    await prCirclePage.open(Routing.getUxComponentUrl('ux-progress-circle'));
    await CookieBannerActions.cookieBanner(true);
    let pgTitle = await $(prCirclePage.pageTitle);
    let appDocPageId = await $(prCirclePage.appDocPageById('ux-progress-circle'));
    let navigationList = await $(prCirclePage.navigationList);

    await expect(pgTitle).toBeDisplayed({wait:1000, message:'<ux-progress-circle> page title is not visible on page'});
    await expect(pgTitle).toHaveText('ux-progress-circle', {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 verify the visibility and number of component objects <ux-progress-circle> on page', async () => {
    browser.addTestMeta({zephyrStep: "397931"});
    let sectionId= 'Default';
    let scrollIntoSection = await $(prCirclePage.sectionById(sectionId));
    await scrollIntoSection.scrollIntoView();
    await expect(await $(prCirclePage.progressCircleByIndex(1).dataE2E)).toBeDisplayedInViewport({message:'Progress circle by index 1 is not visible on page'});
    await expect(await $(prCirclePage.progressCircleByTextContains('25.5%').dataE2E)).
      toBeDisplayedInViewport({message:'Progress circle by text "25.5%" is not visible on page'});
    await expect(await $(prCirclePage.progressCircleByTextEqualsAndIndex('25.5%', 1).dataE2E)).
     toBeDisplayedInViewport({message:'Progress circle by text "25.5%" and index 1 is not visible on page'});
    await expect(await $$(prCirclePage.progressCircleByIndex(1).byDefault().dataE2E)).toBeElementsArrayOfSize(37);
  });
  it('should verify percentage methods ', async () => {
    browser.addTestMeta({zephyrStep: "397932"});
    let sectionId= 'empty-label';
    let scrollIntoSection = await $(prCirclePage.sectionById(sectionId));
    await scrollIntoSection.scrollIntoView();
    await expect(await $(prCirclePage.progressCircleFromSectionById(sectionId).percentage)).toBeDisplayedInViewport({message:'percentage is not visible on page'});
    await expect(await prCirclePage.progressCircleFromSectionWithIdByIndex(sectionId,1).isSmall()).toBe(true,'isSmall should be true');
    await expect(await prCirclePage.progressCircleFromSectionWithIdByIndex(sectionId,3).isLarge()).toBe(true,'isLarge should be true');
    sectionId = 'Default';
    scrollIntoSection = await $(prCirclePage.sectionById(sectionId));
    await scrollIntoSection.scrollIntoView();
    await expect(await prCirclePage.progressCircleFromSectionWithIdByIndex(sectionId,2).isOver50()).toBe(true,'isOver50 should be true');
   });
   it('should verify isLongLabelOrBottomLabel method', async () => {
    browser.addTestMeta({zephyrStep: "397933"});
    let sectionId= 'Default';
    let scrollIntoSection = await $(prCirclePage.sectionById(sectionId));
    await scrollIntoSection.scrollIntoView();
    await expect(await prCirclePage.progressCircleFromSectionWithIdByIndex(sectionId,3).isLongLabelOrBottomLabel()).
      toBe(true,'isLongLabelOrBottomLabel should be true');
   });
   it('should verify methods: label, labelValue leftHalfClipper, first50Bar, valueBar', async () => {
    browser.addTestMeta({zephyrStep: "397934"});
    let sectionId= 'valueLabel';
    let scrollIntoSection = await $(prCirclePage.sectionById(sectionId));
    await scrollIntoSection.scrollIntoView();
    let circle = prCirclePage.progressCircleFromSectionById(sectionId);
    await expect(await $(circle.label)).
      toBeDisplayedInViewport({message:'label is not visible on page'});
    await expect(await $(circle.labelValue)).
      toBeDisplayedInViewport({message:'labelValue is not visible on page'});
    await expect(await $(circle.leftHalfClipper)).
      toBeDisplayedInViewport({message:'leftHalfClipper is not visible on page'});
    await expect(await $(prCirclePage.progressCircleFromSectionWithIdByIndex(sectionId,3).first50Bar)).
      toBeDisplayedInViewport({message:'first50Bar is not visible on page'});
    await expect(await $(circle.valueBar)).
      toBeDisplayedInViewport({message:'valueBar is not visible on page'});
   });
   it('should verify methods: bottomLabel, bottomLabelValue, isSmallBottomLabel, isLargeBottomLabel  ', async () => {
    browser.addTestMeta({zephyrStep: "397935"});
    let sectionId= 'bottomLabel';
    let scrollIntoSection = await $(prCirclePage.sectionById(sectionId));
    await scrollIntoSection.scrollIntoView();
    let circle = prCirclePage.progressCircleFromSectionById(sectionId);
    await expect(await $(circle.bottomLabel)).
      toBeDisplayedInViewport({message:'bottomLabel is not visible on page'});
    await expect(await $(circle.bottomLabelValue)).
      toBeDisplayedInViewport({message:'bottomLabelValue is not visible on page'});
    await expect(await prCirclePage.progressCircleFromSectionWithIdByIndex(sectionId,1).isSmallBottomLabel()).
      toBe(true,'isSmallBottomLabel should be true');
    await expect(await prCirclePage.progressCircleFromSectionWithIdByIndex(sectionId,3).isLargeBottomLabel()).
      toBe(true,'isLargeBottomLabel should be true');
   });
   it('should verify methods: iconLabel, iconLabelSpan, isSmallIconLabel, isLargeIconLabel ', async () => {
    browser.addTestMeta({zephyrStep: "397936"});
    let sectionId= 'iconLabelClass';
    let scrollIntoSection = await $(prCirclePage.sectionById(sectionId));
    await scrollIntoSection.scrollIntoView();
    let circle = prCirclePage.progressCircleFromSectionById(sectionId);
    await expect(await $(circle.iconLabel)).toBeDisplayedInViewport({message:'iconLabel is not visible on page'});
    await expect(await $(circle.iconLabelSpan)).toBeDisplayedInViewport({message:'iconLabelSpan is not visible on page'});
    await expect(await prCirclePage.progressCircleFromSectionWithIdByIndex(sectionId,1).isSmallIconLabel()).
      toBe(true,'isSmallIconLabel should be true');
    await expect(await prCirclePage.progressCircleFromSectionWithIdByIndex(sectionId,3).isLargeIconLabel()).
      toBe(true,'isLargeIconLabel should be true');
   });
   it('should verify the colorType ', async () => {
    browser.addTestMeta({zephyrStep: "397937"});
    let sectionId= 'colorType';
    let scrollIntoSection = await $(prCirclePage.sectionById(sectionId));
    await scrollIntoSection.scrollIntoView();
    let circle = prCirclePage.progressCircleFromSectionById(sectionId);
    await expect(await $(circle.byIndex(1).percentage)).toHaveAttrContaining('class', 'info');
    await expect(await $(circle.byIndex(2).percentage)).toHaveAttrContaining('class', 'success');
    await expect(await $(circle.byIndex(3).percentage)).toHaveAttrContaining('class', 'warning');
    await expect(await $(circle.byIndex(4).percentage)).toHaveAttrContaining('class', 'danger');
  });
  it('should verify the progress-circle data refresh ', async () => {
    browser.addTestMeta({zephyrStep: "397938"});
    let sectionId= 'data-refresh';
    let scrollIntoSection = await $(prCirclePage.sectionById(sectionId));
    await scrollIntoSection.scrollIntoView();
    let circle = prCirclePage.progressCircleFromSectionById(sectionId);
    await expect(await $(circle.byIndex(1).percentage)).toHaveAttrContaining('class','warning');
    await expect(await $(circle.byIndex(1).percentage)).toHaveAttrContaining('class','p50');
    await (await $(prCirclePage.buttonComponentByTextContains('button').currentPath)).click()
    await expect(await $(circle.byIndex(1).percentage)).toHaveAttrContaining('class','danger ');
    await expect(await $(circle.byIndex(1).percentage)).toHaveAttrContaining('class','p80');
  });

});
