From 5618dfc6d32020e9ceacfac5e39d5a54ca6a30b7 Mon Sep 17 00:00:00 2001
From: Sergey Biryukov <sergeybiryukov@git.wordpress.org>
Date: Fri, 26 Jul 2019 17:45:21 +0000
Subject: [PATCH] Accessibility: Taxonomy: When a new category or tag is being
 added, show a spinner and noop the button to avoid multiple requests.

Props andg, afercia, guddu1315, SergeyBiryukov.
Fixes #47607.

git-svn-id: https://develop.svn.wordpress.org/trunk@45683 602fd350-edb4-49c9-b593-d223f7449a82
---
 src/js/_enqueues/admin/tags.js | 13 +++++++++++++
 src/wp-admin/css/edit.css      |  5 +++++
 src/wp-admin/edit-tags.php     |  9 ++++++---
 3 files changed, 24 insertions(+), 3 deletions(-)

diff --git a/src/js/_enqueues/admin/tags.js b/src/js/_enqueues/admin/tags.js
index 0f195c777e..a36b2ebb4f 100644
--- a/src/js/_enqueues/admin/tags.js
+++ b/src/js/_enqueues/admin/tags.js
@@ -11,6 +11,8 @@
 
 jQuery(document).ready(function($) {
 
+	var addingTerm = false;
+
 	/**
 	 * Adds an event handler to the delete term link on the term overview page.
 	 *
@@ -102,6 +104,14 @@ jQuery(document).ready(function($) {
 		if ( ! validateForm( form ) )
 			return false;
 
+		if ( addingTerm ) {
+			// If we're adding a term, noop the button to avoid duplicate requests.
+			return false;
+		}
+
+		addingTerm = true;
+		form.find( '.submit .spinner' ).addClass( 'is-active' );
+
 		/**
 		 * Does a request to the server to add a new term to the database
 		 *
@@ -112,6 +122,9 @@ jQuery(document).ready(function($) {
 		$.post(ajaxurl, $('#addtag').serialize(), function(r){
 			var res, parent, term, indent, i;
 
+			addingTerm = false;
+			form.find( '.submit .spinner' ).removeClass( 'is-active' );
+
 			$('#ajax-response').empty();
 			res = wpAjax.parseAjaxResponse( r, 'ajax-response' );
 			if ( ! res || res.errors )
diff --git a/src/wp-admin/css/edit.css b/src/wp-admin/css/edit.css
index e186e488ad..4b03870f22 100644
--- a/src/wp-admin/css/edit.css
+++ b/src/wp-admin/css/edit.css
@@ -1163,6 +1163,11 @@ p.popular-tags a {
 	text-decoration: underline;
 }
 
+#addtag .spinner {
+	float: none;
+	vertical-align: top;
+}
+
 #edittag {
 	max-width: 800px;
 }
diff --git a/src/wp-admin/edit-tags.php b/src/wp-admin/edit-tags.php
index eb6b52a1b0..cc5f118997 100644
--- a/src/wp-admin/edit-tags.php
+++ b/src/wp-admin/edit-tags.php
@@ -515,9 +515,12 @@ if ( $can_edit_terms ) {
 	 * @param string $taxonomy The taxonomy slug.
 	 */
 	do_action( "{$taxonomy}_add_form_fields", $taxonomy );
-
-	submit_button( $tax->labels->add_new_item );
-
+	?>
+	<p class="submit">
+		<?php submit_button( $tax->labels->add_new_item, 'primary', 'submit', false ); ?>
+		<span class="spinner"></span>
+	</p>
+	<?php
 	if ( 'category' == $taxonomy ) {
 		/**
 		 * Fires at the end of the Edit Category form.