docs: add e2e tests for `elements` example (#24840)

PR Close #24840
2018-07-12 17:05:18 +02:00 · 2018-07-12 17:05:18 +02:00 · ead3f926cb
parent 9be222f448
commit ead3f926cb
3 changed files with 81 additions and 0 deletions
--- a/aio/content/examples/elements/e2e/src/app.e2e-spec.ts
+++ b/aio/content/examples/elements/e2e/src/app.e2e-spec.ts
@ -0,0 +1,69 @@
+'use strict'; // necessary for es6 output in node
+
+import { browser, by, element } from 'protractor';
+
+/* tslint:disable:quotemark */
+describe('Elements', () => {
+  const messageInput = element(by.css('input'));
+  const popupButtons = element.all(by.css('button'));
+
+  beforeEach(() => browser.get(''));
+
+  describe('popup component', () => {
+    const popupComponentButton = popupButtons.get(0);
+    const popupComponent = element(by.css('popup-component'));
+    const closeButton = popupComponent.element(by.css('button'));
+
+    it('should be displayed on button click', () => {
+      expect(popupComponent.isPresent()).toBe(false);
+
+      popupComponentButton.click();
+      expect(popupComponent.isPresent()).toBe(true);
+    });
+
+    it('should display the specified message', () => {
+      messageInput.clear();
+      messageInput.sendKeys('Angular rocks!');
+
+      popupComponentButton.click();
+      expect(popupComponent.getText()).toContain('Popup: Angular rocks!');
+    });
+
+    it('should be closed on "close" button click', () => {
+      popupComponentButton.click();
+      expect(popupComponent.isPresent()).toBe(true);
+
+      closeButton.click();
+      expect(popupComponent.isPresent()).toBe(false);
+    });
+  });
+
+  describe('popup element', () => {
+    const popupElementButton = popupButtons.get(1);
+    const popupElement = element(by.css('popup-element'));
+    const closeButton = popupElement.element(by.css('button'));
+
+    it('should be displayed on button click', () => {
+      expect(popupElement.isPresent()).toBe(false);
+
+      popupElementButton.click();
+      expect(popupElement.isPresent()).toBe(true);
+    });
+
+    it('should display the specified message', () => {
+      messageInput.clear();
+      messageInput.sendKeys('Angular rocks!');
+
+      popupElementButton.click();
+      expect(popupElement.getText()).toContain('Popup: Angular rocks!');
+    });
+
+    it('should be closed on "close" button click', () => {
+      popupElementButton.click();
+      expect(popupElement.isPresent()).toBe(true);
+
+      closeButton.click();
+      expect(popupElement.isPresent()).toBe(false);
+    });
+  });
+});
--- a/aio/content/examples/elements/example-config.json
+++ b/aio/content/examples/elements/example-config.json
--- a/aio/content/examples/elements/src/index.html
+++ b/aio/content/examples/elements/src/index.html
@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8">
+    <base href="/">
+    <title>Elements</title>
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+  </head>
+  <body>
+    <app-root></app-root>
+  </body>
+</html>