From 5b7294acbe116bdef381884f9b6fe0946ab61239 Mon Sep 17 00:00:00 2001
From: Rich Harris <richard.a.harris@gmail.com>
Date: Tue, 28 Feb 2017 18:21:36 -0500
Subject: [PATCH] use input events for two-way binding with textareas and
 non-checkbox/radio inputs (#10)

---
 .../dom/visitors/attributes/binding/index.js  | 11 +++++--
 test/generator/binding-textarea/_config.js    | 32 +++++++++++++++++++
 test/generator/binding-textarea/main.html     |  2 ++
 3 files changed, 42 insertions(+), 3 deletions(-)
 create mode 100644 test/generator/binding-textarea/_config.js
 create mode 100644 test/generator/binding-textarea/main.html

diff --git a/src/generators/dom/visitors/attributes/binding/index.js b/src/generators/dom/visitors/attributes/binding/index.js
index b8344cd146..4123f3ad7a 100644
--- a/src/generators/dom/visitors/attributes/binding/index.js
+++ b/src/generators/dom/visitors/attributes/binding/index.js
@@ -33,13 +33,18 @@ export default function createBinding ( generator, node, attribute, current, loc
 
 	let eventName = 'change';
 	if ( node.name === 'input' ) {
-		const type = node.attributes.find( attr => attr.type === 'Attribute' && attr.name === 'type' );
-		if ( !type || type.value[0].data === 'text' ) {
-			// TODO in validation, should throw if type attribute is not static
+		const typeAttribute = node.attributes.find( attr => attr.type === 'Attribute' && attr.name === 'type' );
+		const type = typeAttribute ? typeAttribute.value[0].data : 'text'; // TODO in validation, should throw if type attribute is not static
+
+		if ( type !== 'checkbox' && type !== 'radio' ) {
 			eventName = 'input';
 		}
 	}
 
+	else if ( node.name === 'textarea' ) {
+		eventName = 'input';
+	}
+
 	let value;
 
 	if ( local.isComponent ) {
diff --git a/test/generator/binding-textarea/_config.js b/test/generator/binding-textarea/_config.js
new file mode 100644
index 0000000000..3ba2735c90
--- /dev/null
+++ b/test/generator/binding-textarea/_config.js
@@ -0,0 +1,32 @@
+export default {
+	data: {
+		value: 'some text'
+	},
+
+	html: `
+		<textarea></textarea>
+		<p>some text</p>
+	`,
+
+	test ( assert, component, target, window ) {
+		const textarea = target.querySelector( 'textarea' );
+		assert.equal( textarea.value, 'some text' );
+
+		const event = new window.Event( 'input' );
+
+		textarea.value = 'hello';
+		textarea.dispatchEvent( event );
+
+		assert.htmlEqual( target.innerHTML, `
+			<textarea></textarea>
+			<p>hello</p>
+		` );
+
+		component.set({ value: 'goodbye' });
+		assert.equal( textarea.value, 'goodbye' );
+		assert.htmlEqual( target.innerHTML, `
+			<textarea></textarea>
+			<p>goodbye</p>
+		` );
+	}
+};
diff --git a/test/generator/binding-textarea/main.html b/test/generator/binding-textarea/main.html
new file mode 100644
index 0000000000..1ee199e30b
--- /dev/null
+++ b/test/generator/binding-textarea/main.html
@@ -0,0 +1,2 @@
+<textarea bind:value></textarea>
+<p>{{value}}</p>