From 6c8b9adeee80040d02fd0236af4c1481924bacf2 Mon Sep 17 00:00:00 2001
From: Weston Ruter <westonruter@git.wordpress.org>
Date: Mon, 18 Sep 2017 19:10:38 +0000
Subject: [PATCH] Customize: Use `input` event instead of `keyup` or
 `propertychange` events when listening for changes in `wp.customize.Element`
 instances.

Ensures that a control's `Element` is updated in response to pasting into the field. Also fixes issue where inputs using "new" HTML5 types (like `url` and `number`) were not updating in the preview during keystrokes. The use of `input` was previously blocked due to needing to support IE9, but this is no longer a concern since IE<11 is no longer supported.

See #38845, #28477.
Fixes #35832.


git-svn-id: https://develop.svn.wordpress.org/trunk@41387 602fd350-edb4-49c9-b593-d223f7449a82
---
 src/wp-includes/js/customize-base.js | 24 ++++++++----------------
 1 file changed, 8 insertions(+), 16 deletions(-)

diff --git a/src/wp-includes/js/customize-base.js b/src/wp-includes/js/customize-base.js
index f4b05daa69..30cedfdc46 100644
--- a/src/wp-includes/js/customize-base.js
+++ b/src/wp-includes/js/customize-base.js
@@ -551,34 +551,26 @@ window.wp = window.wp || {};
 			this.element = api.ensure( element );
 			this.events = '';
 
-			if ( this.element.is('input, select, textarea') ) {
-				this.events += 'change';
+			if ( this.element.is( 'input, select, textarea' ) ) {
+				type = this.element.prop( 'type' );
+				this.events += ' change input';
 				synchronizer = api.Element.synchronizer.val;
 
-				if ( this.element.is('input') ) {
-					type = this.element.prop('type');
-					if ( api.Element.synchronizer[ type ] ) {
-						synchronizer = api.Element.synchronizer[ type ];
-					}
-					if ( 'text' === type || 'password' === type ) {
-						this.events += ' keyup';
-					} else if ( 'range' === type ) {
-						this.events += ' input propertychange';
-					}
-				} else if ( this.element.is('textarea') ) {
-					this.events += ' keyup';
+				if ( this.element.is( 'input' ) && api.Element.synchronizer[ type ] ) {
+					synchronizer = api.Element.synchronizer[ type ];
 				}
 			}
 
 			api.Value.prototype.initialize.call( this, null, $.extend( options || {}, synchronizer ) );
 			this._value = this.get();
 
-			update  = this.update;
+			update = this.update;
 			refresh = this.refresh;
 
 			this.update = function( to ) {
-				if ( to !== refresh.call( self ) )
+				if ( to !== refresh.call( self ) ) {
 					update.apply( this, arguments );
+				}
 			};
 			this.refresh = function() {
 				self.set( refresh.call( self ) );