From c7b91fa0ad0f2712ad52327165d75942cb5b1ad9 Mon Sep 17 00:00:00 2001
From: YevheniiaMazur <yevheniia.mazur@valor-software.com>
Date: Thu, 29 Mar 2018 12:08:11 +0300
Subject: [PATCH] fix(tests): change run cypress tests for faster local run.
 Refactor test for making them readable (#3742)

* fix(tests): change run cypress tests for faster local run

* fix(tests): update cypress to latest version

* fix(tests): applying review comments

* fix(tests): update travis.yaml and package-lock.json
---
 .travis.yml                                |   10 +-
 cypress.json                               |    2 +-
 cypress/integration/accordion_page_spec.ts |  156 ---
 cypress/integration/alerts_page_spec.ts    |  150 ---
 cypress/integration/buttons_page_spec.ts   |  128 ---
 cypress/integration/demo_pages_spec.ts     | 1053 ++++++++++++++++++++
 cypress/integration/landing_page_spec.ts   |   67 --
 cypress/support/accordion.po.ts            |   30 +-
 cypress/support/alerts.po.ts               |   39 +-
 cypress/support/base.component.ts          |    4 +
 cypress/support/buttons.po.ts              |   22 +-
 cypress/support/carousel.po.ts             |   17 +
 cypress/support/collapse.po.ts             |   14 +
 cypress/support/datepicker.po.ts           |   26 +
 cypress/support/dropdowns.po.ts            |   18 +
 cypress/support/landing.po.ts              |   14 +-
 cypress/support/modals.po.ts               |   29 +
 cypress/support/pagination.po.ts           |   15 +
 cypress/support/popover.po.ts              |   11 +
 cypress/support/progressbar.po.ts          |   14 +
 cypress/support/rating.po.ts               |   14 +
 cypress/support/sortable.po.ts             |   14 +
 cypress/support/tabs.po.ts                 |   13 +
 cypress/support/timepicker.po.ts           |   13 +
 cypress/support/tooltip.po.ts              |   14 +
 cypress/support/typeahead.po.ts            |   14 +
 package-lock.json                          |  471 +++++----
 package.json                               |    6 +-
 28 files changed, 1638 insertions(+), 740 deletions(-)
 delete mode 100644 cypress/integration/accordion_page_spec.ts
 delete mode 100644 cypress/integration/alerts_page_spec.ts
 delete mode 100644 cypress/integration/buttons_page_spec.ts
 create mode 100644 cypress/integration/demo_pages_spec.ts
 delete mode 100644 cypress/integration/landing_page_spec.ts
 create mode 100644 cypress/support/carousel.po.ts
 create mode 100644 cypress/support/collapse.po.ts
 create mode 100644 cypress/support/datepicker.po.ts
 create mode 100644 cypress/support/dropdowns.po.ts
 create mode 100644 cypress/support/modals.po.ts
 create mode 100644 cypress/support/pagination.po.ts
 create mode 100644 cypress/support/popover.po.ts
 create mode 100644 cypress/support/progressbar.po.ts
 create mode 100644 cypress/support/rating.po.ts
 create mode 100644 cypress/support/sortable.po.ts
 create mode 100644 cypress/support/tabs.po.ts
 create mode 100644 cypress/support/timepicker.po.ts
 create mode 100644 cypress/support/tooltip.po.ts
 create mode 100644 cypress/support/typeahead.po.ts

diff --git a/.travis.yml b/.travis.yml
index 0a4577c561..39e1a79374 100644
--- a/.travis.yml
+++ b/.travis.yml
@@ -89,13 +89,9 @@ jobs:
 
 #     test cypress
     - stage: cypress-tests
-      env: URL=http://localhost:3000/
-      before_script:
-      - npm run build:dynamic
-      - node  ./demo/dist/server.js &
-      - sleep 3
-      script:
-      - CYPRESS_baseUrl=$URL npm run cy:run -- --config videoRecording=false
+      env: URL=localhost:4200/#
+      before_script: ng serve --prod &
+      script: $(npm bin)/wait-on http-get://$URL && npm run cy:run
 
 #    check prod build
     - &build
diff --git a/cypress.json b/cypress.json
index 6e79641037..35631076f0 100644
--- a/cypress.json
+++ b/cypress.json
@@ -1,3 +1,3 @@
 {
-  "baseUrl": "http://localhost:4400/#"
+  "baseUrl": "http://localhost:4200/#"
 }
diff --git a/cypress/integration/accordion_page_spec.ts b/cypress/integration/accordion_page_spec.ts
deleted file mode 100644
index d9e6dc105d..0000000000
--- a/cypress/integration/accordion_page_spec.ts
+++ /dev/null
@@ -1,156 +0,0 @@
-import { AccordionPo } from '../support/accordion.po';
-
-describe('Accordion page test suite', () => {
-  const accordion = new AccordionPo();
-  const accordionExamples = accordion.accordionDemosArr;
-
-  beforeEach(() => accordion.navigateTo());
-
-  it('accordion page loads and displays it\'s content', () => {
-    cy.get('.content')
-      .should('be.visible');
-  });
-
-  it('content header contains title and link to accordion component at github', () => {
-    cy.get('.content-header').children('h1').as('title')
-      .should('be.visible')
-      .and('to.contain', accordion.pageTitle);
-
-    cy.get('@title').children('a')
-      .should('be.enabled')
-      .and('have.attr', 'href', accordion.ghLinkToComponent);
-  });
-
-  it('usage code example is displayed at demo top section', () => {
-    cy.get('demo-top-section').as('demoTop').children('h2')
-      .should('be.visible')
-      .and('to.contain', accordion.titleDefaultExample);
-
-    cy.get('@demoTop').children('.prettyprint')
-      .should('be.visible')
-      .and('not.to.be.empty');
-  });
-
-  it('each panel at simple accordion opens content at first click', () => {
-    cy.get(accordionExamples[0]).children('.panel-group').children('.panel').each(($panel, i) => {
-      accordion.getAccordionPanel(accordionExamples[0], i).as('currPanel').click();
-
-      cy.get('@currPanel')
-        .should('have.class', 'panel-open');
-    });
-  });
-
-  it('double click leaves all panels closed at simple accordion', () => {
-    cy.get(accordionExamples[0]).children('.panel-group').children('.panel').each(($panel, i) => {
-      accordion.getAccordionPanel(accordionExamples[0], i).as('currPanel').dblclick();
-
-      cy.get('@currPanel')
-        .should('not.have.class', 'panel-open');
-    });
-  });
-
-  it('first panel can be disabled or enabled at disabled example', () => {
-    accordion.clickByText(accordionExamples[1], accordion.buttonEnableDisable);
-
-    accordion.getAccordionPanel(accordionExamples[1], 0).as('firstPanel').find('.text-muted')
-      .should('to.be.exist');
-
-    accordion.clickByText(accordionExamples[1], accordion.buttonEnableDisable);
-
-    cy.get('@firstPanel').find('.text-muted')
-      .should('not.to.be.exist');
-  });
-
-  it('last panel can be controlled by toggler button at dynamic example', () => {
-    accordion.clickByText(accordionExamples[4], accordion.buttonPanelToggler);
-
-    accordion.getAccordionPanel(accordionExamples[4], 2).as('dynamicPanel')
-      .should('not.have.class', 'panel-open');
-
-    accordion.clickByText(accordionExamples[4], accordion.buttonPanelToggler);
-
-    cy.get('@dynamicPanel')
-      .should('have.class', 'panel-open');
-  });
-
-  it('items in collapse-panel can be added dynamic at dynamic example', () => {
-    accordion.getAccordionPanel(accordionExamples[3], 0).as('dynamicItemsPanel').click();
-
-    cy.get('@dynamicItemsPanel').find('.panel-body').children('div')
-      .should('have.length', 3);
-
-    accordion.clickByText('@dynamicItemsPanel', accordion.buttonAddItem);
-
-    cy.get('@dynamicItemsPanel').find('.panel-body').children('div')
-      .should('have.length', 4);
-  });
-
-  it('open only one panel at a time if closeOthers property sets as true', () => {
-    cy.get(accordionExamples[5]).find('input').check();
-
-    accordion.getAccordionPanel(accordionExamples[5], 0).as('firstPanel').click()
-      .should('have.class', 'panel-open');
-    accordion.getAccordionPanel(accordionExamples[5], 1).as('secondPanel')
-      .should('not.have.class', 'panel-open');
-    accordion.getAccordionPanel(accordionExamples[5], 2).as('thirdPanel')
-      .should('not.have.class', 'panel-open');
-
-    cy.get('@thirdPanel').click()
-      .should('have.class', 'panel-open');
-    cy.get('@firstPanel')
-      .should('not.have.class', 'panel-open');
-    cy.get('@secondPanel')
-      .should('not.have.class', 'panel-open');
-  });
-
-  it('other panels are not closed if closeOthers property sets as false', () => {
-    cy.get(accordionExamples[5]).find('input').uncheck();
-
-    accordion.getAccordionPanel(accordionExamples[5], 0).as('firstPanel').click()
-      .should('have.class', 'panel-open');
-    accordion.getAccordionPanel(accordionExamples[5], 1).as('secondPanel')
-      .should('not.have.class', 'panel-open');
-    accordion.getAccordionPanel(accordionExamples[5], 2).as('thirdPanel')
-      .should('not.have.class', 'panel-open');
-
-    cy.get('@thirdPanel').click()
-      .should('have.class', 'panel-open');
-    cy.get('@firstPanel')
-      .should('have.class', 'panel-open');
-    cy.get('@secondPanel')
-      .should('not.have.class', 'panel-open');
-  });
-
-  it('first and third panel at styling accordion contains customClass style', () => {
-    const stylesPanel = ['rgb(91, 192, 222)', 'rgb(255, 255, 255)'];
-    const stylePanelBody = 'rgb(51, 122, 167)';
-
-    accordion.getAccordionPanel(accordionExamples[6], 0).children('.card').as('firstPanel')
-      .should('to.have.css', 'background-color', stylesPanel[0])
-      .and('to.have.css', 'color', stylesPanel[1]);
-    cy.get('@firstPanel').find('.panel-body')
-      .should('to.have.css', 'background-color', stylePanelBody);
-
-    accordion.getAccordionPanel(accordionExamples[6], 2).children('.card').as('thirdPanel')
-      .should('to.have.css', 'background-color', stylesPanel[0])
-      .and('to.have.css', 'color', stylesPanel[1]);
-    cy.get('@thirdPanel').find('.panel-body')
-      .should('to.have.css', 'background-color', stylePanelBody);
-  });
-
-  it('configuring defaults example opens only one panel at a time', () => {
-    accordion.getAccordionPanel(accordionExamples[5], 0).as('firstPanel').click()
-      .should('have.class', 'panel-open');
-    accordion.getAccordionPanel(accordionExamples[5], 1).as('secondPanel')
-      .should('not.have.class', 'panel-open');
-    accordion.getAccordionPanel(accordionExamples[5], 2).as('thirdPanel')
-      .should('not.have.class', 'panel-open');
-
-    cy.get('@secondPanel').click()
-      .should('have.class', 'panel-open');
-    cy.get('@firstPanel')
-      .should('not.have.class', 'panel-open');
-    cy.get('@thirdPanel')
-      .should('not.have.class', 'panel-open');
-  });
-});
diff --git a/cypress/integration/alerts_page_spec.ts b/cypress/integration/alerts_page_spec.ts
deleted file mode 100644
index b9d3fb8563..0000000000
--- a/cypress/integration/alerts_page_spec.ts
+++ /dev/null
@@ -1,150 +0,0 @@
-import { AlertsPo } from '../support/alerts.po';
-
-describe('Alerts page test suite', () => {
-  const alerts = new AlertsPo();
-  const alertsDemos = alerts.exampleDemosArr;
-
-  let alertTypes: string[];
-  let stylesColors: string[];
-
-  beforeEach(() => alerts.navigateTo());
-
-  it('alerts page loads and displays it\'s content', () => {
-    cy.get('.content')
-      .should('be.visible');
-  });
-
-  it('content header contains title and link to accordion component at github', () => {
-    cy.get('.content-header').children('h1').as('title')
-      .should('be.visible')
-      .and('to.contain', alerts.pageTitle);
-
-    cy.get('@title').children('a')
-      .should('be.enabled')
-      .and('have.attr', 'href', alerts.ghLinkToComponent);
-  });
-
-  it('usage code example is displayed at demo top section', () => {
-    cy.get('demo-top-section').as('demoTop').children('h2')
-      .should('be.visible')
-      .and('to.contain', alerts.titleDefaultExample);
-
-    cy.get('@demoTop').children('.prettyprint')
-      .should('be.visible')
-      .and('not.to.be.empty');
-  });
-
-  it('basic alert example displays success, info, warning and danger types of alerts', () => {
-    alertTypes = [
-      'alert-success',
-      'alert-info',
-      'alert-warning',
-      'alert-danger'
-    ];
-
-    cy.get(alertsDemos[0]).find('div').as('alertsBasic').each(($alert, i) => {
-      expect($alert).to.have.class(alertTypes[i]);
-      cy.get('@alertsBasic').eq(i)
-        .should('be.visible');
-    });
-  });
-
-  it('link in alerts can be provided by class alert-link', () => {
-    cy.get(alertsDemos[1]).find('div').as('alertsLink').each(() => {
-      cy.get('@alertsLink').find(alerts.linkClass)
-        .should('have.attr', 'href', '#');
-    });
-  });
-
-  it('alert with additional content contains html elements', () => {
-    cy.get(alertsDemos[2]).find('div')
-      .should('to.have.descendants', 'h4')
-      .and('to.have.descendants', 'p');
-  });
-
-  it('alerts in dismissing example can stop being dismissible', () => {
-    cy.get(alertsDemos[3]).find('alert').as('dismissAlert').last()
-      .should('to.have.descendants', '.close');
-
-    alerts.clickByText(alertsDemos[3], alerts.buttonToggler);
-    cy.get('@dismissAlert').last()
-      .should('not.to.have.descendants', '.close');
-  });
-
-  it('alerts in dismissible example can all be closed and then resetting to default state', () => {
-    cy.get(alertsDemos[3]).find('alert').as('dismissAlert').each(($alert) => {
-      $alert.find('.close').click();
-    });
-
-    cy.get('@dismissAlert')
-      .should('not.to.have.descendants', 'div');
-
-    alerts.clickByText(alertsDemos[3], alerts.buttonReset);
-    cy.get('@dismissAlert')
-      .should('to.have.descendants', 'div');
-  });
-
-  it('alerts in dynamic html example contains style and content from component', () => {
-    alertTypes = [
-      'alert-success',
-      'alert-info',
-      'alert-danger'
-    ];
-
-    cy.get(alertsDemos[4]).find('alert').children('div').as('alertsDynamic').each(($alert, i) => {
-      expect($alert).to.have.class(alertTypes[i]);
-      cy.get('@alertsDynamic').eq(i)
-        .should('be.visible')
-        .and('to.have.descendants', 'span');
-    });
-  });
-
-  it('dynamic content in alerts can be changed by click on button', () => {
-    cy.get(alertsDemos[5]).find('.alert').as('alertDynamicText')
-      .should('to.contain', alerts.dynamicAlertText[0]);
-
-    alerts.clickByText(alertsDemos[5], alerts.buttonChangeText);
-    cy.get('@alertDynamicText')
-      .should('to.contain', alerts.dynamicAlertText[1])
-      .and('not.to.contain', alerts.dynamicAlertText[0]);
-
-    alerts.clickByText(alertsDemos[5], alerts.buttonChangeText);
-    cy.get('@alertDynamicText')
-      .should('to.contain', alerts.dynamicAlertText[2]);
-
-    alerts.clickByText(alertsDemos[5], alerts.buttonReset);
-    cy.get('@alertDynamicText')
-      .should('to.contain', alerts.dynamicAlertText[0])
-      .and('not.to.contain', alerts.dynamicAlertText[2]);
-  });
-
-  it('alert with global style has added style', () => {
-    stylesColors = ['rgb(123, 31, 162)', 'rgb(74, 20, 140)', 'rgb(255, 255, 255)'];
-
-    cy.get(alertsDemos[7]).find('.alert')
-      .should('to.have.css', 'background-color', stylesColors[0])
-      .and('to.have.css', 'border-color', stylesColors[1])
-      .and('to.have.css', 'color', stylesColors[2]);
-  });
-
-  it('alert with component level styling has added style', () => {
-    stylesColors = ['rgb(0, 150, 136)', 'rgb(0, 105, 92)', 'rgb(255, 255, 255)'];
-
-    cy.get(alertsDemos[8]).find('.alert')
-      .should('to.have.css', 'background-color', stylesColors[0])
-      .and('to.have.css', 'border-color', stylesColors[1])
-      .and('to.have.css', 'color', stylesColors[2]);
-  });
-
-  it('alerts with preconfigured defaults have added config', () => {
-    alertTypes = [
-      'alert-success',
-      'alert-info'
-    ];
-
-    cy.get(alertsDemos[9]).find('.alert').as('configuredAlerts').eq(0)
-      .should('to.have.class', alertTypes[0]);
-    cy.get('@configuredAlerts').eq(1)
-      .should('to.have.class', alertTypes[1]);
-  });
-});
diff --git a/cypress/integration/buttons_page_spec.ts b/cypress/integration/buttons_page_spec.ts
deleted file mode 100644
index f3106cda8b..0000000000
--- a/cypress/integration/buttons_page_spec.ts
+++ /dev/null
@@ -1,128 +0,0 @@
-import { ButtonsPo } from '../support/buttons.po';
-
-describe('Buttons page test suite', () => {
-  const buttons = new ButtonsPo();
-  const buttonDemos = buttons.exampleDemosArr;
-
-  const buttonNames = ['Left', 'Middle', 'Right'];
-  const buttonOutput = ['left', 'middle', 'right'];
-
-  beforeEach(() => buttons.navigateTo());
-
-  it('buttons page loads and displays it\'s content', () => {
-    cy.get('.content')
-      .should('be.visible');
-  });
-
-  it('content header contains title and link to button component at github', () => {
-    cy.get('.content-header').children('h1').as('title')
-      .should('be.visible')
-      .and('to.contain', buttons.pageTitle);
-
-    cy.get('@title').children('a')
-      .should('be.enabled')
-      .and('have.attr', 'href', buttons.ghLinkToComponent);
-  });
-
-  it('usage code example is displayed at demo top section', () => {
-    cy.get('demo-top-section').as('demoTop').children('h2')
-      .should('be.visible')
-      .and('to.contain', buttons.titleDefaultExample);
-
-    cy.get('@demoTop').children('.prettyprint')
-      .should('be.visible')
-      .and('not.to.be.empty');
-  });
-
-  it('basic button example contains  only enabled single button', () => {
-    cy.get(buttonDemos[0]).children('button')
-      .should('to.be.enabled');
-  });
-
-
-  it('checkbox example contains checkboxes, that can be checked or unchecked', () => {
-    buttons.clickByText(buttonDemos[1], buttonNames[0]);
-    buttons.clickByText(buttonDemos[1], buttonNames[1]);
-
-    cy.get(buttonDemos[1]).children('.card-header').as('output')
-      .should('to.contain', `"${buttonOutput[0]}": true`);
-    cy.get('@output')
-      .should('to.contain', `"${buttonOutput[1]}": false`);
-  });
-
-  it('custom checkbox value can be displayed in output', () => {
-    const defaultVal = '1';
-    const afterClickVal = '0';
-
-    cy.get(buttonDemos[6]).as('customCheckbox').children('.card-header').as('header')
-      .should('to.contain', defaultVal);
-
-    cy.get('@customCheckbox').children('button').click();
-    cy.get('@header')
-      .should('to.contain', afterClickVal);
-  });
-
-  it('checkbox example contains checkboxes, that can be checked or unchecked', () => {
-    buttons.clickByText(buttonDemos[1], buttonNames[0]);
-    buttons.clickByText(buttonDemos[1], buttonNames[1]);
-
-    cy.get(buttonDemos[1]).children('.card-header').as('output')
-      .should('to.contain', `"${buttonOutput[0]}": true`);
-    cy.get('@output')
-      .should('to.contain', `"${buttonOutput[1]}": false`);
-  });
-
-  it('checkbox example contains checkboxes, that can be checked or unchecked and reactive form', () => {
-    buttons.clickByText(buttonDemos[2], buttonNames[1]);
-    buttons.clickByText(buttonDemos[2], buttonNames[2]);
-
-    cy.get(buttonDemos[2]).children('.card-header').as('output')
-      .should('to.contain', `"${buttonOutput[1]}": false`);
-    cy.get('@output')
-      .should('to.contain', `"${buttonOutput[2]}": true`);
-
-    buttons.clickByText(buttonDemos[2], buttonNames[1]);
-    cy.get('@output')
-      .should('to.contain', `"${buttonOutput[1]}": true`);
-  });
-
-  it('Radio and Uncheckable Radio example contains checkboxes and radioButtons', () => {
-    cy.get(buttonDemos[3]).as('radioUncheckRadio').find('.btn-group').as('allRadios').eq(0).as('radioBtnNgModel');
-    cy.get('@allRadios').eq(1).as('radioBtn');
-    cy.get('@allRadios').eq(2).as('uncheckableRadio');
-
-    cy.get('@radioBtnNgModel').find('.btn').eq(0).click();
-    cy.get('@radioUncheckRadio').children('.card-header').as('formOutput').should('to.contain', 'Left');
-
-    cy.get('@radioBtn').find('.btn').eq(1).click();
-    cy.get('@formOutput').should('to.contain', 'Middle');
-
-    cy.get('@uncheckableRadio').find('.btn').eq(2).click();
-    cy.get('@formOutput').should('to.contain', 'Right');
-
-    cy.get('@uncheckableRadio').find('.btn').eq(2).click();
-    cy.get('@formOutput').should('to.contain', 'null');
-  });
-
-  it('radio example should dynamicly update reactive form', () => {
-    const val = ['A', 'B', 'C'];
-
-    cy.get(buttonDemos[4]).as('radioReactiveForms').find('label').as('radioBtn').each(($radioBtn, i) => {
-      cy.get('@radioBtn').eq(i).click();
-
-      cy.get('@radioReactiveForms').children('.card-header')
-        .should('to.contain', `"radio": "${val[i]}"`);
-    });
-  });
-
-  it('disabled buttons examples contains button, that can be disabled', () => {
-    cy.get(buttonDemos[5]).as('disabledButton')
-      .should('to.have.descendants', '.btn-primary')
-      .and('to.have.descendants', '.btn-warning');
-
-    buttons.clickByText(buttonDemos[5], 'Enable/Disable');
-
-    cy.get('@disabledButton').contains('Button')
-      .should('not.to.be.enabled');
-  });
-});
diff --git a/cypress/integration/demo_pages_spec.ts b/cypress/integration/demo_pages_spec.ts
new file mode 100644
index 0000000000..d453423f9a
--- /dev/null
+++ b/cypress/integration/demo_pages_spec.ts
@@ -0,0 +1,1053 @@
+import { AccordionPo } from '../support/accordion.po';
+import { AlertsPo } from '../support/alerts.po';
+import { ButtonsPo } from '../support/buttons.po';
+import { CarouselPo } from '../support/carousel.po';
+import { CollapsePo } from '../support/collapse.po';
+import { DatepickerPo } from '../support/datepicker.po';
+import { DropdownsPo } from '../support/dropdowns.po';
+import { LandingPo } from '../support/landing.po';
+import { ModalsPo } from '../support/modals.po';
+import { PaginationPo } from '../support/pagination.po';
+import { PopoverPo } from '../support/popover.po';
+import { ProgressbarPo } from '../support/progressbar.po';
+import { RatingPo } from '../support/rating.po';
+import { SortablePo } from '../support/sortable.po';
+import { TabsPo } from '../support/tabs.po';
+import { TimepickerPo } from '../support/timepicker.po';
+import { TooltipPo } from '../support/tooltip.po';
+import { TypeaheadPo } from '../support/typeahead.po';
+
+describe('Component content displaying test suite', () => {
+  const componentsArray = [
+    new AccordionPo(),
+    new AlertsPo(),
+    new ButtonsPo(),
+    new CarouselPo(),
+    new CollapsePo(),
+    new DatepickerPo(),
+    new DropdownsPo(),
+    new ModalsPo(),
+    new PaginationPo(),
+    new PopoverPo(),
+    new RatingPo(),
+    new SortablePo(),
+    new TabsPo(),
+    new TimepickerPo(),
+    new TooltipPo(),
+    new TypeaheadPo()
+  ];
+
+  it('each page loads and displays it\'s title with link in it and usage example', () => {
+    componentsArray.forEach(page => {
+      page.navigateTo();
+
+      cy.get(page.titleSel)
+        .should('be.visible')
+        .and('to.contain', page.pageTitle);
+
+      cy.get(page.titleLinkSel)
+        .should('be.enabled')
+        .and('have.attr', 'href', page.ghLinkToComponent);
+
+      cy.get(page.usageExSel)
+        .should('be.visible')
+        .and('to.contain', page.titleDefaultExample);
+
+      cy.get(page.usageExCodeSel)
+        .should('be.visible')
+        .and('not.to.be.empty');
+    });
+  });
+});
+
+describe('Accordion page test suite', () => {
+  const accordion = new AccordionPo();
+
+  beforeEach(() => accordion.navigateTo());
+
+  describe('Basic accordion', () => {
+    const basicDemo = accordion.exampleDemosArr.basic;
+
+    it('panels open content at first click', () => {
+      accordion.getAccordionPanel(basicDemo, 0).as('firstPanel')
+        .click();
+
+      cy.get('@firstPanel')
+        .should('have.class', accordion.openClass);
+
+      accordion.getAccordionPanel(basicDemo, 3).as('fourthPanel')
+        .click();
+
+      cy.get('@fourthPanel')
+        .should('have.class', accordion.openClass);
+    });
+
+    it('after double click panels are closed', () => {
+      accordion.getAccordionPanel(basicDemo, 0).as('firstPanel')
+        .dblclick();
+      accordion.getAccordionPanel(basicDemo, 1).as('secondPanel')
+        .dblclick();
+
+      cy.get('@firstPanel')
+        .should('not.to.have.class', accordion.openClass);
+      cy.get('@secondPanel')
+        .should('not.to.have.class', accordion.openClass);
+    });
+  });
+
+  describe('Disabled accordion', () => {
+    const disabledDemo = accordion.exampleDemosArr.disabled;
+    const buttonEnableDisable = 'Enable / Disable first panel';
+
+    it('first panel can be disabled or enabled', () => {
+      accordion.clickByText(disabledDemo, buttonEnableDisable);
+
+      accordion.getAccordionPanel(disabledDemo, 0).as('firstPanel').find(accordion.disabledPanelText)
+        .should('to.be.exist');
+
+      accordion.clickByText(disabledDemo, buttonEnableDisable);
+
+      cy.get('@firstPanel').find(accordion.disabledPanelText)
+        .should('not.to.be.exist');
+    });
+  });
+
+  describe('Dynamic accordion', () => {
+    const dynamicDemo = accordion.exampleDemosArr.dynamicAccGroup;
+    const buttonAddGroup = 'Add Group Item';
+
+    it('new accordion group can be added by click on button', () => {
+      cy.get(`${ dynamicDemo } accordion-group`).as('arrPanels')
+        .should('have.length', 2);
+      accordion.clickByText(dynamicDemo, buttonAddGroup);
+      cy.get('@arrPanels')
+        .should('have.length', 3);
+    });
+  });
+
+  describe('Dynamic body content', () => {
+    const dynamicBody = accordion.exampleDemosArr.dynamicBody;
+    const buttonAddItem = 'Add';
+
+    it('items in first collapse-panel can be added dynamic', () => {
+      accordion.getAccordionPanel(dynamicBody, 0).as('dynamicItemsPanel').click();
+
+      cy.get('@dynamicItemsPanel').find('.panel-body div')
+        .should('have.length', 3);
+
+      accordion.clickByText('@dynamicItemsPanel', buttonAddItem);
+
+      cy.get('@dynamicItemsPanel').find('.panel-body div')
+        .should('have.length', 4);
+    });
+  });
+
+  describe('Manual toggle', () => {
+    const manualToggle = accordion.exampleDemosArr.manualToggle;
+    const buttonPanelToggler = 'Toggle last panel';
+
+    it('last panel can be controlled by toggler button', () => {
+      accordion.clickByText(manualToggle, buttonPanelToggler);
+
+      accordion.getAccordionPanel(manualToggle, 2).as('dynamicPanel')
+        .should('not.have.class', accordion.openClass);
+
+      accordion.clickByText(manualToggle, buttonPanelToggler);
+
+      cy.get('@dynamicPanel')
+        .should('have.class', accordion.openClass);
+    });
+  });
+
+  describe('Open only one at a time', () => {
+    const onePanelDemo = accordion.exampleDemosArr.oneAtATime;
+
+    it('closeOthers property sets as true - only one panel can be opened at a time', () => {
+      cy.get(onePanelDemo).find('input').check();
+
+      accordion.getAccordionPanel(onePanelDemo, 0).as('firstPanel').click()
+        .should('have.class', accordion.openClass);
+      accordion.getAccordionPanel(onePanelDemo, 1).as('secondPanel')
+        .should('not.have.class', accordion.openClass);
+      accordion.getAccordionPanel(onePanelDemo, 2).as('thirdPanel')
+        .should('not.have.class', accordion.openClass);
+
+      cy.get('@thirdPanel').click();
+
+      cy.get('@thirdPanel')
+        .should('have.class', accordion.openClass);
+      cy.get('@firstPanel')
+        .should('not.have.class', accordion.openClass);
+      cy.get('@secondPanel')
+        .should('not.have.class', accordion.openClass);
+    });
+
+    it('closeOthers property sets as false - not only one panel can be opened at a time', () => {
+      cy.get(onePanelDemo).find('input').uncheck();
+
+      accordion.getAccordionPanel(onePanelDemo, 0).as('firstPanel').click()
+        .should('have.class', accordion.openClass);
+      accordion.getAccordionPanel(onePanelDemo, 1).as('secondPanel')
+        .should('not.have.class', accordion.openClass);
+      accordion.getAccordionPanel(onePanelDemo, 2).as('thirdPanel')
+        .should('not.have.class', accordion.openClass);
+
+      cy.get('@thirdPanel').click();
+      cy.get('@thirdPanel')
+        .should('have.class', accordion.openClass);
+      cy.get('@firstPanel')
+        .should('have.class', accordion.openClass);
+      cy.get('@secondPanel')
+        .should('not.have.class', accordion.openClass);
+    });
+  });
+
+  describe('Styling accordion', () => {
+    const stylingDemo = accordion.exampleDemosArr.styling;
+
+    it('first and third panel contains customClass style', () => {
+      const stylesPanel = [
+        'rgb(91, 192, 222)', // light blue (malibu)
+        'rgb(255, 255, 255)' // white
+      ];
+      const stylePanelBody = 'rgb(51, 122, 167)'; // dark blue (lochmara)
+
+      accordion.getAccordionPanel(stylingDemo, 0).find(accordion.panelCard).as('firstPanel')
+        .should('to.have.css', 'background-color', stylesPanel[0])
+        .and('to.have.css', 'color', stylesPanel[1]);
+      cy.get('@firstPanel').find(accordion.panelBody)
+        .should('to.have.css', 'background-color', stylePanelBody);
+
+      accordion.getAccordionPanel(stylingDemo, 2).find(accordion.panelCard).as('thirdPanel')
+        .should('to.have.css', 'background-color', stylesPanel[0])
+        .and('to.have.css', 'color', stylesPanel[1]);
+      cy.get('@thirdPanel').find(accordion.panelBody)
+        .should('to.have.css', 'background-color', stylePanelBody);
+    });
+  });
+
+  describe('Configuring defaults', () => {
+    const configDemo = accordion.exampleDemosArr.config;
+
+    it('example opens only one panel at a time', () => {
+      accordion.getAccordionPanel(configDemo, 0).as('firstPanel').click()
+        .should('have.class', accordion.openClass);
+      accordion.getAccordionPanel(configDemo, 1).as('secondPanel')
+        .should('not.have.class', accordion.openClass);
+      accordion.getAccordionPanel(configDemo, 2).as('thirdPanel')
+        .should('not.have.class', accordion.openClass);
+
+      cy.get('@secondPanel').click()
+        .should('have.class', accordion.openClass);
+      cy.get('@firstPanel')
+        .should('not.have.class', accordion.openClass);
+      cy.get('@thirdPanel')
+        .should('not.have.class', accordion.openClass);
+    });
+  });
+});
+
+describe('Alerts page test suite', () => {
+  const alerts = new AlertsPo();
+
+  beforeEach(() => alerts.navigateTo());
+
+  describe('Basic', () => {
+    const basicDemo = alerts.exampleDemosArr.basic;
+    const alertTypes = [
+      'alert-success',
+      'alert-info',
+      'alert-warning',
+      'alert-danger'
+    ];
+
+    it('success, info, warning and danger types of alerts are displayed', () => {
+      alertTypes.forEach(type => cy.get(`${ basicDemo } .${ type }`)
+        .should('be.visible'));
+    });
+  });
+
+  describe('Link color', () => {
+    const linkDemo = alerts.exampleDemosArr.link;
+    const alertTypes = [
+      'alert-success',
+      'alert-info',
+      'alert-warning',
+      'alert-danger'
+    ];
+
+    it('links can be provided by class alert-link', () => {
+      alertTypes.forEach(type => cy.get(`${ linkDemo } .${ type }`).find(alerts.linkClass)
+        .should('have.attr', 'href', '#'));
+    });
+  });
+
+  describe('Additional content', () => {
+    const contentDemo = alerts.exampleDemosArr.content;
+
+    it('alert with additional content contains html elements', () => {
+      cy.get(contentDemo).find(alerts.alertClass)
+        .should('to.have.descendants', 'h4')
+        .and('to.have.descendants', 'p')
+        .and('to.have.descendants', alerts.heading);
+    });
+  });
+
+  describe('Dismissing', () => {
+    const dismissingDemo = alerts.exampleDemosArr.dismissing;
+    const alertTypes = [
+      'alert-success',
+      'alert-info',
+      'alert-danger'
+    ];
+    const buttonToggler = 'Toggle dismissible';
+    const buttonReset = 'Reset';
+
+    it('alerts can stop being dismissible', () => {
+      cy.get(dismissingDemo).find(alerts.alertClass).last().as('dismissAlert')
+        .should('to.have.descendants', alerts.dismissOption);
+
+      alerts.clickByText(dismissingDemo, buttonToggler);
+      cy.get('@dismissAlert')
+        .should('not.to.have.descendants', alerts.dismissOption);
+
+      alerts.clickByText(dismissingDemo, buttonToggler);
+      cy.get('@dismissAlert')
+        .should('to.have.descendants', alerts.dismissOption);
+    });
+
+    it('alerts can all be closed and then resetting to default state', () => {
+      alertTypes.forEach(type => {
+        cy.get(`${ dismissingDemo } .${ type } ${alerts.dismissOption}`).click();
+        cy.get(`${ dismissingDemo } .${ type }`)
+          .should('not.to.exist');
+      });
+
+      alerts.clickByText(dismissingDemo, buttonReset);
+      alertTypes.forEach(type => cy.get(`${ dismissingDemo } .${ type }`)
+        .should('to.exist'));
+    });
+  });
+
+  describe('Dynamic html', () => {
+    const dynamicHtml = alerts.exampleDemosArr.dynamicHtml;
+    const alertTypes = [
+      'alert-success',
+      'alert-info',
+      'alert-danger'
+    ];
+
+    it('each alert contains style and content from component', () => {
+      alertTypes.forEach(type => cy.get(`${ dynamicHtml} .${ type }`)
+        .should('be.visible')
+        .and('to.have.descendants', alerts.textWrapper));
+    });
+  });
+
+  describe('Dynamic content', () => {
+    const dynamicContent = alerts.exampleDemosArr.dynamicContent;
+    const dynamicAlertText = [
+      'You successfully read this important alert message.',
+      'Now this text is different from what it was before. Go ahead and click the button one more time',
+      'Well done! Click reset button'
+    ];
+
+    it('alert\'s content can be changed dynamicly', () => {
+      dynamicAlertText.forEach(text => {
+        cy.get(dynamicContent).find(alerts.alertClass)
+          .should('to.contain', text);
+        cy.get(dynamicContent).find('button').click();
+      });
+    });
+  });
+
+  describe('Global styling', () => {
+    const globalStyle = alerts.exampleDemosArr.globalStyling;
+    const stylesColors = [
+      'rgb(123, 31, 162)', // violet
+      'rgb(74, 20, 140)', // indigo
+      'rgb(255, 255, 255)' // white
+    ];
+
+    it('alert is displayed with added style', () => {
+      cy.get(globalStyle).find(alerts.alertClass)
+        .should('to.have.css', 'background-color', stylesColors[0])
+        .and('to.have.css', 'border-color', stylesColors[1])
+        .and('to.have.css', 'color', stylesColors[2]);
+    });
+  });
+
+  describe('Component level styling', () => {
+    const componentStyle = alerts.exampleDemosArr.localStyling;
+    const stylesColors = [
+      'rgb(0, 150, 136)', // dark cyan
+      'rgb(0, 105, 92)', // mosque
+      'rgb(255, 255, 255)' // white
+    ];
+
+    it('alert is displayed with added style', () => {
+      cy.get(componentStyle).find(alerts.alertClass)
+        .should('to.have.css', 'background-color', stylesColors[0])
+        .and('to.have.css', 'border-color', stylesColors[1])
+        .and('to.have.css', 'color', stylesColors[2]);
+    });
+  });
+
+  describe('Configuring defaults', () => {
+    const configDemo = alerts.exampleDemosArr.config;
+    const alertTypes = [
+      'alert-success',
+      'alert-info'
+    ];
+
+    it('each alert contains added config', () => {
+      alertTypes.forEach(type => cy.get(`${ configDemo } .${ type }`)
+        .should('be.visible'));
+    });
+  });
+});
+
+describe('Buttons page test suite', () => {
+  const buttons = new ButtonsPo();
+  const buttonNames = [
+    'Left',
+    'Middle',
+    'Right'
+  ];
+
+  beforeEach(() => buttons.navigateTo());
+
+  describe('Basic', () => {
+    const basicBtn = buttons.exampleDemosArr.basic;
+    const btnText = 'Single Button';
+
+    it('example contains only enabled button with text on it', () => {
+      cy.get(` ${ basicBtn } ${ buttons.buttonSel }`)
+        .should('to.be.enabled')
+        .and('to.contain', btnText);
+    });
+  });
+
+  describe('Checkbox', () => {
+    const checkboxDemo = buttons.exampleDemosArr.checkbox;
+
+    it('checkboxes can be checked or unchecked', () => {
+      cy.get(`${ checkboxDemo } ${ buttons.output }`).as('output')
+        .should('to.contain', `"${ buttonNames[1].toLowerCase() }": true`);
+      buttons.clickByText(checkboxDemo, buttonNames[1]);
+
+      buttonNames.forEach(button => {
+        cy.get('@output')
+          .should('to.contain', `"${ button.toLowerCase() }": false`);
+
+        buttons.clickByText(checkboxDemo, button);
+        cy.get('@output')
+          .should('to.contain', `"${ button.toLowerCase() }": true`);
+      });
+    });
+  });
+
+  describe('Custom checkbox value', () => {
+    const customCheckboxVal = buttons.exampleDemosArr.customCheckboxVal;
+
+    it('examples contains output, which can be changed by click on output', () => {
+      const defaultVal = '1';
+      const afterClickVal = '0';
+
+      cy.get(` ${ customCheckboxVal } ${ buttons.output }`).as('header')
+        .should('to.contain', defaultVal);
+
+      cy.get(` ${ customCheckboxVal } ${ buttons.buttonSel }`).click();
+      cy.get('@header')
+        .should('to.contain', afterClickVal);
+    });
+  });
+
+  describe('Checkbox with Reactive Form', () => {
+    const checkboxWithForm = buttons.exampleDemosArr.checkboxWithForms;
+
+    it('checkboxes can be checked or unchecked and its\' states are displayed at reactive form', () => {
+      cy.get(` ${ checkboxWithForm } ${ buttons.output }`).as('output')
+        .should('to.contain', `"${ buttonNames[1].toLowerCase() }": true`);
+      buttons.clickByText(checkboxWithForm, buttonNames[1]);
+
+      buttonNames.forEach(button => {
+        cy.get('@output')
+          .should('to.contain', `"${ button.toLowerCase() }": false`);
+
+        buttons.clickByText(checkboxWithForm, button);
+        cy.get('@output')
+          .should('to.contain', `"${ button.toLowerCase() }": true`);
+      });
+    });
+  });
+
+  describe('Radio buttons', () => {
+    const radioCheck = buttons.exampleDemosArr.radioBtn;
+
+    it('checked radio button created with ngModel is displayed in output', () => {
+      // for now we need creating this alias due to same selectors' names and classes
+      cy.get(radioCheck).eq(0).as('radio').find('.btn-group').first().as('radioNgModel');
+
+      buttonNames.forEach(name => {
+        buttons.clickByText('@radioNgModel', name);
+
+        cy.get(`${ '@radio' }${ buttons.output }`)
+          .should('to.contain', name);
+      });
+    });
+
+    it('checked radio buttons created with btnRadioGroup is displayed in output', () => {
+      // for now we need creating this alias due to same selectors' names
+      cy.get(radioCheck).eq(0).as('radio').find(`${ buttons.btnRadioGroupSel }`).as('checkBtnRadioGroup');
+
+      buttonNames.forEach(name => {
+        buttons.clickByText('@checkBtnRadioGroup', name);
+
+        cy.get(`${ '@radio' }${ buttons.output }`)
+          .should('to.contain', name);
+      });
+    });
+  });
+
+  describe('Uncheckable radio', () => {
+    const radioUncheck = buttons.exampleDemosArr.radioBtn;
+
+    it('uncheckable radio buttons can be checked or unchecked', () => {
+      // for now we need creating this alias due to same selectors' names
+      cy.get(radioUncheck).eq(1).as('radioUncheck').find(`${ buttons.btnRadioGroupSel }`).as('uncheckBtnRadio');
+
+      buttonNames.forEach(name => {
+        buttons.clickByText('@uncheckBtnRadio', name);
+
+        cy.get(`${ '@radioUncheck' }${ buttons.output }`)
+          .should('to.contain', name);
+
+        buttons.clickByText('@uncheckBtnRadio', name);
+
+        cy.get(`${ '@radioUncheck' }${ buttons.output }`)
+          .should('to.be', null);
+      });
+    });
+  });
+
+  describe('Radio with Reactive Forms', () => {
+    const radioWithForm = buttons.exampleDemosArr.radioBtnWithForms;
+
+    it('radio example should dynamicly update reactive form', () => {
+      const btns = ['A', 'B', 'C'];
+
+      btns.forEach(radio => {
+        buttons.clickByText(radioWithForm, radio);
+
+        cy.get(`${ radioWithForm } ${ buttons.output }`)
+          .should('to.contain', radio);
+      });
+    });
+  });
+
+  describe('Disabled Buttons', () => {
+    const disabled = buttons.exampleDemosArr.disabled;
+    const togglerBtn = 'Enable/Disable';
+    const btnForAction = 'Button';
+
+    it('disabled buttons examples contains button, that can be disabled', () => {
+      cy.get(disabled).contains(btnForAction).as('btnForDisabling')
+        .should('to.be.enabled');
+      buttons.clickByText(disabled, togglerBtn);
+
+      cy.get('@btnForDisabling')
+        .should('not.to.be.enabled');
+    });
+  });
+});
+
+describe('Carousel page test suite', () => {
+  const carousel = new CarouselPo();
+
+  beforeEach(() => carousel.navigateTo());
+
+  describe('Basic', () => {
+    const basic = carousel.exampleDemosArr.basic;
+
+    it('example contains slides, indicators, left and right controls', () => {
+      cy.get(`${ basic } ${ carousel.carouselClass }`)
+        .should('to.have.descendants', carousel.indicatorClass)
+        .and('to.have.descendants', carousel.itemClass)
+        .and('to.have.descendants', carousel.leftControl)
+        .and('to.have.descendants', carousel.rightControl);
+    });
+  });
+});
+
+describe('Collapse demo page test suite', () => {
+  const collapse = new CollapsePo();
+
+  beforeEach(() => collapse.navigateTo());
+
+  describe('Basic', () => {
+    const basic = collapse.exampleDemosArr.basic;
+
+    it('contains togler and content, that can be collapsed', () => {
+      const toglerText = 'Toggle collapse';
+
+      cy.get(`${ basic } ${ collapse.collapseClass }`)
+        .should('to.have.class', collapse.showIndicator);
+
+      collapse.clickByText(basic, toglerText);
+      cy.get(`${ basic } ${ collapse.collapseClass }`)
+        .should('not.to.have.class', collapse.showIndicator);
+    });
+  });
+});
+
+describe('Datepicker demo page test suite', () => {
+  const datepicker = new DatepickerPo();
+
+  beforeEach(() => datepicker.navigateTo());
+
+  describe('Basic', () => {
+    const basic = datepicker.exampleDemosArr.basic;
+
+    it('basic date- and daterangepicker can be opened by click on input', () => {
+      cy.get(`${ basic } ${ datepicker.datepickerInput }`).click();
+      cy.get(datepicker.datepickerLastOpened)
+        .should('to.be.visible');
+
+      cy.get(`${ basic } ${ datepicker.daterangepickerInput }`).click();
+      cy.get(datepicker.daterangepickerLastOpened)
+        .should('to.be.visible');
+    });
+  });
+
+  describe('Custom date format', () => {
+    const customFormat = datepicker.exampleDemosArr.customFormat;
+
+    it('by default, today\'s date is displayed at first output in format YYYY-MM-DD', () => {
+      const expectedDate = Cypress.moment().format('YYYY-MM-DD');
+
+      cy.get(`${ customFormat } ${ datepicker.datepickerInput }`).first()
+        .should('have.value', `${ expectedDate }`);
+    });
+
+    it('by default, today\'s date is displayed at second output in format MM/DD/YYYY', () => {
+      const expectedDate = Cypress.moment().format('MM/DD/YYYY');
+
+      cy.get(`${ customFormat } ${ datepicker.datepickerInput }`).eq(1)
+        .should('have.value', `${ expectedDate }`);
+    });
+  });
+
+  describe('Reactive forms', () => {
+    const reactiveForms = datepicker.exampleDemosArr.reactiveForms;
+
+    it('chosen in datepicker date can be displayed in reactive form', () => {
+      const expectedDate = Cypress.moment().format('YYYY-MM-DD');
+      const day = Cypress.moment().format('D');
+
+      cy.get(`${ reactiveForms } ${ datepicker.datepickerInput }`).click();
+      datepicker.clickOnDayInCurrMonth(`${ datepicker.datepickerLastOpened }`, day);
+
+      cy.get(`${ reactiveForms } ${ datepicker.formOutput }`)
+        .should('to.contain', `"date": "${ expectedDate }`);
+    });
+  });
+});
+
+describe('Dropdowns demo page test suite', () => {
+  const dropdowns = new DropdownsPo();
+
+  beforeEach(() => dropdowns.navigateTo());
+
+  describe('Basic', () => {
+    const basicDrop = dropdowns.exampleDemosArr.basic;
+    const togglerText = 'Button dropdown';
+
+    it('single button dropdown is shown after click on toggler', () => {
+      dropdowns.clickByText(basicDrop, togglerText);
+      cy.get(`${ basicDrop } ${ dropdowns.dropdownMenu }`).as('basicDropMenu')
+        .should('to.have.class', dropdowns.showIndicator);
+
+      dropdowns.clickByText(basicDrop, togglerText);
+      cy.get('@basicDropMenu')
+        .should('not.to.have.class', dropdowns.showIndicator);
+    });
+  });
+
+  describe('Trigger by tag \<\a\>', () => {
+    const triggerTag = dropdowns.exampleDemosArr.triggerByTag;
+    const linkTag = 'a';
+
+    it('dropdowns can be triggered by tag a', () => {
+      cy.get(`${ triggerTag } span`).as('triggerTag')
+        .should('not.to.have.descendants', '.dropdown-menu');
+
+      cy.get('@triggerTag').find(linkTag).as('link').click();
+      cy.get('@triggerTag').find(dropdowns.dropdownMenu).as('linkDropMenu')
+        .should('to.have.class', dropdowns.showIndicator);
+
+      cy.get('@link').click();
+      cy.get('@linkDropMenu')
+        .should('not.to.have.class', dropdowns.showIndicator);
+    });
+  });
+
+  describe('Split button dropdowns', () => {
+    const splitBtn = dropdowns.exampleDemosArr.splitButton;
+    const buttonText = 'Action';
+
+    it('dropdown could have split toggler button', () => {
+      dropdowns.clickByText(splitBtn, buttonText);
+      cy.get(`${ splitBtn } ${ dropdowns.dropdownMenu }`)
+        .should('not.to.have.class', dropdowns.showIndicator);
+
+      cy.get(`${ splitBtn } ${ dropdowns.dropdownToggler }`).click();
+      cy.get(`${ splitBtn } ${ dropdowns.dropdownMenu }`)
+        .should('to.have.class', dropdowns.showIndicator);
+    });
+  });
+
+  describe('Disabled menu', () => {
+    const disabled = dropdowns.exampleDemosArr.disabledMenu;
+    const btnEnableDisable = 'Enable/Disable';
+
+    it('dropdown button can be disabled', () => {
+      dropdowns.clickByText(disabled, btnEnableDisable);
+      cy.get(`${ disabled } ${ dropdowns.dropdownToggler }`)
+        .should('not.to.be.enabled');
+    });
+  });
+});
+
+describe('Landing Page test suite', () => {
+  const landing = new LandingPo();
+
+  beforeEach(() => landing.navigateTo());
+
+  describe('Content', () => {
+
+    it('header displays ngx-bootstrap logo and info buttons', () => {
+      cy.get(landing.logoAtHeader)
+        .should('be.visible');
+      cy.get(landing.infoButtons)
+        .should('be.visible');
+    });
+
+    it('main content displays ngx-bootstrap logo, slogan, description, version and advantages block', () => {
+      cy.get(landing.logoAtContent)
+        .should('be.visible');
+      cy.get(landing.sloganBs)
+        .should('be.visible');
+      cy.get(landing.descriptionBs)
+        .should('be.visible');
+      cy.get(landing.versionBs)
+        .should('be.visible');
+      cy.get(landing.advantagesBs)
+        .should('be.visible');
+    });
+
+    it('footer contains links to ng-team, contributors, MIT license, Creative Commons, original Bootstrap', () => {
+      const footerLinks = [
+        landing.teamUrl,
+        landing.contributorsUrl,
+        landing.mitLicenseUrl,
+        landing.crCommonsUrl,
+        landing.originalBsUrl
+      ];
+
+      footerLinks.forEach(link =>
+        cy.get(`footer [href="${ link }"]`).should('to.be.exist'));
+    });
+  });
+
+  describe('Navigation buttons', () => {
+    it('Get started button redirects to Getting Started page', () => {
+      const buttonText = 'Get started';
+      const searchedUrl = '/getting-started';
+
+      landing.clickByText(landing.navBtn, buttonText);
+
+      cy.url()
+        .should('include', searchedUrl);
+    });
+
+    it('Github button is enabled and contains link to ngx-bootstrap repo', () => {
+      const buttonText = 'Github';
+
+      cy.get(landing.navBtn).contains(buttonText)
+        .should('be.enabled')
+        .and('have.attr', 'href', landing.githubUrl);
+    });
+
+    it('Info buttons in header are enabled and contains links to slack, github and stackoverflow', () => {
+      const linksArr = [
+        landing.stackoverflowUrl,
+        landing.githubUrl,
+        landing.slackUrl
+      ];
+
+      linksArr.forEach(link =>
+        cy.get(`${ landing.infoButtons } [href="${ link }"]`)
+          .should('be.enabled'));
+    });
+  });
+});
+
+describe('Modals demo page test suite', () => {
+  const modals = new ModalsPo();
+
+  beforeEach(() => modals.navigateTo());
+
+  describe('Service examples', () => {
+
+    describe('Template modal', () => {
+      const templateModal = modals.exampleDemosArr.serviceTemplate;
+      const buttonText = 'Create template modal';
+
+      it('template service modal can be opened by click on button and closed by backdrop-click', () => {
+        modals.clickByText(templateModal, buttonText);
+        cy.get(modals.modalContent)
+          .should('to.be.visible');
+
+        cy.get(modals.backServiceMod).as('modalAndBackdrop').click();
+        cy.get('@modalAndBackdrop')
+          .should('not.to.be.visible');
+      });
+    });
+
+    describe('Component modal', () => {
+      const componentModal = modals.exampleDemosArr.serviceComponent;
+      const buttonText = 'Create modal with component';
+      const modalCloseBtn = 'Close';
+
+      it('component service modal can be opened by click on button and closed by clicking Close button', () => {
+        modals.clickByText(componentModal, buttonText);
+        cy.get(modals.modalContent)
+          .should('to.be.visible');
+
+        modals.clickByText(modals.modalContent, modalCloseBtn);
+        cy.get(modals.backServiceMod)
+          .should('not.to.be.visible');
+      });
+    });
+  });
+
+  describe('Directive examples', () => {
+    describe('Static modal', () => {
+      const staticModal = modals.exampleDemosArr.directiveStatic;
+      const buttonText = 'Static modal';
+
+      it('directive static modal can be closed by clicking Close button', () => {
+        modals.clickByText(staticModal, buttonText);
+        cy.get(`${ staticModal } ${ modals.modalContent }`).as('staticMod')
+          .should('to.be.visible');
+
+        cy.get(`${ staticModal } ${ modals.modalHeader } ${ modals.btnCloseInHeader }`).click();
+        cy.get(`${ staticModal } ${ modals.backDirectiveMod }`)
+          .should('not.to.be.visible');
+      });
+    });
+
+    describe('Child modal', () => {
+      const childModals = modals.exampleDemosArr.directiveChild;
+      const buttonText = 'Open child modal';
+
+      it('directive child modal can be closed by backdrop click', () => {
+        modals.clickByText(childModals, buttonText);
+        cy.get(`${ childModals } ${ modals.modalContent }`)
+          .should('to.be.visible');
+
+        cy.get(`${ childModals } ${ modals.backDirectiveMod }`).as('childModBack').click();
+        cy.get('@childModBack')
+          .should('not.to.be.visible');
+      });
+    });
+  });
+});
+
+describe('Pagination demo page test suite', () => {
+  const pagination = new PaginationPo();
+
+  beforeEach(() => pagination.navigateTo());
+
+  describe('Pager', () => {
+    const pager = pagination.exampleDemosArr.pager;
+
+    it('active page can be changed by clicking on Next or Previous button', () => {
+      cy.get(`${ pager } ${ pagination.classActive }`)
+        .should('to.contain', '4');
+
+      pagination.clickByText(pager, pagination.btnPrev);
+      cy.get(`${ pager } ${ pagination.classActive }`)
+        .should('to.contain', '3');
+
+      pagination.clickByText(pager, pagination.btnNext);
+      cy.get(`${ pager } ${ pagination.classActive }`)
+        .should('to.contain', '4');
+    });
+  });
+});
+
+describe('Popover demo page test suite', () => {
+  const popover = new PopoverPo();
+
+  beforeEach(() => popover.navigateTo());
+
+  describe('Basic', () => {
+    const basicPopover = popover.exampleDemosArr.basic;
+
+    it('basic popover appears after clicking on trigger button', () => {
+      const buttonText = 'Live demo';
+
+      popover.clickByText(basicPopover, buttonText);
+      cy.get(basicPopover).should('to.have.descendants', 'popover-container');
+    });
+  });
+});
+
+describe('Progressbar demo page test suite', () => {
+  const progressbar = new ProgressbarPo();
+
+  beforeEach(() => progressbar.navigateTo());
+
+  describe('Configuring defaults', () => {
+    const configured = progressbar.exampleDemosArr.config;
+
+    it('preconfigured progressbar contains styles and value from config', () => {
+      const configInTempl = {
+        type: 'danger',
+        valueNow: '136'
+      };
+      const configInComp = {
+        animated: 'progress-bar-animated',
+        striped: 'progress-bar-striped',
+        maxVal: '150'
+      };
+
+      cy.get(`${ configured } ${ progressbar.tagProgressbar }`).as('progressbarConf')
+        .should('to.have.attr', 'type', configInTempl.type)
+        .and('to.have.attr', 'max', configInComp.maxVal);
+
+      cy.get('@progressbarConf').find(progressbar.tagBar)
+        .should('to.have.class', configInComp.animated)
+        .and('to.have.class', configInComp.striped)
+        .and('to.have.attr', 'aria-valuenow', configInTempl.valueNow);
+    });
+  });
+});
+
+describe('Rating demo page test suite', () => {
+  const rating = new RatingPo();
+
+  beforeEach(() => rating.navigateTo());
+
+  describe('Basic rating', () => {
+    const basic = rating.exampleDemosArr.basic;
+    const confComponent = {
+      maxVal: '10',
+      currRate: '7',
+      readonly: 'not.to.be.enabled'
+    };
+    const outputText = 'Rate: 7 ';
+
+    it('basic rating example contains readonly rating with preconfigured values', () => {
+      cy.get(`${ basic } ${rating.tagRating}`).as('rating')
+        .should('to.be.visible')
+        .and(confComponent.readonly);
+      cy.get('@rating').find('span')
+        .should('to.have.attr', 'aria-valuemax', confComponent.maxVal)
+        .and('to.have.attr', 'aria-valuenow', confComponent.currRate);
+
+      cy.get(`${ basic } ${ rating.outputClass }`)
+        .should('to.have.text', outputText);
+    });
+  });
+});
+
+describe('Sortable demo page test suite', () => {
+  const sortable = new SortablePo();
+
+  beforeEach(() => sortable.navigateTo());
+
+  describe('Basic', () => {
+    const basic = sortable.exampleDemosArr.basic;
+
+    it('sortable items are placed at two sortable-wrappers', () => {
+      cy.get(`${ basic } ${ sortable.classWrapper }`).as('wrapper').eq(0)
+        .should('to.have.descendants', sortable.classItem);
+      cy.get('@wrapper').eq(1)
+        .should('to.have.descendants', sortable.classItem);
+    });
+  });
+});
+
+describe('Tabs demo page spec', () => {
+  const tabs = new TabsPo();
+
+  beforeEach(() => tabs.navigateTo());
+
+  describe('Configuring defaults', () => {
+    const configDemo = tabs.exampleDemosArr.config;
+    const configComp = {
+      type: 'nav-pills'
+    };
+
+    it('configuring defaults example contains added config', () => {
+      cy.get(`${ configDemo } ${ tabs.tabsWrap }`)
+        .should('to.have.class', configComp.type);
+    });
+  });
+});
+
+describe('Timepicker demo page test suite', () => {
+  const timepicker = new TimepickerPo();
+
+  beforeEach(() => timepicker.navigateTo());
+
+  describe('Meridian', () => {
+    const meridian = timepicker.exampleDemosArr.meridian;
+    const togglerText = '12H / 24H';
+
+
+    it('first click on 12/24 toggler removes AM/PM button', () => {
+      cy.get(`${ meridian } ${ timepicker.btnAmPm }`).as('am/pm')
+        .should('to.exist');
+
+      timepicker.clickByText(meridian, togglerText);
+      cy.get('@am/pm')
+        .should('not.to.exist');
+    });
+  });
+});
+
+describe('Tooltip demo page test suite', () => {
+  const tooltip = new TooltipPo();
+
+  beforeEach(() => tooltip.navigateTo());
+
+  describe('Basic tooltip', () => {
+    const basic = tooltip.exampleDemosArr.basic;
+
+    it('basic tooltip appears after hovering on trigger button', () => {
+      cy.get(basic).as('basicDemo').find(tooltip.togglerTooltip).focus();
+      cy.get('@basicDemo')
+        .should('to.have.descendants', tooltip.containerTooltip);
+    });
+  });
+});
+
+describe('Typeahead demo page test suite', () => {
+  const typeahead = new TypeaheadPo();
+
+  beforeEach(() => typeahead.navigateTo());
+
+  describe('Reactive forms', () => {
+    const reactiveForm = typeahead.exampleDemosArr.reactiveForms;
+
+    it('reactive forms typeahead appears after focus at input', () => {
+      cy.get(reactiveForm).as('reactiveForm').find(typeahead.tagInput).focus();
+      cy.get('@reactiveForm')
+        .should('to.have.descendants', typeahead.containerTypeahead);
+    });
+  });
+});
diff --git a/cypress/integration/landing_page_spec.ts b/cypress/integration/landing_page_spec.ts
deleted file mode 100644
index 2b0b4bdf17..0000000000
--- a/cypress/integration/landing_page_spec.ts
+++ /dev/null
@@ -1,67 +0,0 @@
-import { LandingPo } from '../support/landing.po';
-
-describe('Landing Page test suite', () => {
-  const landing = new LandingPo();
-
-  beforeEach(() => landing.navigateTo());
-
-  it('Successfully loads and displays all content of the ngx-bootstrap LP', () => {
-    cy.get('.logo')
-      .should('be.visible');
-    cy.get('.header-info')
-      .should('be.visible');
-    cy.get('.content-logo')
-      .should('be.visible');
-    cy.get('.slogan')
-      .should('be.visible');
-    cy.get('.descr')
-      .should('be.visible');
-    cy.get('.version')
-      .should('be.visible');
-    cy.get('.advantages')
-      .should('be.visible');
-  });
-
-  it('Get started button redirects to Getting Started page', () => {
-    const buttonText = 'Get started';
-    const searchedUrl = '/getting-started';
-
-    landing.clickByText('.btn', buttonText);
-
-    cy.url()
-      .should('include', searchedUrl);
-  });
-
-  it('Github button is enabled and contains link to ngx-bootstrap repo', () => {
-    const buttonText = 'Github';
-
-    cy.get('.btn').contains(buttonText)
-      .should('be.enabled')
-      .and('have.attr', 'href', landing.githubUrl);
-  });
-
-  it('Info buttons in header are enabled and contains links to slack, github and stackoverflow', () => {
-    cy.get('.header-list li a').as('infoButton').eq(0)
-      .should('be.enabled')
-      .and('have.attr', 'href', landing.stackoverflowUrl);
-    cy.get('@infoButton').eq(1)
-      .should('be.enabled')
-      .and('have.attr', 'href', landing.githubUrl);
-    cy.get('@infoButton').eq(2)
-      .should('be.enabled')
-      .and('have.attr', 'href', landing.slackUrl);
-  });
-
-  it('Footer contains links to ng-team, contributors, MIT license, Creative Commons and to original Bootstrap', () => {
-    cy.get('footer p').as('footer').eq(0).children('a').eq(0)
-      .should('have.attr', 'href', landing.ngTeamUrl);
-    cy.get('@footer').eq(0).children('a').eq(1)
-      .should('have.attr', 'href', landing.contributorsUrl);
-    cy.get('@footer').eq(1).children('a').eq(0)
-      .should('have.attr', 'href', landing.mitLicenseUrl);
-    cy.get('@footer').eq(1).children('a').eq(1)
-      .should('have.attr', 'href', landing.crCommonsUrl);
-    cy.get('@footer').eq(2).children('a')
-      .should('have.attr', 'href', landing.originalBsUrl);
-  });
-});
diff --git a/cypress/support/accordion.po.ts b/cypress/support/accordion.po.ts
index c7161805f6..c5ebb24d9c 100644
--- a/cypress/support/accordion.po.ts
+++ b/cypress/support/accordion.po.ts
@@ -4,19 +4,23 @@ export class AccordionPo extends BaseComponent {
   pageUrl = '/accordion';
   pageTitle = 'Accordion';
   ghLinkToComponent = 'https://github.com/valor-software/ngx-bootstrap/tree/development/src/accordion';
-  buttonEnableDisable = 'Enable / Disable first panel';
-  buttonPanelToggler = 'Toggle last panel';
-  buttonAddItem = 'Add';
-  accordionDemosArr = [
-    'demo-accordion-basic',
-    'demo-accordion-disabled',
-    'demo-accordion-dynamic',
-    'demo-accordion-dynamic-body',
-    'demo-accordion-manual-toggle',
-    'demo-accordion-one-time',
-    'demo-accordion-styling',
-    'demo-accordion-config'
-  ];
+
+  openClass = 'panel-open';
+  disabledPanelText = '.text-muted';
+  panelCard = '.card';
+  panelBody = '.panel-body';
+
+  exampleDemosArr = {
+    basic: 'demo-accordion-basic',
+    disabled: 'demo-accordion-disabled',
+    initiallyOpened: 'demo-accordion-opened',
+    dynamicAccGroup: 'demo-accordion-dynamic',
+    dynamicBody: 'demo-accordion-dynamic-body',
+    manualToggle: 'demo-accordion-manual-toggle',
+    oneAtATime: 'demo-accordion-one-time',
+    styling: 'demo-accordion-styling',
+    config: 'demo-accordion-config'
+  };
 
   getAccordionPanel(locator: string, panelNum: number) {
     return cy.get(locator).find('accordion-group').eq(panelNum);
diff --git a/cypress/support/alerts.po.ts b/cypress/support/alerts.po.ts
index 6636d4f26a..78ca47b715 100644
--- a/cypress/support/alerts.po.ts
+++ b/cypress/support/alerts.po.ts
@@ -4,26 +4,23 @@ export class AlertsPo extends BaseComponent {
   pageUrl = '/alerts';
   pageTitle = 'Alerts';
   ghLinkToComponent = 'https://github.com/valor-software/ngx-bootstrap/tree/development/src/alert';
+
+  alertClass = '.alert';
   linkClass = '.alert-link';
-  buttonToggler = 'Toggle dismissible';
-  buttonReset = 'Reset';
-  buttonChangeText = 'Change text';
-  buttonAddMore = 'Add more';
-  dynamicAlertText = [
-    'You successfully read this important alert message.',
-    'Now this text is different from what it was before. Go ahead and click the button one more time',
-    'Well done! Click reset button'
-  ];
-  exampleDemosArr = [
-    'demo-alert-basic',
-    'demo-alert-link',
-    'demo-alert-content',
-    'demo-alert-dismiss',
-    'demo-alert-dynamic-html',
-    'demo-alert-content-html',
-    'demo-alert-timeout',
-    'demo-alert-styling-global',
-    'demo-alert-styling-local',
-    'demo-alert-config'
-  ];
+  heading = '.alert-heading';
+  dismissOption = '.close';
+  textWrapper = 'span';
+
+  exampleDemosArr = {
+    basic: 'demo-alert-basic',
+    link: 'demo-alert-link',
+    content: 'demo-alert-content',
+    dismissing: 'demo-alert-dismiss',
+    dynamicHtml: 'demo-alert-dynamic-html',
+    dynamicContent: 'demo-alert-content-html',
+    dismissTimeout: 'demo-alert-timeout',
+    globalStyling: 'demo-alert-styling-global',
+    localStyling: 'demo-alert-styling-local',
+    config: 'demo-alert-config'
+  };
 }
diff --git a/cypress/support/base.component.ts b/cypress/support/base.component.ts
index 27260452ad..47c90574cb 100644
--- a/cypress/support/base.component.ts
+++ b/cypress/support/base.component.ts
@@ -1,4 +1,8 @@
 export abstract class BaseComponent {
+  titleSel = 'h1';
+  titleLinkSel = '.content-header a';
+  usageExSel = 'demo-top-section h2';
+  usageExCodeSel = 'demo-top-section .prettyprint';
   abstract pageUrl: string;
   titleDefaultExample = 'Usage';
 
diff --git a/cypress/support/buttons.po.ts b/cypress/support/buttons.po.ts
index a2efa91b39..92613db5f1 100644
--- a/cypress/support/buttons.po.ts
+++ b/cypress/support/buttons.po.ts
@@ -5,13 +5,17 @@ export class ButtonsPo extends BaseComponent {
   pageTitle = 'Buttons';
   ghLinkToComponent = 'https://github.com/valor-software/ngx-bootstrap/tree/development/src/buttons';
 
-  exampleDemosArr = [
-    'demo-buttons-basic',
-    'demo-buttons-checkbox',
-    'demo-buttons-checkbox-reactiveforms',
-    'demo-buttons-radio',
-    'demo-buttons-radio-reactiveforms',
-    'demo-buttons-disabled',
-    'demo-custom-checkbox-value'
-  ];
+  output = '.card-header';
+  buttonSel = 'button';
+  btnRadioGroupSel = '[btnradiogroup]';
+
+  exampleDemosArr = {
+    basic: 'demo-buttons-basic',
+    checkbox: 'demo-buttons-checkbox',
+    customCheckboxVal: 'demo-custom-checkbox-value',
+    checkboxWithForms: 'demo-buttons-checkbox-reactiveforms',
+    radioBtn: 'demo-buttons-radio',
+    radioBtnWithForms: 'demo-buttons-radio-reactiveforms',
+    disabled: 'demo-buttons-disabled'
+  };
 }
diff --git a/cypress/support/carousel.po.ts b/cypress/support/carousel.po.ts
new file mode 100644
index 0000000000..42805e7304
--- /dev/null
+++ b/cypress/support/carousel.po.ts
@@ -0,0 +1,17 @@
+import { BaseComponent } from './base.component';
+
+export class CarouselPo extends BaseComponent {
+  pageUrl = '/carousel';
+  pageTitle = 'Carousel';
+  ghLinkToComponent = 'https://github.com/valor-software/ngx-bootstrap/tree/development/src/carousel';
+
+  carouselClass = '.carousel';
+  indicatorClass = '.carousel-indicators';
+  itemClass = '.carousel-item';
+  leftControl = '.carousel-control-prev';
+  rightControl = '.carousel-control-next';
+
+  exampleDemosArr = {
+    basic: 'demo-carousel-basic'
+  };
+}
diff --git a/cypress/support/collapse.po.ts b/cypress/support/collapse.po.ts
new file mode 100644
index 0000000000..b8f7126606
--- /dev/null
+++ b/cypress/support/collapse.po.ts
@@ -0,0 +1,14 @@
+import { BaseComponent } from './base.component';
+
+export class CollapsePo extends BaseComponent {
+  pageUrl = '/collapse';
+  pageTitle = 'Collapse';
+  ghLinkToComponent = 'https://github.com/valor-software/ngx-bootstrap/tree/development/src/collapse';
+
+  collapseClass = '.collapse';
+  showIndicator = 'in show';
+
+  exampleDemosArr = {
+    basic: 'collapse-demo'
+  };
+}
diff --git a/cypress/support/datepicker.po.ts b/cypress/support/datepicker.po.ts
new file mode 100644
index 0000000000..7a132933e2
--- /dev/null
+++ b/cypress/support/datepicker.po.ts
@@ -0,0 +1,26 @@
+import { BaseComponent } from './base.component';
+
+export class DatepickerPo extends BaseComponent {
+  pageUrl = '/datepicker';
+  pageTitle = 'Datepicker';
+  ghLinkToComponent = 'https://github.com/valor-software/ngx-bootstrap/tree/development/src/datepicker';
+
+  datepickerInput = 'input[bsdatepicker]';
+  daterangepickerInput = 'input[bsdaterangepicker]';
+  datepickerLastOpened = 'bs-datepicker-container:last';
+  daterangepickerLastOpened = 'bs-daterangepicker-container:last';
+  datepickerDays = '[bsdatepickerdaydecorator]';
+  formOutput = '.code-preview';
+
+  exampleDemosArr = {
+    basic: 'demo-datepicker-basic',
+    customFormat: 'demo-date-picker-custom-format',
+    reactiveForms: 'demo-datepicker-reactive-forms'
+  };
+
+  clickOnDayInCurrMonth(datepicker: string, day: string) {
+    cy.get(`${ datepicker } ${ this.datepickerDays}`)
+      .not('.is-other-month')
+      .contains(day).click();
+  }
+}
diff --git a/cypress/support/dropdowns.po.ts b/cypress/support/dropdowns.po.ts
new file mode 100644
index 0000000000..e80211016d
--- /dev/null
+++ b/cypress/support/dropdowns.po.ts
@@ -0,0 +1,18 @@
+import { BaseComponent } from './base.component';
+
+export class DropdownsPo extends BaseComponent {
+  pageUrl = '/dropdowns';
+  pageTitle = 'Dropdowns';
+  ghLinkToComponent = 'https://github.com/valor-software/ngx-bootstrap/tree/development/src/dropdown';
+
+  dropdownMenu = '.dropdown-menu';
+  dropdownToggler = '.dropdown-toggle';
+  showIndicator = 'show';
+
+  exampleDemosArr = {
+    basic: 'demo-dropdown-basic',
+    triggerByTag: 'demo-dropdown-basic-link',
+    splitButton: 'demo-dropdown-split',
+    disabledMenu: 'demo-dropdown-disabled'
+  };
+}
diff --git a/cypress/support/landing.po.ts b/cypress/support/landing.po.ts
index 63c2af2b8c..6d98935160 100644
--- a/cypress/support/landing.po.ts
+++ b/cypress/support/landing.po.ts
@@ -3,10 +3,20 @@ import { BaseComponent } from './base.component';
 export class LandingPo extends BaseComponent {
   pageUrl = '/';
 
-  stackoverflowUrl =  'https://stackoverflow.com/questions/tagged/ngx-bootstrap';
+  logoAtHeader = '.logo';
+  logoAtContent = '.content-logo';
+  infoButtons = '.header-list';
+  sloganBs = '.slogan';
+  descriptionBs = '.descr';
+  versionBs = '.version';
+  advantagesBs = '.advantages';
+  navBtn = '.btn';
+
+  stackoverflowUrl = 'https://stackoverflow.com/questions/tagged/ngx-bootstrap';
   githubUrl = 'https://github.com/valor-software/ngx-bootstrap';
   slackUrl = 'https://ngx-slack.herokuapp.com';
-  ngTeamUrl = 'https://github.com/valor-software';
+
+  teamUrl = 'https://github.com/valor-software';
   contributorsUrl = 'https://github.com/valor-software/ngx-bootstrap/graphs/contributors';
   mitLicenseUrl = 'https://github.com/valor-software/ngx-bootstrap/blob/development/LICENSE';
   crCommonsUrl = 'https://creativecommons.org/licenses/by/3.0/';
diff --git a/cypress/support/modals.po.ts b/cypress/support/modals.po.ts
new file mode 100644
index 0000000000..df7c67beb4
--- /dev/null
+++ b/cypress/support/modals.po.ts
@@ -0,0 +1,29 @@
+import { BaseComponent } from './base.component';
+
+export class ModalsPo extends BaseComponent {
+  pageUrl = '/modals';
+  pageTitle = 'Modals';
+  ghLinkToComponent = 'https://github.com/valor-software/ngx-bootstrap/tree/development/src/modal';
+
+  modalContent = '.modal-content';
+  backServiceMod = 'modal-container';
+  backDirectiveMod = '[bsmodal]';
+  modalHeader = '.modal-header';
+  btnCloseInHeader = '.close';
+
+  exampleDemosArr = {
+    serviceTemplate: 'demo-modal-service-static',
+    serviceComponent: 'demo-modal-service-component',
+    serviceNested: 'demo-modal-service-nested',
+    serviceScrol: 'demo-modal-scrolling-long-content',
+    serviceEvents: 'demo-modal-service-events',
+    serviceConfirm: 'demo-modal-service-confirm-window',
+    serviceOptions: 'demo-modal-service-options',
+    directiveStatic: 'demo-modal-static',
+    directiveSizes: 'demo-modal-sizes',
+    directiveChild: 'demo-modal-child',
+    directiveNested: 'demo-modal-nested',
+    directiveEvents: 'demo-modal-events',
+    directiveAutoShow: 'demo-modal-auto-shown'
+  };
+}
diff --git a/cypress/support/pagination.po.ts b/cypress/support/pagination.po.ts
new file mode 100644
index 0000000000..4cf3992b1f
--- /dev/null
+++ b/cypress/support/pagination.po.ts
@@ -0,0 +1,15 @@
+import { BaseComponent } from './base.component';
+
+export class PaginationPo extends BaseComponent {
+  pageUrl = '/pagination';
+  pageTitle = 'Pagination';
+  ghLinkToComponent = 'https://github.com/valor-software/ngx-bootstrap/tree/development/src/pagination';
+
+  classActive = '.active';
+  btnPrev = 'Previous';
+  btnNext = 'Next';
+
+  exampleDemosArr = {
+    pager: 'demo-pagination-pager'
+  };
+}
diff --git a/cypress/support/popover.po.ts b/cypress/support/popover.po.ts
new file mode 100644
index 0000000000..eab9cb2e58
--- /dev/null
+++ b/cypress/support/popover.po.ts
@@ -0,0 +1,11 @@
+import { BaseComponent } from './base.component';
+
+export class PopoverPo extends BaseComponent {
+  pageUrl = '/popover';
+  pageTitle = 'Popover';
+  ghLinkToComponent = 'https://github.com/valor-software/ngx-bootstrap/tree/development/src/popover';
+
+  exampleDemosArr = {
+    basic: 'demo-popover-basic'
+  };
+}
diff --git a/cypress/support/progressbar.po.ts b/cypress/support/progressbar.po.ts
new file mode 100644
index 0000000000..07918e9df2
--- /dev/null
+++ b/cypress/support/progressbar.po.ts
@@ -0,0 +1,14 @@
+import { BaseComponent } from './base.component';
+
+export class ProgressbarPo extends BaseComponent {
+  pageUrl = '/progressbar';
+  pageTitle = 'Progressbar';
+  ghLinkToComponent = 'https://github.com/valor-software/ngx-bootstrap/tree/development/src/progressbar';
+
+  tagProgressbar = 'progressbar';
+  tagBar = 'bar';
+
+  exampleDemosArr = {
+    config: 'demo-progressbar-config'
+  };
+}
diff --git a/cypress/support/rating.po.ts b/cypress/support/rating.po.ts
new file mode 100644
index 0000000000..238f8edba7
--- /dev/null
+++ b/cypress/support/rating.po.ts
@@ -0,0 +1,14 @@
+import { BaseComponent } from './base.component';
+
+export class RatingPo extends BaseComponent {
+  pageUrl = '/rating';
+  pageTitle = 'Rating';
+  ghLinkToComponent = 'https://github.com/valor-software/ngx-bootstrap/tree/development/src/rating';
+
+  tagRating = 'rating';
+  outputClass = '.card-block';
+
+  exampleDemosArr = {
+    basic: 'demo-rating-basic'
+  };
+}
diff --git a/cypress/support/sortable.po.ts b/cypress/support/sortable.po.ts
new file mode 100644
index 0000000000..6293b2e20c
--- /dev/null
+++ b/cypress/support/sortable.po.ts
@@ -0,0 +1,14 @@
+import { BaseComponent } from './base.component';
+
+export class SortablePo extends BaseComponent {
+  pageUrl = '/sortable';
+  pageTitle = 'Sortable';
+  ghLinkToComponent = 'https://github.com/valor-software/ngx-bootstrap/blob/development/src/sortable';
+
+  classWrapper = '.sortable-wrapper';
+  classItem = '.sortable-item';
+
+  exampleDemosArr = {
+    basic: 'basic-demo'
+  };
+}
diff --git a/cypress/support/tabs.po.ts b/cypress/support/tabs.po.ts
new file mode 100644
index 0000000000..5c7a20c10d
--- /dev/null
+++ b/cypress/support/tabs.po.ts
@@ -0,0 +1,13 @@
+import { BaseComponent } from './base.component';
+
+export class TabsPo extends BaseComponent {
+  pageUrl = '/tabs';
+  pageTitle = 'Tabs';
+  ghLinkToComponent = 'https://github.com/valor-software/ngx-bootstrap/tree/development/src/tabs';
+
+  tabsWrap = 'ul';
+
+  exampleDemosArr = {
+    config: 'demo-tabs-config'
+  };
+}
diff --git a/cypress/support/timepicker.po.ts b/cypress/support/timepicker.po.ts
new file mode 100644
index 0000000000..97698e8ddd
--- /dev/null
+++ b/cypress/support/timepicker.po.ts
@@ -0,0 +1,13 @@
+import { BaseComponent } from './base.component';
+
+export class TimepickerPo extends BaseComponent {
+  pageUrl = '/timepicker';
+  pageTitle = 'Timepicker';
+  ghLinkToComponent = 'https://github.com/valor-software/ngx-bootstrap/tree/development/src/timepicker';
+
+  btnAmPm = '.btn-default';
+
+  exampleDemosArr = {
+    meridian: 'demo-timepicker-meridian'
+  };
+}
diff --git a/cypress/support/tooltip.po.ts b/cypress/support/tooltip.po.ts
new file mode 100644
index 0000000000..277f745f0f
--- /dev/null
+++ b/cypress/support/tooltip.po.ts
@@ -0,0 +1,14 @@
+import { BaseComponent } from './base.component';
+
+export class TooltipPo extends BaseComponent {
+  pageUrl = '/tooltip';
+  pageTitle = 'Tooltip';
+  ghLinkToComponent = 'https://github.com/valor-software/ngx-bootstrap/tree/development/src/tooltip';
+
+  togglerTooltip = 'button';
+  containerTooltip = 'bs-tooltip-container';
+
+  exampleDemosArr = {
+    basic: 'demo-tooltip-basic'
+  };
+}
diff --git a/cypress/support/typeahead.po.ts b/cypress/support/typeahead.po.ts
new file mode 100644
index 0000000000..de1754baba
--- /dev/null
+++ b/cypress/support/typeahead.po.ts
@@ -0,0 +1,14 @@
+import { BaseComponent } from './base.component';
+
+export class TypeaheadPo extends BaseComponent {
+  pageUrl = '/typeahead';
+  pageTitle = 'Typeahead';
+  ghLinkToComponent = 'https://github.com/valor-software/ngx-bootstrap/tree/development/src/typeahead';
+
+  tagInput = 'input';
+  containerTypeahead = 'typeahead-container';
+
+  exampleDemosArr = {
+    reactiveForms: 'demo-typeahead-reactive-form'
+  };
+}
diff --git a/package-lock.json b/package-lock.json
index 7de8624100..67020d234b 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -68,7 +68,7 @@
         "@ngtools/webpack": "1.10.1",
         "@schematics/angular": "0.3.2",
         "@schematics/package-update": "0.3.2",
-        "ajv": "6.3.0",
+        "ajv": "6.4.0",
         "autoprefixer": "7.2.6",
         "cache-loader": "1.2.2",
         "chalk": "2.2.2",
@@ -94,11 +94,11 @@
         "memory-fs": "0.4.1",
         "minimatch": "3.0.4",
         "node-modules-path": "1.0.1",
-        "node-sass": "4.7.2",
+        "node-sass": "4.8.3",
         "nopt": "4.0.1",
         "opn": "5.1.0",
         "portfinder": "1.0.13",
-        "postcss": "6.0.20",
+        "postcss": "6.0.21",
         "postcss-import": "11.1.0",
         "postcss-loader": "2.1.3",
         "postcss-url": "7.3.1",
@@ -165,14 +165,15 @@
           "dev": true
         },
         "ajv": {
-          "version": "6.3.0",
-          "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.3.0.tgz",
-          "integrity": "sha1-FlCkERTvAFdMrBC4Ay2PTBSBLac=",
+          "version": "6.4.0",
+          "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.4.0.tgz",
+          "integrity": "sha1-06/3jpJ3VJdx2vAWTP9ISCt1T8Y=",
           "dev": true,
           "requires": {
             "fast-deep-equal": "1.1.0",
             "fast-json-stable-stringify": "2.0.0",
-            "json-schema-traverse": "0.3.1"
+            "json-schema-traverse": "0.3.1",
+            "uri-js": "3.0.2"
           }
         }
       }
@@ -900,9 +901,9 @@
       "dev": true
     },
     "@types/uglify-js": {
-      "version": "2.6.30",
-      "resolved": "https://registry.npmjs.org/@types/uglify-js/-/uglify-js-2.6.30.tgz",
-      "integrity": "sha512-NjiBNGFl58vHJeijl63w1fWRIjLnrfOvimsXF5b3lTzEzkTV1BnVsbqQeLejg54upsHPWIF63aiub5TEwH619A==",
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/@types/uglify-js/-/uglify-js-3.0.0.tgz",
+      "integrity": "sha512-4I5d8+t+HPvPjya4b0n92bpvszq07Kql0crGW3Vso+Ii2DdLjwCBljv1qaXkIMc62z8IPLGd7lA/b3p5DO6bog==",
       "dev": true,
       "requires": {
         "source-map": "0.6.1"
@@ -924,7 +925,7 @@
       "requires": {
         "@types/node": "8.5.1",
         "@types/tapable": "1.0.0",
-        "@types/uglify-js": "2.6.30",
+        "@types/uglify-js": "3.0.0",
         "source-map": "0.6.1"
       },
       "dependencies": {
@@ -1448,9 +1449,9 @@
       "dev": true
     },
     "atob": {
-      "version": "2.0.3",
-      "resolved": "https://registry.npmjs.org/atob/-/atob-2.0.3.tgz",
-      "integrity": "sha1-GcenYEc3dEaPILLS0DNyrX1Mv10=",
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/atob/-/atob-2.1.0.tgz",
+      "integrity": "sha512-SuiKH8vbsOyCALjA/+EINmt/Kdl+TQPrtFgW7XZZcwtryFu9e5kQoX3bjCW6mIvGH1fbeAZZuvwGR5IlBRznGw==",
       "dev": true
     },
     "autoprefixer": {
@@ -1460,10 +1461,10 @@
       "dev": true,
       "requires": {
         "browserslist": "2.11.3",
-        "caniuse-lite": "1.0.30000819",
+        "caniuse-lite": "1.0.30000821",
         "normalize-range": "0.1.2",
         "num2fraction": "1.2.2",
-        "postcss": "6.0.20",
+        "postcss": "6.0.21",
         "postcss-value-parser": "3.3.0"
       }
     },
@@ -1477,7 +1478,7 @@
         "enhanced-resolve": "3.3.0",
         "loader-utils": "1.1.0",
         "lodash": "4.17.4",
-        "micromatch": "3.1.9",
+        "micromatch": "3.1.10",
         "mkdirp": "0.5.1",
         "object-assign": "4.1.1",
         "source-map-support": "0.4.18"
@@ -1731,9 +1732,9 @@
           "dev": true
         },
         "micromatch": {
-          "version": "3.1.9",
-          "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-3.1.9.tgz",
-          "integrity": "sha512-SlIz6sv5UPaAVVFRKodKjCg48EbNoIhgetzfK/Cy0v5U52Z6zB136M8tp0UC9jM53LYbmIRihJszvvqpKkfm9g==",
+          "version": "3.1.10",
+          "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-3.1.10.tgz",
+          "integrity": "sha512-MWikgl9n9M3w+bpsY3He8L+w9eF9338xRl8IAO5viDizwSzziFEyUzo2xrrloB64ADbTf8uA8vRqqttDTOmccg==",
           "dev": true,
           "requires": {
             "arr-diff": "4.0.0",
@@ -3593,8 +3594,8 @@
       "integrity": "sha512-yWu5cXT7Av6mVwzWc8lMsJMHWn4xyjSuGYi4IozbVTLUOEYPSagUB8kiMDUHA1fS3zjr8nkxkn9jdvug4BBRmA==",
       "dev": true,
       "requires": {
-        "caniuse-lite": "1.0.30000819",
-        "electron-to-chromium": "1.3.40"
+        "caniuse-lite": "1.0.30000821",
+        "electron-to-chromium": "1.3.41"
       }
     },
     "bs-recipes": {
@@ -3610,7 +3611,7 @@
       "dev": true,
       "requires": {
         "base64-js": "1.2.3",
-        "ieee754": "1.1.10",
+        "ieee754": "1.1.11",
         "isarray": "1.0.0"
       }
     },
@@ -3747,9 +3748,9 @@
       }
     },
     "caniuse-lite": {
-      "version": "1.0.30000819",
-      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30000819.tgz",
-      "integrity": "sha512-9i1d8eiKA6dLvsMrVrXOTP9/1sd9iIv4iC/UbPbIa9iQd9Gcnozi2sQ0d69TiQY9l7Alt7YIWISOBwyGSM6H0Q==",
+      "version": "1.0.30000821",
+      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30000821.tgz",
+      "integrity": "sha512-qyYay02wr/5k7PO86W+LKFaEUZfWIvT65PaXuPP16jkSpgZGIsSstHKiYAPVLjTj98j2WnWwZg8CjXPx7UIPYg==",
       "dev": true
     },
     "capture-stack-trace": {
@@ -4274,9 +4275,9 @@
       }
     },
     "configstore": {
-      "version": "3.1.1",
-      "resolved": "https://registry.npmjs.org/configstore/-/configstore-3.1.1.tgz",
-      "integrity": "sha512-5oNkD/L++l0O6xGXxb1EWS7SivtjfGQlRyxJsYgE0Z495/L81e2h4/d3r969hoPXuFItzNOKMtsXgYG4c7dYvw==",
+      "version": "3.1.2",
+      "resolved": "https://registry.npmjs.org/configstore/-/configstore-3.1.2.tgz",
+      "integrity": "sha512-vtv5HtGjcYUgFrXc6Kx747B83MRRVS5R1VTEQoXvuP+kMI+if6uywV0nDGoiydJRy4yk7h9od5Og0kxx4zUXmw==",
       "dev": true,
       "requires": {
         "dot-prop": "4.2.0",
@@ -4382,22 +4383,22 @@
       "dev": true
     },
     "conventional-changelog": {
-      "version": "1.1.18",
-      "resolved": "https://registry.npmjs.org/conventional-changelog/-/conventional-changelog-1.1.18.tgz",
-      "integrity": "sha512-swf5bqhm7PsY2cw6zxuPy6+rZiiGwEpQnrWki+L+z2oZI53QSYwU4brpljmmWss821AsiwmVL+7V6hP+ER+TBA==",
+      "version": "1.1.23",
+      "resolved": "https://registry.npmjs.org/conventional-changelog/-/conventional-changelog-1.1.23.tgz",
+      "integrity": "sha512-yCPXU/OXJmxgbvTQfIKXKwKa4KQTvlO0a4T/371Raz3bdxcHIGhQtHtdrNee4Z8nGLNfe54njHDblVG2JNFyjg==",
       "dev": true,
       "requires": {
         "conventional-changelog-angular": "1.6.6",
-        "conventional-changelog-atom": "0.2.4",
-        "conventional-changelog-codemirror": "0.3.4",
-        "conventional-changelog-core": "2.0.5",
-        "conventional-changelog-ember": "0.3.6",
-        "conventional-changelog-eslint": "1.0.5",
-        "conventional-changelog-express": "0.3.4",
+        "conventional-changelog-atom": "0.2.8",
+        "conventional-changelog-codemirror": "0.3.8",
+        "conventional-changelog-core": "2.0.10",
+        "conventional-changelog-ember": "0.3.11",
+        "conventional-changelog-eslint": "1.0.9",
+        "conventional-changelog-express": "0.3.6",
         "conventional-changelog-jquery": "0.1.0",
         "conventional-changelog-jscs": "0.1.0",
-        "conventional-changelog-jshint": "0.3.4",
-        "conventional-changelog-preset-loader": "1.1.6"
+        "conventional-changelog-jshint": "0.3.8",
+        "conventional-changelog-preset-loader": "1.1.8"
       }
     },
     "conventional-changelog-angular": {
@@ -4411,9 +4412,9 @@
       }
     },
     "conventional-changelog-atom": {
-      "version": "0.2.4",
-      "resolved": "https://registry.npmjs.org/conventional-changelog-atom/-/conventional-changelog-atom-0.2.4.tgz",
-      "integrity": "sha512-4+hmbBwcAwx1XzDZ4aEOxk/ONU0iay10G0u/sld16ksgnRUHN7CxmZollm3FFaptr6VADMq1qxomA+JlpblBlg==",
+      "version": "0.2.8",
+      "resolved": "https://registry.npmjs.org/conventional-changelog-atom/-/conventional-changelog-atom-0.2.8.tgz",
+      "integrity": "sha512-8pPZqhMbrnltNBizjoDCb/Sz85KyUXNDQxuAEYAU5V/eHn0okMBVjqc8aHWYpHrytyZWvMGbayOlDv7i8kEf6g==",
       "dev": true,
       "requires": {
         "q": "1.5.1"
@@ -4426,34 +4427,34 @@
       "dev": true,
       "requires": {
         "add-stream": "1.0.0",
-        "conventional-changelog": "1.1.18",
+        "conventional-changelog": "1.1.23",
         "lodash": "4.17.4",
         "meow": "3.7.0",
         "tempfile": "1.1.1"
       }
     },
     "conventional-changelog-codemirror": {
-      "version": "0.3.4",
-      "resolved": "https://registry.npmjs.org/conventional-changelog-codemirror/-/conventional-changelog-codemirror-0.3.4.tgz",
-      "integrity": "sha512-8M7pGgQVzRU//vG3rFlLYqqBywOLxu9XM0/lc1/1Ll7RuKA79PgK9TDpuPmQDHFnqGS7D1YiZpC3Z0D9AIYExg==",
+      "version": "0.3.8",
+      "resolved": "https://registry.npmjs.org/conventional-changelog-codemirror/-/conventional-changelog-codemirror-0.3.8.tgz",
+      "integrity": "sha512-3HFZKtBXTaUCHvz7ai6nk2+psRIkldDoNzCsom0egDtVmPsvvHZkzjynhdQyULfacRSsBTaiQ0ol6nBOL4dDiQ==",
       "dev": true,
       "requires": {
         "q": "1.5.1"
       }
     },
     "conventional-changelog-core": {
-      "version": "2.0.5",
-      "resolved": "https://registry.npmjs.org/conventional-changelog-core/-/conventional-changelog-core-2.0.5.tgz",
-      "integrity": "sha512-lP1s7Z3NyEFcG78bWy7GG7nXsq9OpAJgo2xbyAlVBDweLSL5ghvyEZlkEamnAQpIUVK0CAVhs8nPvCiQuXT/VA==",
+      "version": "2.0.10",
+      "resolved": "https://registry.npmjs.org/conventional-changelog-core/-/conventional-changelog-core-2.0.10.tgz",
+      "integrity": "sha512-FP0NHXIbpvU+f5jk/qZdnodhFmlzKW8ENRHQIWT69oe7ffur9nFRVJZlnXnFBOzwHM9WIRbC15ZWh9HZN6t9Uw==",
       "dev": true,
       "requires": {
-        "conventional-changelog-writer": "3.0.4",
-        "conventional-commits-parser": "2.1.5",
+        "conventional-changelog-writer": "3.0.9",
+        "conventional-commits-parser": "2.1.7",
         "dateformat": "3.0.3",
         "get-pkg-repo": "1.4.0",
-        "git-raw-commits": "1.3.4",
+        "git-raw-commits": "1.3.6",
         "git-remote-origin-url": "2.0.0",
-        "git-semver-tags": "1.3.4",
+        "git-semver-tags": "1.3.6",
         "lodash": "4.17.4",
         "normalize-package-data": "2.4.0",
         "q": "1.5.1",
@@ -4463,27 +4464,27 @@
       }
     },
     "conventional-changelog-ember": {
-      "version": "0.3.6",
-      "resolved": "https://registry.npmjs.org/conventional-changelog-ember/-/conventional-changelog-ember-0.3.6.tgz",
-      "integrity": "sha512-hBM1xb5IrjNtsjXaGryPF/Wn36cwyjkNeqX/CIDbJv/1kRFBHsWoSPYBiNVEpg8xE5fcK4DbPhGTDN2sVoPeiA==",
+      "version": "0.3.11",
+      "resolved": "https://registry.npmjs.org/conventional-changelog-ember/-/conventional-changelog-ember-0.3.11.tgz",
+      "integrity": "sha512-ErjPPiDmTd/WPgj2bSp+CGsLtJiv7FbdPKjZXH2Cd5P7j44Rqf0V9SIAAYFTQNoPqmvcp+sIcr/vH52WzPJUbw==",
       "dev": true,
       "requires": {
         "q": "1.5.1"
       }
     },
     "conventional-changelog-eslint": {
-      "version": "1.0.5",
-      "resolved": "https://registry.npmjs.org/conventional-changelog-eslint/-/conventional-changelog-eslint-1.0.5.tgz",
-      "integrity": "sha512-7NUv+gMOS8Y49uPFRgF7kuLZqpnrKa2bQMZZsc62NzvaJmjUktnV03PYHuXhTDEHt5guvV9gyEFtUpgHCDkojg==",
+      "version": "1.0.9",
+      "resolved": "https://registry.npmjs.org/conventional-changelog-eslint/-/conventional-changelog-eslint-1.0.9.tgz",
+      "integrity": "sha512-h87nfVh2fdk9fJIvz26wCBsbDC/KxqCc5wSlNMZbXcARtbgNbNDIF7Y7ctokFdnxkzVdaHsbINkh548T9eBA7Q==",
       "dev": true,
       "requires": {
         "q": "1.5.1"
       }
     },
     "conventional-changelog-express": {
-      "version": "0.3.4",
-      "resolved": "https://registry.npmjs.org/conventional-changelog-express/-/conventional-changelog-express-0.3.4.tgz",
-      "integrity": "sha512-M+UUb715TXT6l9vyMf4HYvAepnQn0AYTcPi6KHrFsd80E0HErjQnqStBg8i3+Qm7EV9+RyATQEnIhSzHbdQ7+A==",
+      "version": "0.3.6",
+      "resolved": "https://registry.npmjs.org/conventional-changelog-express/-/conventional-changelog-express-0.3.6.tgz",
+      "integrity": "sha512-3iWVtBJZ9RnRnZveNDzOD8QRn6g6vUif0qVTWWyi5nUIAbuN1FfPVyKdAlJJfp5Im+dE8Kiy/d2SpaX/0X678Q==",
       "dev": true,
       "requires": {
         "q": "1.5.1"
@@ -4508,9 +4509,9 @@
       }
     },
     "conventional-changelog-jshint": {
-      "version": "0.3.4",
-      "resolved": "https://registry.npmjs.org/conventional-changelog-jshint/-/conventional-changelog-jshint-0.3.4.tgz",
-      "integrity": "sha512-CdrqwDgL56b176FVxHmhuOvnO1dRDQvrMaHyuIVjcFlOXukATz2wVT17g8jQU3LvybVbyXvJRbdD5pboo7/1KQ==",
+      "version": "0.3.8",
+      "resolved": "https://registry.npmjs.org/conventional-changelog-jshint/-/conventional-changelog-jshint-0.3.8.tgz",
+      "integrity": "sha512-hn9QU4ZI/5V50wKPJNPGT4gEWgiBFpV6adieILW4MaUFynuDYOvQ71EMSj3EznJyKi/KzuXpc9dGmX8njZMjig==",
       "dev": true,
       "requires": {
         "compare-func": "1.3.2",
@@ -4518,19 +4519,19 @@
       }
     },
     "conventional-changelog-preset-loader": {
-      "version": "1.1.6",
-      "resolved": "https://registry.npmjs.org/conventional-changelog-preset-loader/-/conventional-changelog-preset-loader-1.1.6.tgz",
-      "integrity": "sha512-yWPIP9wwsCKeUSPYApnApWhKIDjWRIX/uHejGS1tYfEsQR/bwpDFET7LYiHT+ujNbrlf6h1s3NlPGheOd4yJRQ==",
+      "version": "1.1.8",
+      "resolved": "https://registry.npmjs.org/conventional-changelog-preset-loader/-/conventional-changelog-preset-loader-1.1.8.tgz",
+      "integrity": "sha512-MkksM4G4YdrMlT2MbTsV2F6LXu/hZR0Tc/yenRrDIKRwBl/SP7ER4ZDlglqJsCzLJi4UonBc52Bkm5hzrOVCcw==",
       "dev": true
     },
     "conventional-changelog-writer": {
-      "version": "3.0.4",
-      "resolved": "https://registry.npmjs.org/conventional-changelog-writer/-/conventional-changelog-writer-3.0.4.tgz",
-      "integrity": "sha512-EUf/hWiEj3IOa5Jk8XDzM6oS0WgijlYGkUfLc+mDnLH9RwpZqhYIBwgJHWHzEB4My013wx2FhmUu45P6tQrucw==",
+      "version": "3.0.9",
+      "resolved": "https://registry.npmjs.org/conventional-changelog-writer/-/conventional-changelog-writer-3.0.9.tgz",
+      "integrity": "sha512-n9KbsxlJxRQsUnK6wIBRnARacvNnN4C/nxnxCkH+B/R1JS2Fa+DiP1dU4I59mEDEjgnFaN2+9wr1P1s7GYB5/Q==",
       "dev": true,
       "requires": {
         "compare-func": "1.3.2",
-        "conventional-commits-filter": "1.1.5",
+        "conventional-commits-filter": "1.1.6",
         "dateformat": "3.0.3",
         "handlebars": "4.0.11",
         "json-stringify-safe": "5.0.1",
@@ -4667,19 +4668,19 @@
       }
     },
     "conventional-commits-filter": {
-      "version": "1.1.5",
-      "resolved": "https://registry.npmjs.org/conventional-commits-filter/-/conventional-commits-filter-1.1.5.tgz",
-      "integrity": "sha512-mj3+WLj8UZE72zO9jocZjx8+W4Bwnx/KHoIz1vb4F8XUXj0XSjp8Y3MFkpRyIpsRiCBX+DkDjxGKF/nfeu7BGw==",
+      "version": "1.1.6",
+      "resolved": "https://registry.npmjs.org/conventional-commits-filter/-/conventional-commits-filter-1.1.6.tgz",
+      "integrity": "sha512-KcDgtCRKJCQhyk6VLT7zR+ZOyCnerfemE/CsR3iQpzRRFbLEs0Y6rwk3mpDvtOh04X223z+1xyJ582Stfct/0Q==",
       "dev": true,
       "requires": {
         "is-subset": "0.1.1",
-        "modify-values": "1.0.0"
+        "modify-values": "1.0.1"
       }
     },
     "conventional-commits-parser": {
-      "version": "2.1.5",
-      "resolved": "https://registry.npmjs.org/conventional-commits-parser/-/conventional-commits-parser-2.1.5.tgz",
-      "integrity": "sha512-jaAP61py+ISMF3/n3yIiIuY5h6mJlucOqawu5mLB1HaQADLvg/y5UB3pT7HSucZJan34lp7+7ylQPfbKEGmxrA==",
+      "version": "2.1.7",
+      "resolved": "https://registry.npmjs.org/conventional-commits-parser/-/conventional-commits-parser-2.1.7.tgz",
+      "integrity": "sha512-BoMaddIEJ6B4QVMSDu9IkVImlGOSGA1I2BQyOZHeLQ6qVOJLcLKn97+fL6dGbzWEiqDzfH4OkcveULmeq2MHFQ==",
       "dev": true,
       "requires": {
         "JSONStream": "1.3.2",
@@ -4822,10 +4823,10 @@
       "integrity": "sha1-7tlcP1w3uT7L8qLtL++5/Cbh0xs=",
       "dev": true,
       "requires": {
-        "conventional-changelog": "1.1.18",
+        "conventional-changelog": "1.1.23",
         "dateformat": "3.0.3",
         "gh-got": "6.0.0",
-        "git-semver-tags": "1.3.4",
+        "git-semver-tags": "1.3.6",
         "lodash.merge": "4.6.1",
         "meow": "3.7.0",
         "object-assign": "4.1.1",
@@ -5275,9 +5276,9 @@
       "dev": true
     },
     "cypress": {
-      "version": "1.4.1",
-      "resolved": "https://registry.npmjs.org/cypress/-/cypress-1.4.1.tgz",
-      "integrity": "sha1-YvQHSgDm8S4t/jiKf06BaknOsD8=",
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/cypress/-/cypress-2.1.0.tgz",
+      "integrity": "sha512-EKXGjKFKUkhXXfAkYixBN2Lo2Gji4ZGC+ezWflRf/co49+OyHarZaXp7Y/n826WjmMdpHTmkOw4wUWBgyFHEHQ==",
       "dev": true,
       "requires": {
         "@cypress/listr-verbose-renderer": "0.4.1",
@@ -5419,7 +5420,7 @@
       "integrity": "sha1-dUu1v+VUUdpppYuU1F9MWwRi1Y8=",
       "dev": true,
       "requires": {
-        "es5-ext": "0.10.41"
+        "es5-ext": "0.10.42"
       }
     },
     "dargs": {
@@ -5601,7 +5602,7 @@
       "requires": {
         "globby": "6.1.0",
         "is-path-cwd": "1.0.0",
-        "is-path-in-cwd": "1.0.0",
+        "is-path-in-cwd": "1.0.1",
         "p-map": "1.2.0",
         "pify": "3.0.0",
         "rimraf": "2.6.2"
@@ -5938,15 +5939,15 @@
       "dev": true
     },
     "ejs": {
-      "version": "2.5.7",
-      "resolved": "https://registry.npmjs.org/ejs/-/ejs-2.5.7.tgz",
-      "integrity": "sha1-zIcsFoiArjxxiXYv1f/ACJbJUYo=",
+      "version": "2.5.8",
+      "resolved": "https://registry.npmjs.org/ejs/-/ejs-2.5.8.tgz",
+      "integrity": "sha512-QIDZL54fyV8MDcAsO91BMH1ft2qGGaHIJsJIA/+t+7uvXol1dm413fPcUgUb4k8F/9457rx4/KFE4XfDifrQxQ==",
       "dev": true
     },
     "electron-to-chromium": {
-      "version": "1.3.40",
-      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.40.tgz",
-      "integrity": "sha1-H71tl779crim+SHcONIkE9L2/d8=",
+      "version": "1.3.41",
+      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.41.tgz",
+      "integrity": "sha1-fjNkPgDNhe39F+BBlPbQDnNzcjU=",
       "dev": true
     },
     "elegant-spinner": {
@@ -6162,9 +6163,9 @@
       }
     },
     "es5-ext": {
-      "version": "0.10.41",
-      "resolved": "https://registry.npmjs.org/es5-ext/-/es5-ext-0.10.41.tgz",
-      "integrity": "sha512-MYK02wXfwTMie5TEJWPolgOsXEmz7wKCQaGzgmRjZOoV6VLG8I5dSv2bn6AOClXhK64gnSQTQ9W9MKvx87J4gw==",
+      "version": "0.10.42",
+      "resolved": "https://registry.npmjs.org/es5-ext/-/es5-ext-0.10.42.tgz",
+      "integrity": "sha512-AJxO1rmPe1bDEfSR6TJ/FgMFYuTBhR5R57KW58iCkYACMyFbrkqVyzXSurYoScDGvgyMpk7uRF/lPUPPTmsRSA==",
       "dev": true,
       "requires": {
         "es6-iterator": "2.0.3",
@@ -6179,7 +6180,7 @@
       "dev": true,
       "requires": {
         "d": "1.0.0",
-        "es5-ext": "0.10.41",
+        "es5-ext": "0.10.42",
         "es6-symbol": "3.1.1"
       }
     },
@@ -6190,7 +6191,7 @@
       "dev": true,
       "requires": {
         "d": "1.0.0",
-        "es5-ext": "0.10.41",
+        "es5-ext": "0.10.42",
         "es6-iterator": "2.0.3",
         "es6-set": "0.1.5",
         "es6-symbol": "3.1.1",
@@ -6204,7 +6205,7 @@
       "dev": true,
       "requires": {
         "d": "1.0.0",
-        "es5-ext": "0.10.41",
+        "es5-ext": "0.10.42",
         "es6-iterator": "2.0.3",
         "es6-symbol": "3.1.1",
         "event-emitter": "0.3.5"
@@ -6217,7 +6218,7 @@
       "dev": true,
       "requires": {
         "d": "1.0.0",
-        "es5-ext": "0.10.41"
+        "es5-ext": "0.10.42"
       }
     },
     "es6-templates": {
@@ -6237,7 +6238,7 @@
       "dev": true,
       "requires": {
         "d": "1.0.0",
-        "es5-ext": "0.10.41",
+        "es5-ext": "0.10.42",
         "es6-iterator": "2.0.3",
         "es6-symbol": "3.1.1"
       }
@@ -6349,7 +6350,7 @@
       "dev": true,
       "requires": {
         "d": "1.0.0",
-        "es5-ext": "0.10.41"
+        "es5-ext": "0.10.42"
       }
     },
     "event-stream": {
@@ -6791,9 +6792,9 @@
       }
     },
     "filesize": {
-      "version": "3.6.0",
-      "resolved": "https://registry.npmjs.org/filesize/-/filesize-3.6.0.tgz",
-      "integrity": "sha512-g5OWtoZWcPI56js1DFhIEqyG9tnu/7sG3foHwgS9KGYFMfsYguI3E+PRVCmtmE96VajQIEMRU2OhN+ME589Gdw==",
+      "version": "3.6.1",
+      "resolved": "https://registry.npmjs.org/filesize/-/filesize-3.6.1.tgz",
+      "integrity": "sha512-7KjR1vv6qnicaPMi1iiTcI85CyYwRO/PSFCu6SvqL8jN2Wjt/NIYQTFtFs7fSDCYOstUkEWIQGFUg5YZQfjlcg==",
       "dev": true
     },
     "fill-range": {
@@ -8068,9 +8069,9 @@
       }
     },
     "git-raw-commits": {
-      "version": "1.3.4",
-      "resolved": "https://registry.npmjs.org/git-raw-commits/-/git-raw-commits-1.3.4.tgz",
-      "integrity": "sha512-G3O+41xHbscpgL5nA0DUkbFVgaAz5rd57AMSIMew8p7C8SyFwZDyn08MoXHkTl9zcD0LmxsLFPxbqFY4YPbpPA==",
+      "version": "1.3.6",
+      "resolved": "https://registry.npmjs.org/git-raw-commits/-/git-raw-commits-1.3.6.tgz",
+      "integrity": "sha512-svsK26tQ8vEKnMshTDatSIQSMDdz8CxIIqKsvPqbtV23Etmw6VNaFAitu8zwZ0VrOne7FztwPyRLxK7/DIUTQg==",
       "dev": true,
       "requires": {
         "dargs": "4.1.0",
@@ -8224,9 +8225,9 @@
       }
     },
     "git-semver-tags": {
-      "version": "1.3.4",
-      "resolved": "https://registry.npmjs.org/git-semver-tags/-/git-semver-tags-1.3.4.tgz",
-      "integrity": "sha512-Xe2Z74MwXZfAezuaO6e6cA4nsgeCiARPzaBp23gma325c/OXdt//PhrknptIaynNeUp2yWtmikV7k5RIicgGIQ==",
+      "version": "1.3.6",
+      "resolved": "https://registry.npmjs.org/git-semver-tags/-/git-semver-tags-1.3.6.tgz",
+      "integrity": "sha512-2jHlJnln4D/ECk9FxGEBh3k44wgYdWjWDtMmJPaecjoRmxKo3Y1Lh8GMYuOPu04CHw86NTAODchYjC5pnpMQig==",
       "dev": true,
       "requires": {
         "meow": "4.0.0",
@@ -8474,7 +8475,7 @@
         "is-retry-allowed": "1.1.0",
         "is-stream": "1.1.0",
         "isurl": "1.0.0",
-        "lowercase-keys": "1.0.0",
+        "lowercase-keys": "1.0.1",
         "p-cancelable": "0.3.0",
         "p-timeout": "1.2.1",
         "safe-buffer": "5.1.1",
@@ -9204,9 +9205,9 @@
       "dev": true
     },
     "ieee754": {
-      "version": "1.1.10",
-      "resolved": "https://registry.npmjs.org/ieee754/-/ieee754-1.1.10.tgz",
-      "integrity": "sha512-byWFX8OyW/qeVxcY21r6Ncxl0ZYHgnf0cPup2h34eHXrCJbOp7IuqnJ4Q0omfyWl6Z++BTI6bByf31pZt7iRLg==",
+      "version": "1.1.11",
+      "resolved": "https://registry.npmjs.org/ieee754/-/ieee754-1.1.11.tgz",
+      "integrity": "sha512-VhDzCKN7K8ufStx/CLj5/PDTMgph+qwN5Pkd5i0sGnVwk56zJ0lkT8Qzi1xqWLS0Wp29DgDtNeS7v8/wMoZeHg==",
       "dev": true
     },
     "iferr": {
@@ -9713,9 +9714,9 @@
       "dev": true
     },
     "is-path-in-cwd": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/is-path-in-cwd/-/is-path-in-cwd-1.0.0.tgz",
-      "integrity": "sha1-ZHdYK4IU1gI0YJRWcAO+ip6sBNw=",
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/is-path-in-cwd/-/is-path-in-cwd-1.0.1.tgz",
+      "integrity": "sha512-FjV1RTW48E7CWM7eE/J2NJvAEEVektecDBVBE5Hh3nM1Jd0kvhHtX68Pr3xsDf857xt3Y4AkwVULK1Vku62aaQ==",
       "dev": true,
       "requires": {
         "is-path-inside": "1.0.1"
@@ -9861,6 +9862,12 @@
       "integrity": "sha1-Sj6XTsDLqQBNP8bN5yCeppNopiE=",
       "dev": true
     },
+    "isemail": {
+      "version": "2.2.1",
+      "resolved": "https://registry.npmjs.org/isemail/-/isemail-2.2.1.tgz",
+      "integrity": "sha1-A1PT2aYpUQgMJiwqoKQrjqjp4qY=",
+      "dev": true
+    },
     "isexe": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz",
@@ -10118,6 +10125,12 @@
         "is-object": "1.0.1"
       }
     },
+    "items": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/items/-/items-2.1.1.tgz",
+      "integrity": "sha1-i9FtnIOxlSneWuoyGsqtp4NkoZg=",
+      "dev": true
+    },
     "jasmine": {
       "version": "2.8.0",
       "resolved": "https://registry.npmjs.org/jasmine/-/jasmine-2.8.0.tgz",
@@ -10164,6 +10177,27 @@
       "integrity": "sha1-43zwsX8ZnM4jvqcbIDk5Uka07E4=",
       "dev": true
     },
+    "joi": {
+      "version": "9.2.0",
+      "resolved": "https://registry.npmjs.org/joi/-/joi-9.2.0.tgz",
+      "integrity": "sha1-M4WseQGSEwy+Iw6ALsAskhW7/to=",
+      "dev": true,
+      "requires": {
+        "hoek": "4.2.1",
+        "isemail": "2.2.1",
+        "items": "2.1.1",
+        "moment": "2.21.0",
+        "topo": "2.0.2"
+      },
+      "dependencies": {
+        "hoek": {
+          "version": "4.2.1",
+          "resolved": "https://registry.npmjs.org/hoek/-/hoek-4.2.1.tgz",
+          "integrity": "sha512-QLg82fGkfnJ/4iy1xZ81/9SIJiq1NGFUMGs6ParyjBZr6jW2Ufj/snDqTHixNlHdPNwN2RLVD0Pi3igeK9+JfA==",
+          "dev": true
+        }
+      }
+    },
     "js-base64": {
       "version": "2.4.3",
       "resolved": "https://registry.npmjs.org/js-base64/-/js-base64-2.4.3.tgz",
@@ -10519,7 +10553,7 @@
           "dev": true,
           "requires": {
             "base64-js": "1.2.3",
-            "ieee754": "1.1.10"
+            "ieee754": "1.1.11"
           }
         },
         "log4js": {
@@ -10539,6 +10573,12 @@
           "integrity": "sha1-FQ4gt1ZZCtP5EJPyWk8q2L/zC6M=",
           "dev": true
         },
+        "punycode": {
+          "version": "1.4.1",
+          "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.4.1.tgz",
+          "integrity": "sha1-wNWmOycYgArY4esPpSachN1BhF4=",
+          "dev": true
+        },
         "remap-istanbul": {
           "version": "0.8.4",
           "resolved": "https://registry.npmjs.org/remap-istanbul/-/remap-istanbul-0.8.4.tgz",
@@ -10692,7 +10732,7 @@
       "integrity": "sha512-NqAFodJdpBUuf1iD+Ij8hQvF0rCFKlO2KaieoQzAPhFgzLCtJnC7Z7x5gQbGNjoe++wOKAtAmwVEIBLqq2Yp1A==",
       "dev": true,
       "requires": {
-        "ejs": "2.5.7"
+        "ejs": "2.5.8"
       }
     },
     "limiter": {
@@ -11261,9 +11301,9 @@
       "dev": true
     },
     "lowercase-keys": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/lowercase-keys/-/lowercase-keys-1.0.0.tgz",
-      "integrity": "sha1-TjNms55/VFfjXxMkvfb4jQv8cwY=",
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/lowercase-keys/-/lowercase-keys-1.0.1.tgz",
+      "integrity": "sha512-G2Lj61tXDnVFFOi8VZds+SoQjtQC3dgokKdDG2mTm1tx4m50NUHBOZSBwQQHyy0V12A0JTG4icfZQH+xPyh8VA==",
       "dev": true
     },
     "lru-cache": {
@@ -11328,9 +11368,9 @@
       }
     },
     "marked": {
-      "version": "0.3.17",
-      "resolved": "https://registry.npmjs.org/marked/-/marked-0.3.17.tgz",
-      "integrity": "sha512-+AKbNsjZl6jFfLPwHhWmGTqE009wTKn3RTmn9K8oUKHrX/abPJjtcRtXpYB/FFrwPJRUA86LX/de3T0knkPCmQ==",
+      "version": "0.3.19",
+      "resolved": "https://registry.npmjs.org/marked/-/marked-0.3.19.tgz",
+      "integrity": "sha512-ea2eGWOqNxPcXv8dyERdSr/6FmzvWwzjMxpfGB/sbMccXoct+xY+YukPD+QTUZwyvK7BZwcr4m21WBOW41pAkg==",
       "dev": true
     },
     "md5.js": {
@@ -11642,9 +11682,9 @@
       }
     },
     "modify-values": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/modify-values/-/modify-values-1.0.0.tgz",
-      "integrity": "sha1-4rbN65zhn5kxelNyLz2/XfXqqrI=",
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/modify-values/-/modify-values-1.0.1.tgz",
+      "integrity": "sha512-xV2bxeN6F7oYjZWTe/YPAy6MN2M+sL4u/Rlm2AHCIVGfo2p1yGmBHQ6vHehl4bRTZBdHu3TSkWdYgkwpYzAGSw==",
       "dev": true
     },
     "moment": {
@@ -11808,7 +11848,7 @@
         "listr": "0.12.0",
         "lodash": "4.17.4",
         "meow": "3.7.0",
-        "node-sass": "4.7.2",
+        "node-sass": "4.8.3",
         "node-sass-tilde-importer": "1.0.2",
         "read-pkg": "2.0.0",
         "semver": "5.3.0",
@@ -12290,6 +12330,14 @@
         "url": "0.11.0",
         "util": "0.10.3",
         "vm-browserify": "0.0.4"
+      },
+      "dependencies": {
+        "punycode": {
+          "version": "1.4.1",
+          "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.4.1.tgz",
+          "integrity": "sha1-wNWmOycYgArY4esPpSachN1BhF4=",
+          "dev": true
+        }
       }
     },
     "node-modules-path": {
@@ -12299,9 +12347,9 @@
       "dev": true
     },
     "node-sass": {
-      "version": "4.7.2",
-      "resolved": "https://registry.npmjs.org/node-sass/-/node-sass-4.7.2.tgz",
-      "integrity": "sha512-CaV+wLqZ7//Jdom5aUFCpGNoECd7BbNhjuwdsX/LkXBrHl8eb1Wjw4HvWqcFvhr5KuNgAk8i/myf/MQ1YYeroA==",
+      "version": "4.8.3",
+      "resolved": "https://registry.npmjs.org/node-sass/-/node-sass-4.8.3.tgz",
+      "integrity": "sha512-tfFWhUsCk/Y19zarDcPo5xpj+IW3qCfOjVdHtYeG6S1CKbQOh1zqylnQK6cV3z9k80yxAnFX9Y+a9+XysDhhfg==",
       "dev": true,
       "requires": {
         "async-foreach": "0.1.3",
@@ -12973,7 +13021,7 @@
             "is-redirect": "1.0.0",
             "is-retry-allowed": "1.1.0",
             "is-stream": "1.1.0",
-            "lowercase-keys": "1.0.0",
+            "lowercase-keys": "1.0.1",
             "safe-buffer": "5.1.1",
             "timed-out": "4.0.1",
             "unzip-response": "2.0.1",
@@ -13282,9 +13330,9 @@
       "dev": true
     },
     "postcss": {
-      "version": "6.0.20",
-      "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.20.tgz",
-      "integrity": "sha512-Opr6usW30Iy0xEDrJywDckRxtylfO7gTGs3Kfb2LdLQlGsUg89fTy0R3Vm1Dub2YHO7MK58avr0p70+uFFHb7A==",
+      "version": "6.0.21",
+      "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.21.tgz",
+      "integrity": "sha512-y/bKfbQz2Nn/QBC08bwvYUxEFOVGfPIUOTsJ2CK5inzlXW9SdYR1x4pEsG9blRAF/PX+wRNdOah+gx/hv4q7dw==",
       "dev": true,
       "requires": {
         "chalk": "2.3.2",
@@ -13332,7 +13380,7 @@
       "integrity": "sha512-5l327iI75POonjxkXgdRCUS+AlzAdBx4pOvMEhTKTCjb1p8IEeVR9yx3cPbmN7LIWJLbfnIXxAhoB4jpD0c/Cw==",
       "dev": true,
       "requires": {
-        "postcss": "6.0.20",
+        "postcss": "6.0.21",
         "postcss-value-parser": "3.3.0",
         "read-cache": "1.0.0",
         "resolve": "1.6.0"
@@ -13377,7 +13425,7 @@
       "dev": true,
       "requires": {
         "loader-utils": "1.1.0",
-        "postcss": "6.0.20",
+        "postcss": "6.0.21",
         "postcss-load-config": "1.2.0",
         "schema-utils": "0.4.5"
       }
@@ -13391,7 +13439,7 @@
         "mime": "1.6.0",
         "minimatch": "3.0.4",
         "mkdirp": "0.5.1",
-        "postcss": "6.0.20",
+        "postcss": "6.0.21",
         "xxhashjs": "0.2.2"
       }
     },
@@ -13481,7 +13529,7 @@
       "integrity": "sha1-myIXQXCaTGLVzVPGqt1UpxE36V8=",
       "dev": true,
       "requires": {
-        "@types/node": "6.0.102",
+        "@types/node": "6.0.103",
         "@types/q": "0.0.32",
         "@types/selenium-webdriver": "2.53.43",
         "blocking-proxy": "0.0.5",
@@ -13499,9 +13547,9 @@
       },
       "dependencies": {
         "@types/node": {
-          "version": "6.0.102",
-          "resolved": "https://registry.npmjs.org/@types/node/-/node-6.0.102.tgz",
-          "integrity": "sha512-EhNufyBoC1Kqaj+XMHGzi6mPUC8wVABOMTPE5XaSJc49LIVvXsyrV1HYMAPTUViT7E4wLUB38OdDmb+HshjGmA==",
+          "version": "6.0.103",
+          "resolved": "https://registry.npmjs.org/@types/node/-/node-6.0.103.tgz",
+          "integrity": "sha512-EHU5B9OlENiGEziLiC2XjhjBoVTiX6s4JwZrMHkLQzrzOA0bfZKfcT3fZaalgujcrs2O97VgKaxqguwV+12UJQ==",
           "dev": true
         },
         "ansi-styles": {
@@ -13531,7 +13579,7 @@
           "requires": {
             "globby": "5.0.0",
             "is-path-cwd": "1.0.0",
-            "is-path-in-cwd": "1.0.0",
+            "is-path-in-cwd": "1.0.1",
             "object-assign": "4.1.1",
             "pify": "2.3.0",
             "pinkie-promise": "2.0.1",
@@ -13672,9 +13720,9 @@
       }
     },
     "punycode": {
-      "version": "1.4.1",
-      "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.4.1.tgz",
-      "integrity": "sha1-wNWmOycYgArY4esPpSachN1BhF4=",
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/punycode/-/punycode-2.1.0.tgz",
+      "integrity": "sha1-X4Y+3Im5bbCQdLrXlHvwkFbKTn0=",
       "dev": true
     },
     "q": {
@@ -14515,19 +14563,20 @@
       "integrity": "sha512-yYrjb9TX2k/J1Y5UNy3KYdZq10xhYcF8nMpAW6o3hy6Q8WSIEf9lJHG/ePnOBfziPM3fvQwfOwa13U/Fh8qTfA==",
       "dev": true,
       "requires": {
-        "ajv": "6.3.0",
+        "ajv": "6.4.0",
         "ajv-keywords": "3.1.0"
       },
       "dependencies": {
         "ajv": {
-          "version": "6.3.0",
-          "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.3.0.tgz",
-          "integrity": "sha1-FlCkERTvAFdMrBC4Ay2PTBSBLac=",
+          "version": "6.4.0",
+          "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.4.0.tgz",
+          "integrity": "sha1-06/3jpJ3VJdx2vAWTP9ISCt1T8Y=",
           "dev": true,
           "requires": {
             "fast-deep-equal": "1.1.0",
             "fast-json-stable-stringify": "2.0.0",
-            "json-schema-traverse": "0.3.1"
+            "json-schema-traverse": "0.3.1",
+            "uri-js": "3.0.2"
           }
         }
       }
@@ -15182,7 +15231,7 @@
       "integrity": "sha512-0KW2wvzfxm8NCTb30z0LMNyPqWCdDGE2viwzUaucqJdkTRXtZiSY3I+2A6nVAjmdOy0I4gU8DwnVVGsk9jvP2A==",
       "dev": true,
       "requires": {
-        "atob": "2.0.3",
+        "atob": "2.1.0",
         "decode-uri-component": "0.2.0",
         "resolve-url": "0.2.1",
         "source-map-url": "0.4.0",
@@ -15923,6 +15972,23 @@
         }
       }
     },
+    "topo": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/topo/-/topo-2.0.2.tgz",
+      "integrity": "sha1-zVYVdSU5BXwNwEkaYhw7xvvh0YI=",
+      "dev": true,
+      "requires": {
+        "hoek": "4.2.1"
+      },
+      "dependencies": {
+        "hoek": {
+          "version": "4.2.1",
+          "resolved": "https://registry.npmjs.org/hoek/-/hoek-4.2.1.tgz",
+          "integrity": "sha512-QLg82fGkfnJ/4iy1xZ81/9SIJiq1NGFUMGs6ParyjBZr6jW2Ufj/snDqTHixNlHdPNwN2RLVD0Pi3igeK9+JfA==",
+          "dev": true
+        }
+      }
+    },
     "toposort": {
       "version": "1.0.6",
       "resolved": "https://registry.npmjs.org/toposort/-/toposort-1.0.6.tgz",
@@ -15936,6 +16002,14 @@
       "dev": true,
       "requires": {
         "punycode": "1.4.1"
+      },
+      "dependencies": {
+        "punycode": {
+          "version": "1.4.1",
+          "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.4.1.tgz",
+          "integrity": "sha1-wNWmOycYgArY4esPpSachN1BhF4=",
+          "dev": true
+        }
       }
     },
     "tree-kill": {
@@ -16160,7 +16234,7 @@
         "resolve": "1.6.0",
         "semver": "5.5.0",
         "tslib": "1.9.0",
-        "tsutils": "2.22.2"
+        "tsutils": "2.24.0"
       }
     },
     "tslint-config-valorsoft": {
@@ -16170,9 +16244,9 @@
       "dev": true
     },
     "tsutils": {
-      "version": "2.22.2",
-      "resolved": "https://registry.npmjs.org/tsutils/-/tsutils-2.22.2.tgz",
-      "integrity": "sha512-u06FUSulCJ+Y8a2ftuqZN6kIGqdP2yJjUPEngXqmdPND4UQfb04igcotH+dw+IFr417yP6muCLE8/5/Qlfnx0w==",
+      "version": "2.24.0",
+      "resolved": "https://registry.npmjs.org/tsutils/-/tsutils-2.24.0.tgz",
+      "integrity": "sha512-rOIkvoe17acR3r96IPnqwa1+Z7zx9AroEtEKl20IeExXtoWptqG/zb806cYOvdbQGcxh1eOaZQNruOQ716Edig==",
       "dev": true,
       "requires": {
         "tslib": "1.9.0"
@@ -16248,7 +16322,7 @@
         "handlebars": "4.0.11",
         "highlight.js": "9.12.0",
         "lodash": "4.17.4",
-        "marked": "0.3.17",
+        "marked": "0.3.19",
         "minimatch": "3.0.4",
         "progress": "2.0.0",
         "shelljs": "0.7.8",
@@ -16532,7 +16606,7 @@
       "requires": {
         "boxen": "1.3.0",
         "chalk": "1.1.3",
-        "configstore": "3.1.1",
+        "configstore": "3.1.2",
         "import-lazy": "2.1.0",
         "is-npm": "1.0.0",
         "latest-version": "3.1.0",
@@ -16573,6 +16647,15 @@
       "integrity": "sha1-9rRQHC7EzdJrp4vnIilh3ndiFZg=",
       "dev": true
     },
+    "uri-js": {
+      "version": "3.0.2",
+      "resolved": "https://registry.npmjs.org/uri-js/-/uri-js-3.0.2.tgz",
+      "integrity": "sha1-+QuFhQf4HepNz7s8TD2/orVX+qo=",
+      "dev": true,
+      "requires": {
+        "punycode": "2.1.0"
+      }
+    },
     "urix": {
       "version": "0.1.0",
       "resolved": "https://registry.npmjs.org/urix/-/urix-0.1.0.tgz",
@@ -16823,6 +16906,27 @@
       "integrity": "sha1-wGavtYK7HLQSjWDqkjkulNXp2+w=",
       "dev": true
     },
+    "wait-on": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/wait-on/-/wait-on-2.1.0.tgz",
+      "integrity": "sha512-hDwJ674+7dfiiK/cxtYCwPxlnjXDjto/pCz1PF02sXUhqCqCWsgvxZln0699PReWqXXgkxqkF6DDo5Rj9sjNvw==",
+      "dev": true,
+      "requires": {
+        "core-js": "2.5.3",
+        "joi": "9.2.0",
+        "minimist": "1.2.0",
+        "request": "2.81.0",
+        "rx": "4.1.0"
+      },
+      "dependencies": {
+        "minimist": {
+          "version": "1.2.0",
+          "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz",
+          "integrity": "sha1-o1AIsg9BOD7sH7kU9M1d95omQoQ=",
+          "dev": true
+        }
+      }
+    },
     "walkdir": {
       "version": "0.0.11",
       "resolved": "https://registry.npmjs.org/walkdir/-/walkdir-0.0.11.tgz",
@@ -16863,7 +16967,7 @@
       "integrity": "sha512-RSlipNQB1u48cq0wH/BNfCu1tD/cJ8ydFIkNYhp9o+3d+8unClkIovpW5qpFPgmL9OE48wfAnlZydXByWP82AA==",
       "dev": true,
       "requires": {
-        "chokidar": "2.0.2",
+        "chokidar": "2.0.3",
         "graceful-fs": "4.1.11",
         "neo-async": "2.5.0"
       },
@@ -16874,7 +16978,7 @@
           "integrity": "sha512-5teOsQWABXHHBFP9y3skS5P3d/WfWXpv3FUpy+LorMrNYaT9pI4oLMQX7jzQ2KklNpGpWHzdCXTDT2Y3XGlZBw==",
           "dev": true,
           "requires": {
-            "micromatch": "3.1.9",
+            "micromatch": "3.1.10",
             "normalize-path": "2.1.1"
           }
         },
@@ -16931,9 +17035,9 @@
           }
         },
         "chokidar": {
-          "version": "2.0.2",
-          "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-2.0.2.tgz",
-          "integrity": "sha512-l32Hw3wqB0L2kGVmSbK/a+xXLDrUEsc84pSgMkmwygHvD7ubRsP/vxxHa5BtB6oix1XLLVCHyYMsckRXxThmZw==",
+          "version": "2.0.3",
+          "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-2.0.3.tgz",
+          "integrity": "sha512-zW8iXYZtXMx4kux/nuZVXjkLP+CyIK5Al5FHnj1OgTKGZfp4Oy6/ymtMSKFv3GD8DviEmUPmJg9eFdJ/JzudMg==",
           "dev": true,
           "requires": {
             "anymatch": "2.0.0",
@@ -17170,9 +17274,9 @@
           "dev": true
         },
         "micromatch": {
-          "version": "3.1.9",
-          "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-3.1.9.tgz",
-          "integrity": "sha512-SlIz6sv5UPaAVVFRKodKjCg48EbNoIhgetzfK/Cy0v5U52Z6zB136M8tp0UC9jM53LYbmIRihJszvvqpKkfm9g==",
+          "version": "3.1.10",
+          "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-3.1.10.tgz",
+          "integrity": "sha512-MWikgl9n9M3w+bpsY3He8L+w9eF9338xRl8IAO5viDizwSzziFEyUzo2xrrloB64ADbTf8uA8vRqqttDTOmccg==",
           "dev": true,
           "requires": {
             "arr-diff": "4.0.0",
@@ -17393,7 +17497,7 @@
       "requires": {
         "acorn": "5.5.3",
         "acorn-dynamic-import": "2.0.2",
-        "ajv": "6.3.0",
+        "ajv": "6.4.0",
         "ajv-keywords": "3.1.0",
         "async": "2.6.0",
         "enhanced-resolve": "3.4.1",
@@ -17416,14 +17520,15 @@
       },
       "dependencies": {
         "ajv": {
-          "version": "6.3.0",
-          "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.3.0.tgz",
-          "integrity": "sha1-FlCkERTvAFdMrBC4Ay2PTBSBLac=",
+          "version": "6.4.0",
+          "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.4.0.tgz",
+          "integrity": "sha1-06/3jpJ3VJdx2vAWTP9ISCt1T8Y=",
           "dev": true,
           "requires": {
             "fast-deep-equal": "1.1.0",
             "fast-json-stable-stringify": "2.0.0",
-            "json-schema-traverse": "0.3.1"
+            "json-schema-traverse": "0.3.1",
+            "uri-js": "3.0.2"
           }
         },
         "ansi-regex": {
@@ -17670,9 +17775,9 @@
         "acorn": "5.5.3",
         "chalk": "1.1.3",
         "commander": "2.15.1",
-        "ejs": "2.5.7",
+        "ejs": "2.5.8",
         "express": "4.16.3",
-        "filesize": "3.6.0",
+        "filesize": "3.6.1",
         "gzip-size": "3.0.0",
         "lodash": "4.17.4",
         "mkdirp": "0.5.1",
@@ -17766,7 +17871,7 @@
         "ansi-html": "0.0.7",
         "array-includes": "3.0.3",
         "bonjour": "3.5.0",
-        "chokidar": "2.0.2",
+        "chokidar": "2.0.3",
         "compression": "1.7.1",
         "connect-history-api-fallback": "1.5.0",
         "debug": "3.1.0",
@@ -17798,7 +17903,7 @@
           "integrity": "sha512-5teOsQWABXHHBFP9y3skS5P3d/WfWXpv3FUpy+LorMrNYaT9pI4oLMQX7jzQ2KklNpGpWHzdCXTDT2Y3XGlZBw==",
           "dev": true,
           "requires": {
-            "micromatch": "3.1.9",
+            "micromatch": "3.1.10",
             "normalize-path": "2.1.1"
           }
         },
@@ -17861,9 +17966,9 @@
           "dev": true
         },
         "chokidar": {
-          "version": "2.0.2",
-          "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-2.0.2.tgz",
-          "integrity": "sha512-l32Hw3wqB0L2kGVmSbK/a+xXLDrUEsc84pSgMkmwygHvD7ubRsP/vxxHa5BtB6oix1XLLVCHyYMsckRXxThmZw==",
+          "version": "2.0.3",
+          "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-2.0.3.tgz",
+          "integrity": "sha512-zW8iXYZtXMx4kux/nuZVXjkLP+CyIK5Al5FHnj1OgTKGZfp4Oy6/ymtMSKFv3GD8DviEmUPmJg9eFdJ/JzudMg==",
           "dev": true,
           "requires": {
             "anymatch": "2.0.0",
@@ -18124,9 +18229,9 @@
           "dev": true
         },
         "micromatch": {
-          "version": "3.1.9",
-          "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-3.1.9.tgz",
-          "integrity": "sha512-SlIz6sv5UPaAVVFRKodKjCg48EbNoIhgetzfK/Cy0v5U52Z6zB136M8tp0UC9jM53LYbmIRihJszvvqpKkfm9g==",
+          "version": "3.1.10",
+          "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-3.1.10.tgz",
+          "integrity": "sha512-MWikgl9n9M3w+bpsY3He8L+w9eF9338xRl8IAO5viDizwSzziFEyUzo2xrrloB64ADbTf8uA8vRqqttDTOmccg==",
           "dev": true,
           "requires": {
             "arr-diff": "4.0.0",
diff --git a/package.json b/package.json
index 6e110513a9..17b2f2ed27 100644
--- a/package.json
+++ b/package.json
@@ -37,7 +37,7 @@
     "git-commit-changelog": "git commit -am \"chore(changelog): update [skip ci] \"",
     "changelog": "conventional-changelog -i CHANGELOG.md -s -p angular -r 2",
     "cy:open": "cypress open",
-    "cy:run": "cypress run",
+    "cy:run": "cypress run --config videoRecording=false",
     "view-stats": "webpack-bundle-analyzer demo/dist/stats.json",
     "build:dynamic": "run-s build link build:client-and-server-bundles webpack:server configure-heroku",
     "serve:dynamic": "node demo/dist/server.js",
@@ -66,7 +66,6 @@
     "url": "https://github.com/valor-software/ngx-bootstrap/issues"
   },
   "homepage": "https://github.com/valor-software/ngx-bootstrap#readme",
-  "dependencies": {},
   "peerDependencies": {
     "@angular/common": ">=4.3.0 || >5.0.0",
     "@angular/compiler": ">=4.3.0 || >5.0.0",
@@ -113,7 +112,7 @@
     "core-js": "2.5.3",
     "cpy": "6.0.0",
     "cpy-cli": "1.0.1",
-    "cypress": "1.4.1",
+    "cypress": "2.1.0",
     "gh-pages": "1.1.0",
     "gitignore-to-glob": "0.3.0",
     "google-code-prettify": "1.0.5",
@@ -154,6 +153,7 @@
     "tslint-config-valorsoft": "2.1.1",
     "typedoc": "0.9.0",
     "typescript": "2.4.2",
+    "wait-on": "2.1.0",
     "wallaby-webpack": "3.9.4",
     "webpack-bundle-analyzer": "2.9.2",
     "zone.js": "0.8.17"