Hello there!
It seems the block isn’t rendering in the editor until I change the attribute value. Everything is fine on the frontend.
I’m testing locally on a clean WordPress installation.
FanCoolo Version 1.0.0 – Beta 3
Here is the video:
https://drive.google.com/file/d/1LGLmVibpnlDGUpAbhYzdTKN-fU6oPY_V/view?usp=sharing
Thanks!
Have you checked it with the stable release ?
Regards,
Arshad
DPlugins Support
Yes, I also tested it on the release version 1.0.0. The same behavior.
Hey Hey Evgeny,
Sorry to hear this.
Can you please give me more details on this.
– What are your permalinks settings
– Is it resolved with 1.0.1
– Can you open devtools and tell me if you have some errors there
Best
Marko
Hi Marko,
Thank you for your reply and for the excellent plugin!
I hope this will help fix the problem quickly.
Plugin version: 1.0.1
WordPress: 6.8.3
Permalink structure: Post name (http://localhost:10303/sample-post/)
Browser: Chrome Version 142.0.7444.60 (Official Build) (x86_64)
In version 1.0.1, the behavior is the same.
Until I change the attribute, I only see the preloader.
If I add 5 blocks to the editor, on the first load I see 5 preloaders.
In console:
api-fetch.js?ver=524…bd41c30bc419a05:712
Fetch failed loading: POST “…/wp-json/wp/v2/block-renderer/fancoolo/example?context=edit&_locale=user”.
“Network” tab:
POST …/block-renderer/fancoolo/example → Status: cancelled
It was a bit strange because in Postman this POST request returned a 200 without any problems. Then I started looking at the rendering.
I did a bit of experimenting here, and it seems I found the problem. It’s related to the initial load in createServerRenderComponent.
“`javascript (block-renderer.js)
useEffect(() => {
// Skip if attributes haven’t actually changed (debounce)
if (attributesString === attributesStringRef.current) {
// return; ← commented this line
}
attributesStringRef.current = attributesString;
…
I see that the first request is still blocked, but a re-render is occurring (because React Strict Mode enabled?), and the second request has already gone through — the block is rendering in the editor:
Console:
api-fetch.js?ver=524…bd41c30bc419a05:712
Fetch failed loading: POST “…/wp-json/wp/v2/block-renderer/fancoolo/example?context=edit&_locale=user”. api-fetch.js?ver=524…bd41c30bc419a05:712
Fetch finished loading: POST “…/wp-json/wp/v2/block-renderer/fancoolo/example?context=edit&_locale=user”.
For now, I have found such a solution for myself.
Skip the first mount:
…
const isFirstMountRef = useRef(true);
useEffect(() => {
// Skip first mount to avoid Strict Mode double-mounting issue
if (isFirstMountRef.current) { isFirstMountRef.current = false; return; }
// Skip if attributes haven’t actually changed (debounce)
if (attributesString === attributesStringRef.current) {
return;
}
attributesStringRef.current = attributesString;
…
but this is more of a workaround, and it seems that you need to check the debounce logic.
Thanks!