Product Icon

Free Gifts for WooCommerce

Offer Free Gifts to your customers for making purchases in your WooCommerce Shop.

Bug: React render-phase dispatch crash on Cart page during SPA / iAPI router navigation

Hello,
While investigating WooCommerce issue #63518 (https://github.com/woocommerce/woocommerce/issues/63518) — which documents a structural problem with classic script rehydration after iAPI router navigation — I identified two bugs in free-gifts-for-woocommerce that cause React errors on the Cart page during any SPA / AJAX navigation.

Bug 1 — Missing dependency declaration
The script fgf-wc-blocks accesses wc.blocksCheckout without declaring wc-blocks-checkout as a registered dependency in wp_enqueue_script(). WooCommerce’s own dependency detection reports this on every Cart page load:

[WooCommerce] Script “fgf-wc-blocks” accessed wc.blocksCheckout without declaring “wc-blocks-checkout” as a dependency.

Fix: Add wc-blocks-checkout to the $deps array when registering fgf-wc-blocks.

Bug 2 — Redux dispatch during React render phase
getElement() in index.js:31 calls removeNotices() at index.js:262, which dispatches a Redux action (wp.data dispatch) synchronously during the React render cycle. React 18 forbids this and throws:
Warning: Cannot update a component (Unknown) while rendering a different component (getElement). at getElement (free-gifts-for-woocommerce/…/index.js:32:11)
This also triggers: Warning: Internal React error: Expected static flag was missing. at getElement (free-gifts-for-woocommerce/…/index.js:32:11)

Fix: Move any wp.data.dispatch() calls out of the render function into a useEffect() hook so they run after render, not during it. Currently removeNotices() is called directly inside the render body which triggers a Redux dispatch mid-render. It should be wrapped in useEffect with an empty dependency array so it fires only after the component mounts.

Context
These bugs are silent on a full page load because the Cart page is server-rendered with all scripts already present. They become visible — and cause visual breakage — when the Cart is reached via SPA navigation (iAPI router or any AJAX swap), because React re-mounts the block tree in a context where the Redux store is being initialized at the same time.

The broader issue is tracked at: https://github.com/woocommerce/woocommerce/issues/63518

**Fix:** Move any `wp.data.dispatch()` calls out of the render function into a `useEffect()` hook so they run after render, not during it:

“`js
// ❌ Wrong — dispatch during render
function getElement() {
removeNotices(); // triggers Redux dispatch
return ;
}

// ✅ Correct — dispatch after render
function getElement() {
useEffect(() => {
removeNotices();
}, []);
return ;
}

Happy to provide more detail or a reproducible test case if helpful.

Screenshots

Author

markusroof

Current Status

Open

Last updated: March 3, 2026

0 comments

Log in to comment on this feature request.

Use of your personal data
We and our partners process your personal data (such as browsing data, IP Addresses, cookie information, and other unique identifiers) based on your consent and/or our legitimate interest to optimize our website, marketing activities, and your user experience.