From 82da1f80b3268f82113702ebc0b482a4911e5490 Mon Sep 17 00:00:00 2001
From: camorra-skk <sumtsom@gmail.com>
Date: Wed, 11 Apr 2018 18:02:55 +0530
Subject: [PATCH] [ADF-2607] Task Form - Number Widget placeholder no longer
 displayed (#3165)

* [ADF-2607] Task Form - Number Widget placeholder no longer displayed

* Removed css to display placeholder after focus on input.

* [ADF-2607] Task Form - Number Widget placeholder no longer displayed.

Changed test cases and placeholder value in amount and text widgets.
---
 .../widgets/amount/amount.widget.scss         |  1 +
 .../widgets/container/container.widget.scss   |  4 ---
 .../widgets/text/text.widget.spec.ts          | 26 ++++++++++++++++++-
 .../components/widgets/text/text.widget.ts    |  4 +--
 4 files changed, 28 insertions(+), 7 deletions(-)

diff --git a/lib/core/form/components/widgets/amount/amount.widget.scss b/lib/core/form/components/widgets/amount/amount.widget.scss
index 4e8ea42fbf..efa92993e4 100644
--- a/lib/core/form/components/widgets/amount/amount.widget.scss
+++ b/lib/core/form/components/widgets/amount/amount.widget.scss
@@ -16,6 +16,7 @@
 
         .mat-input-placeholder {
             margin-top: 5px;
+            display: none;
         }
 
     }
diff --git a/lib/core/form/components/widgets/container/container.widget.scss b/lib/core/form/components/widgets/container/container.widget.scss
index abec1ca5d1..d23cbb7e09 100644
--- a/lib/core/form/components/widgets/container/container.widget.scss
+++ b/lib/core/form/components/widgets/container/container.widget.scss
@@ -75,10 +75,6 @@
 
         .mat-focused {
 
-            .mat-input-placeholder-wrapper {
-                display: none;
-            }
-
             label {
                 transform: scaleX(1);
                 transition: transform 150ms linear,
diff --git a/lib/core/form/components/widgets/text/text.widget.spec.ts b/lib/core/form/components/widgets/text/text.widget.spec.ts
index da4585114f..78ea4f77ce 100644
--- a/lib/core/form/components/widgets/text/text.widget.spec.ts
+++ b/lib/core/form/components/widgets/text/text.widget.spec.ts
@@ -150,6 +150,17 @@ describe('TextWidgetComponent', () => {
                 expect(inputElement.placeholder).toBe('simple palceholder');
             });
 
+            it('should show the field placeholder when clicked', async(() => {
+                inputElement.click();
+                fixture.detectChanges();
+                fixture.whenStable().then(() => {
+                    fixture.detectChanges();
+                    expect(inputElement).toBeDefined();
+                    expect(inputElement).not.toBeNull();
+                    expect(inputElement.placeholder).toBe('simple palceholder');
+                });
+            }));
+
             it('should prevent text to be written if is not allowed by the mask on keyUp event', async(() => {
                 expect(element.querySelector('#text-id')).not.toBeNull();
 
@@ -257,6 +268,8 @@ describe('TextWidgetComponent', () => {
 
         describe('and a mask placeholder is configured', () => {
 
+            let inputElement: HTMLInputElement;
+
             beforeEach(() => {
                 widget.field = new FormFieldModel(new FormModel({taskId: 'fake-task-id'}), {
                     id: 'text-id',
@@ -269,14 +282,25 @@ describe('TextWidgetComponent', () => {
                 });
 
                 fixture.detectChanges();
+                inputElement = <HTMLInputElement> element.querySelector('#text-id');
             });
 
             it('should show the input mask placeholder', () => {
-                const inputElement: HTMLInputElement = <HTMLInputElement> element.querySelector('#text-id');
                 expect(inputElement).toBeDefined();
                 expect(inputElement).not.toBeNull();
                 expect(inputElement.placeholder).toBe('Phone : (__) ___-___');
             });
+
+            it('should show the input mask placeholder when clicked', async(() => {
+                inputElement.click();
+                fixture.detectChanges();
+                fixture.whenStable().then(() => {
+                    fixture.detectChanges();
+                    expect(inputElement).toBeDefined();
+                    expect(inputElement).not.toBeNull();
+                    expect(inputElement.placeholder).toBe('Phone : (__) ___-___');
+                });
+            }));
         });
     });
 });
diff --git a/lib/core/form/components/widgets/text/text.widget.ts b/lib/core/form/components/widgets/text/text.widget.ts
index b73a2f88a6..5710ac380b 100644
--- a/lib/core/form/components/widgets/text/text.widget.ts
+++ b/lib/core/form/components/widgets/text/text.widget.ts
@@ -39,9 +39,9 @@ export class TextWidgetComponent extends WidgetComponent implements OnInit {
     }
 
     ngOnInit() {
-        if (this.field.params && this.field.params['inputMask']) {
+        if (this.field.params) {
             this.mask = this.field.params['inputMask'];
-            this.placeholder = this.field.params['inputMaskPlaceholder'] ? this.field.params['inputMaskPlaceholder'] : this.field.placeholder;
+            this.placeholder = this.field.params['inputMask'] && this.field.params['inputMaskPlaceholder'] ? this.field.params['inputMaskPlaceholder'] : this.field.placeholder;
             this.isMaskReversed = this.field.params['inputMaskReversed'] ? this.field.params['inputMaskReversed'] : false;
         }
     }