Changeset 41387

Timestamp:

09/18/2017 07:10:38 PM (7 years ago)

Author:

westonruter

Message:

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.

File:

• trunk/src/wp-includes/js/customize-base.js (modified) (2 diffs)

trunk/src/wp-includes/js/customize-base.js

@@ -552 +552 @@
             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 ];
                 }
             }
@@ -574 +565 @@
             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() {