From 78e85f87c3cf683dfccbff3b43deedc092c72d6d Mon Sep 17 00:00:00 2001 From: coderkevin Date: Mon, 10 Jun 2019 17:03:08 -0500 Subject: [PATCH] Improve hidden tab suppression/fix rapid requests This fixes the rapid request problem that was happening when switching tabs while having timed out requests. It changes the approach from suppressing the actions sent out to preventing the read function from being called at all. I think the original problem has occurred because the original approach was relying on an internal implementation of apiFetch from wp.data. This new approach does not have such a dependency. It prevents apiFetch from even being called. However, in the process, it will also prevent any newly required resources from being fetched if the user manages to switch tabs before it is requested. (e.g. refresh, then switch tabs quickly). --- plugins/woocommerce-admin/client/wc-api/wc-api-spec.js | 5 +++++ .../client/wc-api/wp-data-store/create-api-client.js | 5 ----- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/plugins/woocommerce-admin/client/wc-api/wc-api-spec.js b/plugins/woocommerce-admin/client/wc-api/wc-api-spec.js index 25182542b11..0a69e9ed7fd 100644 --- a/plugins/woocommerce-admin/client/wc-api/wc-api-spec.js +++ b/plugins/woocommerce-admin/client/wc-api/wc-api-spec.js @@ -36,6 +36,11 @@ function createWcApiSpec() { }, operations: { read( resourceNames ) { + if ( document.hidden ) { + // Don't do any read updates while the tab isn't active. + return []; + } + return [ ...imports.operations.read( resourceNames ), ...items.operations.read( resourceNames ), diff --git a/plugins/woocommerce-admin/client/wc-api/wp-data-store/create-api-client.js b/plugins/woocommerce-admin/client/wc-api/wp-data-store/create-api-client.js index 5537e89942f..53a3655fece 100644 --- a/plugins/woocommerce-admin/client/wc-api/wp-data-store/create-api-client.js +++ b/plugins/woocommerce-admin/client/wc-api/wp-data-store/create-api-client.js @@ -19,11 +19,6 @@ function createStore( name ) { function createDataHandlers( store ) { return { dataRequested: resourceNames => { - const { resources } = store.getState(); - const newResources = resourceNames.some( resourceName => ! resources[ resourceName ] ); - if ( ! newResources && document.hidden ) { - return; - } store.dispatch( { type: 'FRESH_DATA_REQUESTED', resourceNames,