From d46302b99ff2945ebf2eb458808f74bc7e231f72 Mon Sep 17 00:00:00 2001
From: Maciej Bukowski <ma2ciek@gmail.com>
Date: Tue, 28 Aug 2018 15:11:23 +0200
Subject: [PATCH 1/3] Improved sample. Added missing test.

---
 src/app/demo-form/demo-form.component.html    |  1 +
 src/app/demo-form/demo-form.component.spec.ts | 18 +++++++++++++++++-
 src/app/demo-form/demo-form.component.ts      |  4 ++++
 3 files changed, 22 insertions(+), 1 deletion(-)

diff --git a/src/app/demo-form/demo-form.component.html b/src/app/demo-form/demo-form.component.html
index 61ae46b..cec8f9e 100644
--- a/src/app/demo-form/demo-form.component.html
+++ b/src/app/demo-form/demo-form.component.html
@@ -24,6 +24,7 @@ <h3>User profile form</h3>
 	<p *ngIf="description && description.dirty" class="alert">Description is "dirty".</p>
 	<p *ngIf="description && description.touched" class="alert">Description has been "touched".</p>
 
+	<p><button type="reset" (click)="reset()">Reset form</button></p>
 	<p><button type="submit">Submit this form</button> <em>(Open the console first)</em></p>
 </form>
 
diff --git a/src/app/demo-form/demo-form.component.spec.ts b/src/app/demo-form/demo-form.component.spec.ts
index 5292bac..ea57431 100644
--- a/src/app/demo-form/demo-form.component.spec.ts
+++ b/src/app/demo-form/demo-form.component.spec.ts
@@ -35,7 +35,7 @@ describe( 'DemoFormComponent', () => {
 	it( 'should log the model to the console when user submits the form', () => {
 		const spy = spyOn( console, 'log' );
 
-		const submitButton: HTMLButtonElement = fixture.debugElement.query( By.css( 'button' ) ).nativeElement;
+		const submitButton: HTMLButtonElement = fixture.debugElement.query( By.css( 'button[type=submit]' ) ).nativeElement;
 		submitButton.click();
 
 		expect( spy ).toHaveBeenCalledTimes( 1 );
@@ -63,4 +63,20 @@ describe( 'DemoFormComponent', () => {
 			done();
 		} );
 	} );
+
+	it( 'should reset form after clicking the reset button', ( done: Function ) => {
+		const debugElement = fixture.debugElement.query( By.directive( CKEditorComponent ) );
+		const ckeditorComponent: CKEditorComponent = debugElement.componentInstance;
+
+		setTimeout( () => {
+			const resetButton: HTMLButtonElement = fixture.debugElement.query( By.css( 'button[type=reset]' ) ).nativeElement;
+			resetButton.click();
+
+			fixture.detectChanges();
+
+			expect( component.formDataPreview ).toEqual( '{"name":null,"surname":null,"description":"<p>&nbsp;</p>"}' );
+
+			done();
+		} );
+	} );
 } );
diff --git a/src/app/demo-form/demo-form.component.ts b/src/app/demo-form/demo-form.component.ts
index 82877c3..222def8 100644
--- a/src/app/demo-form/demo-form.component.ts
+++ b/src/app/demo-form/demo-form.component.ts
@@ -33,6 +33,10 @@ export class DemoFormComponent implements AfterViewInit {
 		console.log( 'Form submit, model', this.model );
 	}
 
+	reset() {
+		this.demoForm!.reset();
+	}
+
 	get description() {
 		return this.demoForm!.controls.description;
 	}

From a11c791c85d5bd128995ffb74f5b30c21968acb0 Mon Sep 17 00:00:00 2001
From: Maciej Bukowski <ma2ciek@gmail.com>
Date: Tue, 28 Aug 2018 15:11:30 +0200
Subject: [PATCH 2/3] Code style.

---
 src/ckeditor/ckeditor.component.ts | 8 +++++---
 1 file changed, 5 insertions(+), 3 deletions(-)

diff --git a/src/ckeditor/ckeditor.component.ts b/src/ckeditor/ckeditor.component.ts
index 75e8a9f..39261bb 100644
--- a/src/ckeditor/ckeditor.component.ts
+++ b/src/ckeditor/ckeditor.component.ts
@@ -166,11 +166,13 @@ export class CKEditorComponent implements AfterViewInit, OnDestroy, ControlValue
 
 	// Implementing the ControlValueAccessor interface (only when binding to ngModel).
 	writeValue( value: string | null ): void {
-		// If a null was received, the textarea content needs to be empty
-		if ( value == null ) {
+		// This method is called with the `null` value when the form resets.
+		// A component's responsibility is to restore to the initial state.
+		if ( value === null ) {
 			value = '';
 		}
-		// If already initialized
+
+		// If already initialized.
 		if ( this.editorInstance ) {
 			this.editorInstance.setData( value );
 		}

From 48793a4cda74ccb9c39f09a5c5f97ad2b0b9f1bd Mon Sep 17 00:00:00 2001
From: Maciej Bukowski <ma2ciek@gmail.com>
Date: Tue, 28 Aug 2018 15:24:27 +0200
Subject: [PATCH 3/3] Removed unused variables.

---
 src/app/demo-form/demo-form.component.spec.ts | 3 ---
 1 file changed, 3 deletions(-)

diff --git a/src/app/demo-form/demo-form.component.spec.ts b/src/app/demo-form/demo-form.component.spec.ts
index ea57431..0ba90e3 100644
--- a/src/app/demo-form/demo-form.component.spec.ts
+++ b/src/app/demo-form/demo-form.component.spec.ts
@@ -65,9 +65,6 @@ describe( 'DemoFormComponent', () => {
 	} );
 
 	it( 'should reset form after clicking the reset button', ( done: Function ) => {
-		const debugElement = fixture.debugElement.query( By.directive( CKEditorComponent ) );
-		const ckeditorComponent: CKEditorComponent = debugElement.componentInstance;
-
 		setTimeout( () => {
 			const resetButton: HTMLButtonElement = fixture.debugElement.query( By.css( 'button[type=reset]' ) ).nativeElement;
 			resetButton.click();