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

describe('Web Core - ng-core Demo', () => {
  const paddings = {
    pc: [32, 'pc-normal'],
    tablet: [16, 'tablet-max'],
    mobile: [14, 'mobile-max'],
  } as const;

  before(() => {
    cy.visit('/');
  });

  describe('Content section', () => {
    Object.entries(paddings).forEach(([platform, [px, viewport]]) => {
      it(`should have a padding of ${px}px for the platform ${platform}`, () => {
        cy.commonViewport(viewport);
        cy.get('bci-page-content').should('have.css', 'padding', `${px}px`);
      });
    });
  });

  describe('Header section', () => {
    Object.entries(paddings).forEach(([platform, [px, viewport]]) => {
      it(`should have a padding of ${px}px for the platform ${platform}`, () => {
        cy.commonViewport(viewport);
        // dev hint: in this case padding-left is required, because you need to be specific if the values are different for some corners.
        // see: https://github.com/cypress-io/cypress/issues/9349#issuecomment-788743227
        cy.get('.bci-header-container').should('have.css', 'padding-left', `${px}px`);
      });
    });
  });

  describe('Burger menu', () => {
    const [px, viewport] = paddings.mobile;
    it(`should have a left space of ${px}px`, () => {
      cy.commonViewport(viewport);
      cy.get('mat-sidenav-content>bci-burger').should('have.css', 'left', `${px}px`);
    });
  });
});
