Site editor: Subtitle block error when used in WooCommerce collection query loop
-
Hello, could you test the block provided by the plugin in the site editor environment?
I’m getting a notice:The "kia-subtitle" plugin has encountered an error and cannot be rendered.
Particularly, it happens within WooCommerce product catalog template where I try to display products with subtitles.
It is rendered on the front end but not in the editor.
On the other hand, it works well in singular templates editing.Thank you!
-
hi, thanks for reporting. Are you seeing any error in the console? I can probably look into this sometime during the week.
Warning: React has detected a change in the order of Hooks called by render. This will lead to bugs and errors if not fixed. For more information, read the Rules of Hooks: https://reactjs.org/link/rules-of-hooks Previous render Next render ------------------------------------------------------ 1. useRef useRef 2. useContext useContext 3. undefined useContext ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ render@https://mysite.local/wp-content/plugins/kia-subtitle/assets/js/dist/index.js?ver=4.0.0:1:274 PluginErrorBoundary@https://mysite.local/wp-includes/js/dist/plugins.js?ver=0dd2604d62f853fd21af:290:5 div PluginArea@https://mysite.local/wp-includes/js/dist/plugins.js?ver=0dd2604d62f853fd21af:594:20 RouterProvider@https://mysite.local/wp-includes/js/dist/router.js?ver=24ab4c66bbafbf045980:911:24 GlobalStylesProvider@https://mysite.local/wp-includes/js/dist/edit-site.js?ver=7687c91667ed9257416e:12191:30 SlotFillProvider@https://mysite.local/wp-includes/js/dist/components.js?ver=fd3882637f2f48054bd3:34760:26 provider_SlotFillProvider@https://mysite.local/wp-includes/js/dist/components.js?ver=fd3882637f2f48054bd3:34857:35 Provider@https://mysite.local/wp-includes/js/dist/components.js?ver=fd3882637f2f48054bd3:34916:18 App@https://mysite.local/wp-includes/js/dist/edit-site.js?ver=7687c91667ed9257416e:45432:55 Uncaught Error: Rendered more hooks than during the previous render. updateWorkInProgressHook... Uncaught Error: Rendered more hooks than during the previous render. updateWorkInProgressHook... The above error occurred in the <render> component: render@https://mysite.local/wp-content/plugins/kia-subtitle/assets/js/dist/index.js?ver=4.0.0:1:274 PluginErrorBoundary@https://mysite.local/wp-includes/js/dist/plugins.js?ver=0dd2604d62f853fd21af:290:5 div PluginArea@https://mysite.local/wp-includes/js/dist/plugins.js?ver=0dd2604d62f853fd21af:594:20 RouterProvider@https://mysite.local/wp-includes/js/dist/router.js?ver=24ab4c66bbafbf045980:911:24 GlobalStylesProvider@https://mysite.local/wp-includes/js/dist/edit-site.js?ver=7687c91667ed9257416e:12191:30 SlotFillProvider@https://mysite.local/wp-includes/js/dist/components.js?ver=fd3882637f2f48054bd3:34760:26 provider_SlotFillProvider@https://mysite.local/wp-includes/js/dist/components.js?ver=fd3882637f2f48054bd3:34857:35 Provider@https://mysite.local/wp-includes/js/dist/components.js?ver=fd3882637f2f48054bd3:34916:18 App@https://mysite.local/wp-includes/js/dist/edit-site.js?ver=7687c91667ed9257416e:45432:55 React will try to recreate this component tree from scratch using the error boundary you provided, PluginErrorBoundary.
Well I thought I had this fixed today, as I got it working in the woo product archive template… and then i went to look at the single post template and I’m getting the same error about rendering too many hooks/different number of hooks. So I am stumped and will need a bit more time unfortunately.
@emmek could you try this pre-release?
The product catalog displays “No subtitle” placeholder at products and the same notice as before at the top.
I’m not sure but the console error may be different.Uncaught TypeError: i is undefined...
It is present even if the block is not inserted into the template, so is triggered at earlier stage.
crap, I thought I had that because I’m not seeing it locally anymore… Or wasn’t. Thanks for checking.
Here’s another attempt if you don’t mind testing.
The error has gone, however, the post (product) template block shows just a “No subtitle” placeholder. It would be great if it could grab the actual subtitle from the post (product) meta.
well it is supposed to show the actual title. 😅 I thought it did in the regular post archive…
Maybe WooCommerce template creates a somehow different context, I don’t know…
Fourth time is the charm? Thanks for your patience… developing for the block editor is 100x harder than the old way.
No errors and I see the subtitle for posts/products that have it
https://share.zight.com/RBuAN52KGood, the subtitle is visible in the catalog. So we can consider it like almost fixed for the end user.
However, the editor console still shows an error in the plugin which is compiled to “Uncaught TypeError: a is undefined”, so not much info from this on production. It is triggered early, because it is present in the whole site editor.
On some templates it manifests itself through an error notice “The “kia-subtitle” plugin has encountered an error and cannot be rendered.” and on some it does not.
I really hate the built/compiled scripts for being entirely unreadable by humans.
What template are you editing where you see this error? I have looked at the woo category template, single page, index, cart page and don’t see any issues.
Not to sound too pedantic, but could you remove the blocks and add it back and see if that helps?
If you are game, could you make a staging site? You can use wp staging. You can get in touch with me via my website to share temporary creds eventually. Please take any relevant steps to anonymize data.Your suggestion hit the spot.
On the last iteration I did not replace the block inside the template. Once I did, the error disappeared.Thank you for your effort on making the plugin better!
It is not obvious on these forums.Great!! Ok, I will tag that and release it then since I think we finally found fixed things.
You’re welcome and thanks to you as well for reporting and helping me to test this.
- You must be logged in to reply to this topic.