/*
 * Copyright (C) 2019 Robert Bosch GmbH Copyright (C) 2019 Robert Bosch Manufacturing Solutions GmbH, Germany. All rights reserved.
 */

import { DemoPage } from '../../support/app.po';
import { CommandbarPage } from '../../support/commandbar.po';

describe('Filtering in the Commandbar', {retries: {openMode: 2, runMode: 2}}, () => {
  let page: CommandbarPage;
  let app: DemoPage;

  before(() => {
    page = new CommandbarPage();
    app = new DemoPage();
    page.navigateTo();
  });

  beforeEach(() => {
    cy.viewport(1920, 1200);
  });

  describe('The initial setup', () => {
    it('should show the commandbar', () => {
      page.getTableInteractionCommandBar().should('exist');
    });

    it('should only show the unremovable filter', () => {
      page.getAllFilterChips().should('have.length', 1);
      page.getAllFilterChips().should('contain.text', 'Some unremovable filter');
    });

    it('should have 11 entries in the table', () => {
      page.getAllTableRows().should('have.length', 11);
    });

    it('should open the filter modal on click on filter icon', () => {
      // TODO: Commandbar resize not working correctly, therefore the filter button is not shown, because of that, the sidebar is closed, so a resize is triggered
      app.getBurgerElement().click();
      page.openFilterModal();
      page.getFilterModal().should('exist');
      page.getFilterModal().should('be.visible');
    });

    it('should close the filter modal on click on outside area', () => {
      page.clickOnBackdrop();
      page.getFilterModal().should('not.exist');
    });

    it('should open the filter modal on click on filter icon again', () => {
      app.getBurgerElement().click();
      page.openFilterModal();
      page.getFilterModal().should('be.visible');
    });

    it('should close the filter modal on click on close (cross) icon', () => {
      const filterModalCloseButton = page.getFilterModalCloseButton();
      filterModalCloseButton.click();
      page.getFilterModal().should('not.exist');
    });
  });

  describe('The filter modal window', () => {
    before(() => {
      cy.viewport(1920, 1080);
      app.getBurgerElement().click();
      page.openFilterModal();
    });

    describe('The filter list', () => {
      it('should show 5 filters', () => {
        page.getAllDialogFilterEntries().should('have.length', 5);
      });

      it('should have Departments filter selected and its settings displayed on the right side', () => {
        page.getActiveDialogFilterEntry().should('exist');

        page.getTextElementInFilterEntry(page.getActiveDialogFilterEntry()).should('contain.text', 'Departments');

        const selectedFilterView = page.getSelectedFilterView();
        selectedFilterView.should('exist');

        cy.get('mat-dialog-container').click();
        cy.get('mat-dialog-container').click();
        cy.get('mat-dialog-container').click();

        page.getTextElementInFilterEntry(page.getActiveDialogFilterEntry()).click();
        page.getTextElementInFilterEntry(page.getActiveDialogFilterEntry()).click();

        page.getFilterCheckboxes().should('exist');
        page.getFilterCheckboxes().should('be.visible');
        page.getFilterCheckboxes().should('have.length', 5);
      });

      it('should open the filter details for "Filter 1" when it is clicked on in the list', () => {
        page.getDialogFilterEntryAt(1).should('contain.text', 'Filter 1');

        page.getDialogFilterEntryAt(1).click();
        page.getSelectedFilterContent().should('contain.text', 'Filter 1');
      });
    });

    describe('The Departments filter', () => {
      before(() => {
        page.getDialogFilterEntryAt(0).should('contain.text', 'Departments');
        page.getDialogFilterEntryAt(0).click();
        page.getFilterCheckboxes().should('be.visible');
        page.getFilterCheckboxes().should('have.length', 5);
      });

      it('should NOT have any departments selected', () => {
        page
          .getFilterCheckboxes()
          .each((option) => expect(option).to.have.attr('ng-reflect-checked', 'false'));
      });

      it('should activate the filter in the filter list when checkbox is checked', () => {
        page
          .getFilterCheckboxes()
          .first()
          .click()
          .then(() => {
            page.getFilterCheckboxes().first().should('have.attr', 'ng-reflect-checked', 'true');

            page.getActiveIconInFilterEntry(page.getActiveDialogFilterEntry()).should('exist');
            page.getActiveIconInFilterEntry(page.getActiveDialogFilterEntry()).should('be.visible');

            page.getDeleteIconInFilterEntry(page.getActiveDialogFilterEntry()).should('exist');
            page.getDeleteIconInFilterEntry(page.getActiveDialogFilterEntry()).should('be.visible');
          });
      });

      it('should uncheck the checkbox when the garbage can icon in the filter list is clicked', () => {
        page.getDeleteIconInFilterEntry(page.getActiveDialogFilterEntry()).click();
        page.getFilterCheckboxes().first().should('have.attr', 'ng-reflect-checked', 'false');

        page.getActiveIconInFilterEntry(page.getActiveDialogFilterEntry()).should('not.exist');
        page.getDeleteIconInFilterEntry(page.getActiveDialogFilterEntry()).should('not.exist');
      });

      describe('Applying of the Departments filter', () => {
        before(() => {
          page.getFilterCheckboxes().first().click();
        });

        it('should close the modal when "Apply" is clicked', () => {
          page.getFilterModalApplyButton().click();
          page.getFilterModal().should('not.exist');
        });

        it('should display 1 active filter next to the filter icon in the commandbar', () => {
          app.getBurgerElement().click();
          page.getFilterButton().should('contain.text', '(1)');
        });

        it('should show the bci-chip for the Administrators filter', () => {
          page.getDepartmentFilterChip().should('contain.text', 'Departments: Security');
        });

        it('should have 2 entries left in the table', () => {
          page.getAllTableRows().should('have.length', 2);
        });
      });

      describe('Opening the modal with activated filter', () => {
        before(() => {
          cy.viewport(1920, 1200);
          app.getBurgerElement().click();
          page.openFilterModal();
        });

        it('should show the Administrators filter as active', () => {
          page.getActiveIconInFilterEntry(page.getActiveDialogFilterEntry()).should('exist');
          page.getActiveIconInFilterEntry(page.getActiveDialogFilterEntry()).should('be.visible');

          page.getDeleteIconInFilterEntry(page.getActiveDialogFilterEntry()).should('exist');
          page.getDeleteIconInFilterEntry(page.getActiveDialogFilterEntry()).should('be.visible');
        });

        it('should have the checkbox in the filter checked', () => {
          // eslint-disable-next-line cypress/no-unnecessary-waiting
          cy.wait(1000);
          cy.get('.mat-mdc-dialog-container').click();
          page.getFilterCheckboxes().first().should('have.attr', 'ng-reflect-checked', 'true');
        });

        describe('Making changes and reverting them', () => {
          it('should not deactivate the filter if cancel is clicked after the checkbox was unchecked before', () => {
            page.getFilterCheckboxes().first().click();
            page.getFilterCheckboxes().first().should('have.attr', 'ng-reflect-checked', 'false');

            page.getFilterModalCancelButton().click();
            page.getFilterModal().should('not.exist');
            app.getBurgerElement().click(); 

            page.getAllFilterChips().should('have.length', 2);
            page.getDepartmentFilterChip().should('contain.text', 'Departments: Security');

            page.getFilterButton().should('contain.text', '(1)');
            page.getAllTableRows().should('have.length', 2);
          });
        });
      });
    });
  });
});
