From 293b7564538e89c5792be22aca15297e66d9f4a0 Mon Sep 17 00:00:00 2001
From: Ken Sodemann <ken@ionic.io>
Date: Wed, 15 Nov 2017 06:24:22 -0600
Subject: [PATCH] feat(demo): lay out the demo inputs page

---
 packages/angular/demo/e2e/inputs.e2e-spec.ts        | 10 +++++++++-
 packages/angular/demo/e2e/inputs.po.ts              | 10 +++++++++-
 .../src/app/inputs/inputs-test-page.component.html  | 11 +++++++++++
 .../app/inputs/inputs-test-page.component.spec.ts   | 13 ++++++++-----
 .../src/app/inputs/inputs-test-page.component.ts    |  7 +++----
 .../angular/demo/src/app/inputs/inputs.module.ts    | 13 ++++++-------
 6 files changed, 46 insertions(+), 18 deletions(-)

diff --git a/packages/angular/demo/e2e/inputs.e2e-spec.ts b/packages/angular/demo/e2e/inputs.e2e-spec.ts
index ab2756c1fc..598e7720f1 100644
--- a/packages/angular/demo/e2e/inputs.e2e-spec.ts
+++ b/packages/angular/demo/e2e/inputs.e2e-spec.ts
@@ -9,6 +9,14 @@ describe('Demo Inputs Page', () => {
 
   it('should display title', () => {
     page.navigateTo();
-    expect(page.getTitle()).toEqual('Ionic Core Inputs Demo');
+    expect(page.getTitleText()).toEqual('Ionic Core Inputs Demo');
+  });
+
+  describe('input one', () => {
+    it('should display the starting text', () => {
+      page.navigateTo();
+      const el = page.getInputOne();
+      expect(el.getAttribute('value')).toEqual('This is data for test input one');
+    });
   });
 });
diff --git a/packages/angular/demo/e2e/inputs.po.ts b/packages/angular/demo/e2e/inputs.po.ts
index 30fb0cfd7a..c6dd99574e 100644
--- a/packages/angular/demo/e2e/inputs.po.ts
+++ b/packages/angular/demo/e2e/inputs.po.ts
@@ -5,7 +5,15 @@ export class InputsPage {
     return browser.get('/inputs');
   }
 
-  getTitle() {
+  getTitleText() {
     return element(by.css('.title')).getText();
   }
+
+  getInputOne() {
+    return element(by.id('inputOne'));
+  }
+
+  getOutputOneText() {
+    return element(by.id('outputOne')).getText();
+  }
 }
diff --git a/packages/angular/demo/src/app/inputs/inputs-test-page.component.html b/packages/angular/demo/src/app/inputs/inputs-test-page.component.html
index d1a8ffdbe0..61a8d2bd4c 100644
--- a/packages/angular/demo/src/app/inputs/inputs-test-page.component.html
+++ b/packages/angular/demo/src/app/inputs/inputs-test-page.component.html
@@ -2,4 +2,15 @@
   Ionic Core Inputs Demo
 </div>
 
+<ion-grid>
+  <ion-row>
+    <ion-col>
+      <ion-input id="inputOne" [(ngModel)]="testInputOne" ngDefaultControl></ion-input>
+    </ion-col>
+    <ion-col>
+      Entered Data: <span id="outputOne">{{testInputOne}}</span>
+    </ion-col>
+  </ion-row>
+</ion-grid>
+
 <a href='home'>Home</a>
diff --git a/packages/angular/demo/src/app/inputs/inputs-test-page.component.spec.ts b/packages/angular/demo/src/app/inputs/inputs-test-page.component.spec.ts
index 06a46d85f1..5b537c6069 100644
--- a/packages/angular/demo/src/app/inputs/inputs-test-page.component.spec.ts
+++ b/packages/angular/demo/src/app/inputs/inputs-test-page.component.spec.ts
@@ -1,3 +1,4 @@
+import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
 import { async, ComponentFixture, TestBed } from '@angular/core/testing';
 
 import { InputsTestPageComponent } from './inputs-test-page.component';
@@ -6,12 +7,14 @@ describe('InputsTestPageComponent', () => {
   let component: InputsTestPageComponent;
   let fixture: ComponentFixture<InputsTestPageComponent>;
 
-  beforeEach(async(() => {
-    TestBed.configureTestingModule({
-      declarations: [ InputsTestPageComponent ]
+  beforeEach(
+    async(() => {
+      TestBed.configureTestingModule({
+        declarations: [InputsTestPageComponent],
+        schemas: [CUSTOM_ELEMENTS_SCHEMA]
+      }).compileComponents();
     })
-    .compileComponents();
-  }));
+  );
 
   beforeEach(() => {
     fixture = TestBed.createComponent(InputsTestPageComponent);
diff --git a/packages/angular/demo/src/app/inputs/inputs-test-page.component.ts b/packages/angular/demo/src/app/inputs/inputs-test-page.component.ts
index 789b0e3364..b664a78afc 100644
--- a/packages/angular/demo/src/app/inputs/inputs-test-page.component.ts
+++ b/packages/angular/demo/src/app/inputs/inputs-test-page.component.ts
@@ -7,10 +7,9 @@ import { Component, OnInit, ViewEncapsulation } from '@angular/core';
   encapsulation: ViewEncapsulation.None
 })
 export class InputsTestPageComponent implements OnInit {
+  testInputOne = 'This is data for test input one';
 
-  constructor() { }
-
-  ngOnInit() {
-  }
+  constructor() {}
 
+  ngOnInit() {}
 }
diff --git a/packages/angular/demo/src/app/inputs/inputs.module.ts b/packages/angular/demo/src/app/inputs/inputs.module.ts
index e3c8223d49..f754a9327a 100644
--- a/packages/angular/demo/src/app/inputs/inputs.module.ts
+++ b/packages/angular/demo/src/app/inputs/inputs.module.ts
@@ -1,14 +1,13 @@
-import { NgModule } from '@angular/core';
+import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
+import { FormsModule } from '@angular/forms';
 import { CommonModule } from '@angular/common';
 import { InputsTestPageComponent } from './inputs-test-page.component';
 
 import { InputsRoutingModule } from './inputs-routing.module';
 
 @NgModule({
-  imports: [
-    CommonModule,
-    InputsRoutingModule
-  ],
-  declarations: [InputsTestPageComponent]
+  imports: [CommonModule, FormsModule, InputsRoutingModule],
+  declarations: [InputsTestPageComponent],
+  schemas: [CUSTOM_ELEMENTS_SCHEMA]
 })
-export class InputsModule { }
+export class InputsModule {}