From 2cbb1bd95e374b78a7f547b47a710426b27d4a39 Mon Sep 17 00:00:00 2001
From: Andrea Fercia <a.fercia@gmail.com>
Date: Wed, 20 Feb 2019 22:56:50 +0000
Subject: [PATCH] Accessibility: General Settings: Update custom date/time
 format previews while typing.

The custom date/time format previews in General Settings were updated only when blurring the related input fields. With this change, they're now updated when users finish typing a custom format, properly debouncing the `input` event callback.

Props dilipbheda, Girishpanchal.
Fixes #43364.

Built from https://develop.svn.wordpress.org/trunk@44758


git-svn-id: http://core.svn.wordpress.org/trunk@44590 1a063a9b-81f0-0310-95a4-ce76da25c4cd
---
 wp-admin/includes/options.php | 25 +++++++++++++++++--------
 wp-includes/version.php       |  2 +-
 2 files changed, 18 insertions(+), 9 deletions(-)

diff --git a/wp-admin/includes/options.php b/wp-admin/includes/options.php
index d60b5588ba..502af4b0bc 100644
--- a/wp-admin/includes/options.php
+++ b/wp-admin/includes/options.php
@@ -61,22 +61,31 @@ function options_general_add_js() {
 			if ( "time_format_custom_radio" != $(this).attr("id") )
 				$( 'input[name="time_format_custom"]' ).val( $( this ).val() ).closest( 'fieldset' ).find( '.example' ).text( $( this ).parent( 'label' ).children( '.format-i18n' ).text() );
 		});
+
 		$( 'input[name="time_format_custom"]' ).on( 'click input', function() {
 			$( '#time_format_custom_radio' ).prop( 'checked', true );
 		});
-		$("input[name='date_format_custom'], input[name='time_format_custom']").change( function() {
+
+		$( 'input[name="date_format_custom"], input[name="time_format_custom"]' ).on( 'input', function() {
 			var format = $( this ),
 				fieldset = format.closest( 'fieldset' ),
 				example = fieldset.find( '.example' ),
 				spinner = fieldset.find( '.spinner' );
 
-			spinner.addClass( 'is-active' );
+			// Debounce the event callback while users are typing.
+			clearTimeout( $.data( this, 'timer' ) );
+			$( this ).data( 'timer', setTimeout( function() {
+				// If custom date is not empty.
+				if ( format.val() ) {
+					spinner.addClass( 'is-active' );
 
-			$.post( ajaxurl, {
-					action: 'date_format_custom' == format.attr( 'name' ) ? 'date_format' : 'time_format',
-					date : format.val()
-				}, function( d ) { spinner.removeClass( 'is-active' ); example.text( d ); } );
-		});
+					$.post( ajaxurl, {
+						action: 'date_format_custom' == format.attr( 'name' ) ? 'date_format' : 'time_format',
+						date 	: format.val()
+					}, function( d ) { spinner.removeClass( 'is-active' ); example.text( d ); } );
+				}
+			}, 500 ) );
+		} );
 
 		var languageSelect = $( '#WPLANG' );
 		$( 'form' ).submit( function() {
@@ -107,7 +116,7 @@ function options_reading_add_js() {
 				selects.prop( 'disabled', ! staticPage.prop('checked') );
 			};
 		check_disabled();
-		 section.find('input:radio').change(check_disabled);
+		section.find( 'input:radio' ).change( check_disabled );
 	});
 </script>
 	<?php
diff --git a/wp-includes/version.php b/wp-includes/version.php
index b0a9c9bdf7..407fa5b27a 100644
--- a/wp-includes/version.php
+++ b/wp-includes/version.php
@@ -13,7 +13,7 @@
  *
  * @global string $wp_version
  */
-$wp_version = '5.2-alpha-44757';
+$wp_version = '5.2-alpha-44758';
 
 /**
  * Holds the WordPress DB revision, increments when changes are made to the WordPress DB schema.