Conversation
supportI’ve just started ‘testing’ the plugin on a staging site I’ve created for the purpose. I created a pretty simple Block Pattern, saved it and then used it on a Test page: https://staging3.smarterbusinessprocesses.com/test/ Worked fine But when I go back to edit the Block Pattern I get is the message “The editor has encountered an unexpected error.” whenever I try to change anything. Output from the Error Message buttons is presented below. I’m keen to understand the potential cause of the problem before I consider implementing the plugin on the live site. Grateful to receive any advice you may have on how to go about this Regards, Mike ——— Error Text: Error: Failed to execute ‘removeChild’ on ‘Node’: The node to be removed is not a child of this node. at jr ( https://staging3.smarterbusinessprocesses.com/wp-includes/js/dist/vendor/react-dom.min.js?ver=18.2.0:10:75178 ) at qr ( https://staging3.smarterbusinessprocesses.com/wp-includes/js/dist/vendor/react-dom.min.js?ver=18.2.0:10:76430 ) at Kr ( https://staging3.smarterbusinessprocesses.com/wp-includes/js/dist/vendor/react-dom.min.js?ver=18.2.0:10:76892 ) at qr ( https://staging3.smarterbusinessprocesses.com/wp-includes/js/dist/vendor/react-dom.min.js?ver=18.2.0:10:76580 ) at Kr ( https://staging3.smarterbusinessprocesses.com/wp-includes/js/dist/vendor/react-dom.min.js?ver=18.2.0:10:76892 ) at qr ( https://staging3.smarterbusinessprocesses.com/wp-includes/js/dist/vendor/react-dom.min.js?ver=18.2.0:10:76580 ) at Kr ( https://staging3.smarterbusinessprocesses.com/wp-includes/js/dist/vendor/react-dom.min.js?ver=18.2.0:10:76695 ) at qr ( https://staging3.smarterbusinessprocesses.com/wp-includes/js/dist/vendor/react-dom.min.js?ver=18.2.0:10:76580 ) at Kr ( https://staging3.smarterbusinessprocesses.com/wp-includes/js/dist/vendor/react-dom.min.js?ver=18.2.0:10:76892 ) at qr ( https://staging3.smarterbusinessprocesses.com/wp-includes/js/dist/vendor/react-dom.min.js?ver=18.2.0:10:76580 ) ——— Post Text: <! -- wp:stackable/columns {"uniqueId":"31b5dbb","align":"full","innerBlockContentAlign":"alignfull"} --> <div class="wp-block-stackable-columns alignfull stk-block-columns stk-block stk-31b5dbb" data-block-id="31b5dbb"><div class="stk-row stk-inner-blocks stk-block-content stk-content-align stk-31b5dbb-column alignfull"><!-- wp:stackable/column {"uniqueId":"256570d"} --> <div class="wp-block-stackable-column stk-block-column stk-column stk-block stk-256570d" data-v="4" data-block-id="256570d"><div class="stk-column-wrapper stk-block-column__content stk-container stk-256570d-container stk--no-background stk--no-padding"><div class="stk-block-content stk-inner-blocks stk-256570d-inner-blocks"><!-- wp:stackable/columns {"uniqueId":"809c4ec"} --> <div class="wp-block-stackable-columns stk-block-columns stk-block stk-809c4ec" data-block-id="809c4ec"><div class="stk-row stk-inner-blocks stk-block-content stk-content-align stk-809c4ec-column"><!-- wp:stackable/column {"uniqueId":"066b706","columnWidth":10,"columnAdjacentCount":3,"hideTablet":true,"hideMobile":true} --> <div class="wp-block-stackable-column stk-block-column stk-column stk--hide-tablet stk--hide-mobile stk-block stk-066b706" data-v="4" data-block-id="066b706"><style>@media screen and (min-width:768px){.stk-066b706{flex:1 1 calc(10% - var(--stk-column-gap,0px) * 2 / 3 ) !important}}</style><div class="stk-column-wrapper stk-block-column__content stk-container stk-066b706-container stk--no-background stk--no-padding"><div class="stk-block-content stk-inner-blocks stk-066b706-inner-blocks"><!-- wp:paragraph --> <p></p> <!-- /wp:paragraph --></div></div></div> <!-- /wp:stackable/column --> <!-- wp:stackable/column {"uniqueId":"742764f","columnWidth":80,"columnAdjacentCount":3} --> <div class="wp-block-stackable-column stk-block-column stk-column stk-block stk-742764f" data-v="4" data-block-id="742764f"><style>@media screen and (min-width:768px){.stk-742764f{flex:1 1 calc(80% - var(--stk-column-gap,0px) * 2 / 3 ) !important}}</style><div class="stk-column-wrapper stk-block-column__content stk-container stk-742764f-container stk--no-background stk--no-padding"><div class="stk-block-content stk-inner-blocks stk-742764f-inner-blocks"><!-- wp:embed {"url":"https://www.youtube.com/watch?v=xgHOjeiQ7nQ","type":"video","providerNameSlug":"youtube","responsive":true,"className":"wp-embed-aspect-16-9 wp-has-aspect-ratio"} --> <figure class="wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio"><div class="wp-block-embed__wrapper"> https://www.youtube.com/watch?v=xgHOjeiQ7nQ </div></figure> <!-- /wp:embed --></div></div></div> <!-- /wp:stackable/column --> <!-- wp:stackable/column {"uniqueId":"561a97d","columnWidth":10,"columnAdjacentCount":3,"hideTablet":true,"hideMobile":true} --> <div class="wp-block-stackable-column stk-block-column stk-column stk--hide-tablet stk--hide-mobile stk-block stk-561a97d" data-v="4" data-block-id="561a97d"><style>@media screen and (min-width:768px){.stk-561a97d{flex:1 1 calc(10% - var(--stk-column-gap,0px) * 2 / 3 ) !important}}</style><div class="stk-column-wrapper stk-block-column__content stk-container stk-561a97d-container stk--no-background stk--no-padding"><div class="stk-block-content stk-inner-blocks stk-561a97d-inner-blocks"><!-- wp:paragraph --> <p></p> <!-- /wp:paragraph --></div></div></div> <!-- /wp:stackable/column --></div></div> <!-- /wp:stackable/columns --></div></div></div> <!-- /wp:stackable/column --></div></div> <!-- /wp:stackable/columns --> The page I need help with: [ log in to see the link]
Hi Mike, I am unable to replicate the issue so far. I installed BlockMeister and Stackable on a fresh local site. Added a pattern with the code you provided. I was able to edit the pattern again after publishing. The dev console showed no errors. I tried several settings too. Regarding the error message, complaining about the failed ‘removeChild’ call, this isn’t a call done by BlockMeister. So I suspect that another plugin is causing this. Please temporary deactivate any other plugins besides BlockMeister and Stackable. And try again. If you get the same issue then also deactivate stackable and try again. You will now see a message though with the text, you can ignore that: Your site doesn’t include support for the “stackable/columns” block. You can leave this block intact, convert its content to a Custom HTML block, or remove it entirely. Keep as HTML Regards, Benny
Benny, many thanks for getting back to me so quickly, for time looking into this and for your advice. Much appreciated. I disabled all plugins – apart from BlockMeister and Stackable – and attempted to edit the Block Pattern, but experienced exactly the same result ! So I disabled Stackable and tried again [ I ignored “Your site doesn’t include support for the “stackable/columns” block. You can leave this block intact, convert its content to a Custom HTML block, or remove it entirely.” and opted to Save as HTML This created a CustomHTML block Again, any attempt to edit this block results in same error(s) as before: Error: Failed to execute ‘removeChild’ on ‘Node’: The node to be removed is not a child of this node. at jr ( https://staging3.smarterbusinessprocesses.com/wp-includes/js/dist/vendor/react-dom.min.js?ver=18.2.0:10:75178 ) at qr ( https://staging3.smarterbusinessprocesses.com/wp-includes/js/dist/vendor/react-dom.min.js?ver=18.2.0:10:76430 ) at Kr ( https://staging3.smarterbusinessprocesses.com/wp-includes/js/dist/vendor/react-dom.min.js?ver=18.2.0:10:76892 ) at qr ( https://staging3.smarterbusinessprocesses.com/wp-includes/js/dist/vendor/react-dom.min.js?ver=18.2.0:10:76580 ) at Kr ( https://staging3.smarterbusinessprocesses.com/wp-includes/js/dist/vendor/react-dom.min.js?ver=18.2.0:10:76892 ) at qr ( https://staging3.smarterbusinessprocesses.com/wp-includes/js/dist/vendor/react-dom.min.js?ver=18.2.0:10:76580 ) at Kr ( https://staging3.smarterbusinessprocesses.com/wp-includes/js/dist/vendor/react-dom.min.js?ver=18.2.0:10:76695 ) at qr ( https://staging3.smarterbusinessprocesses.com/wp-includes/js/dist/vendor/react-dom.min.js?ver=18.2.0:10:76580 ) at Kr ( https://staging3.smarterbusinessprocesses.com/wp-includes/js/dist/vendor/react-dom.min.js?ver=18.2.0:10:76892 ) at qr ( https://staging3.smarterbusinessprocesses.com/wp-includes/js/dist/vendor/react-dom.min.js?ver=18.2.0:10:76580 ) I have no idea where that leaves us ? Anything else you can suggest that might shed light on what’s going on here ? Or should I simply wipe the staging site & start again from scratch ? ( this would be a pretty unsatisfactory approach. I had hoped that tracking down the problem might have shed light on its cause – helping both of us – but I’m at a loss here ) Might the problem be Theme (Blocksy Pro) related ?
Mike, I tested this again, now with the Blocksy theme activated (the free version though) and everything still worked. So I still cannot replicate the issue. Did you try to add and edit another pattern, maybe first with just using core blocks? Or should I simply wipe the staging site & start again from scratch ? An easy and fast option is to test BlockMeister through a free test instances on InstaWP, use this link for that: https://instawp.io/plugins/blockmeister/ This will set up a new test site for you, with BlockMeister installed already. You may need to activate it though. This way you can test things in isolation. I suggest to first replicate your test pattern there and if it goes well add Blocksy and Stackable and see if the issue pops up there too.
Benny, I’ve tested BlockMeister on another site that’s built using Blocksy Pro – without a problem! So I went back to https://staging3.smarterbusinessprocesses.com/ and built a Block Pattern from scratch using only core blocks – and it exhibited the same errors as before!!! So I deleted and recreated and recreated the staging site, installed BlockMeister and tried again – same result – but this time I noticed that the Google Translate icon was present in the Chrome address bar, and had detected German which it was translating into English. I selected the icon and selected the option to ‘Never Translate this site’ – and the ‘problem’ seems to have disappeared… I’ve NEVER encountered a ‘translation’ issue whilst editing a page using the WordPress Editor before. It only appeared whilst editing Block Patterns <span style=”text-decoration: underline;”>and</span> only on this particular site!! So I’ve no idea what might have caused automatic translation to take place – or why this resulted in the error message I’ve been seeing but, for the moment, all seems fine. I’ll give BlockMeister a spin on the live site – at least I know what t look for if a similar problem surfaces again 🤕 Thanks for your help with this Much Appreciated Mike
You are welcome! I am glad you found the culprit. Kind regards, Benny
Hi Mike, I am unable to replicate the issue so far. I installed BlockMeister and Stackable on a fresh local site. Added a pattern with the code you provided. I was able to edit the pattern again after publishing. The dev console showed no errors. I tried several settings too. Regarding the error message, complaining about the failed ‘removeChild’ call, this isn’t a call done by BlockMeister. So I suspect that another plugin is causing this. Please temporary deactivate any other plugins besides BlockMeister and Stackable. And try again. If you get the same issue then also deactivate stackable and try again. You will now see a message though with the text, you can ignore that: Your site doesn’t include support for the “stackable/columns” block. You can leave this block intact, convert its content to a Custom HTML block, or remove it entirely. Keep as HTML Regards, Benny
Benny, many thanks for getting back to me so quickly, for time looking into this and for your advice. Much appreciated. I disabled all plugins – apart from BlockMeister and Stackable – and attempted to edit the Block Pattern, but experienced exactly the same result ! So I disabled Stackable and tried again [ I ignored “Your site doesn’t include support for the “stackable/columns” block. You can leave this block intact, convert its content to a Custom HTML block, or remove it entirely.” and opted to Save as HTML This created a CustomHTML block Again, any attempt to edit this block results in same error(s) as before: Error: Failed to execute ‘removeChild’ on ‘Node’: The node to be removed is not a child of this node. at jr ( https://staging3.smarterbusinessprocesses.com/wp-includes/js/dist/vendor/react-dom.min.js?ver=18.2.0:10:75178 ) at qr ( https://staging3.smarterbusinessprocesses.com/wp-includes/js/dist/vendor/react-dom.min.js?ver=18.2.0:10:76430 ) at Kr ( https://staging3.smarterbusinessprocesses.com/wp-includes/js/dist/vendor/react-dom.min.js?ver=18.2.0:10:76892 ) at qr ( https://staging3.smarterbusinessprocesses.com/wp-includes/js/dist/vendor/react-dom.min.js?ver=18.2.0:10:76580 ) at Kr ( https://staging3.smarterbusinessprocesses.com/wp-includes/js/dist/vendor/react-dom.min.js?ver=18.2.0:10:76892 ) at qr ( https://staging3.smarterbusinessprocesses.com/wp-includes/js/dist/vendor/react-dom.min.js?ver=18.2.0:10:76580 ) at Kr ( https://staging3.smarterbusinessprocesses.com/wp-includes/js/dist/vendor/react-dom.min.js?ver=18.2.0:10:76695 ) at qr ( https://staging3.smarterbusinessprocesses.com/wp-includes/js/dist/vendor/react-dom.min.js?ver=18.2.0:10:76580 ) at Kr ( https://staging3.smarterbusinessprocesses.com/wp-includes/js/dist/vendor/react-dom.min.js?ver=18.2.0:10:76892 ) at qr ( https://staging3.smarterbusinessprocesses.com/wp-includes/js/dist/vendor/react-dom.min.js?ver=18.2.0:10:76580 ) I have no idea where that leaves us ? Anything else you can suggest that might shed light on what’s going on here ? Or should I simply wipe the staging site & start again from scratch ? ( this would be a pretty unsatisfactory approach. I had hoped that tracking down the problem might have shed light on its cause – helping both of us – but I’m at a loss here ) Might the problem be Theme (Blocksy Pro) related ?
Mike, I tested this again, now with the Blocksy theme activated (the free version though) and everything still worked. So I still cannot replicate the issue. Did you try to add and edit another pattern, maybe first with just using core blocks? Or should I simply wipe the staging site & start again from scratch ? An easy and fast option is to test BlockMeister through a free test instances on InstaWP, use this link for that: https://instawp.io/plugins/blockmeister/ This will set up a new test site for you, with BlockMeister installed already. You may need to activate it though. This way you can test things in isolation. I suggest to first replicate your test pattern there and if it goes well add Blocksy and Stackable and see if the issue pops up there too.
Benny, I’ve tested BlockMeister on another site that’s built using Blocksy Pro – without a problem! So I went back to https://staging3.smarterbusinessprocesses.com/ and built a Block Pattern from scratch using only core blocks – and it exhibited the same errors as before!!! So I deleted and recreated and recreated the staging site, installed BlockMeister and tried again – same result – but this time I noticed that the Google Translate icon was present in the Chrome address bar, and had detected German which it was translating into English. I selected the icon and selected the option to ‘Never Translate this site’ – and the ‘problem’ seems to have disappeared… I’ve NEVER encountered a ‘translation’ issue whilst editing a page using the WordPress Editor before. It only appeared whilst editing Block Patterns <span style=”text-decoration: underline;”>and</span> only on this particular site!! So I’ve no idea what might have caused automatic translation to take place – or why this resulted in the error message I’ve been seeing but, for the moment, all seems fine. I’ll give BlockMeister a spin on the live site – at least I know what t look for if a similar problem surfaces again 🤕 Thanks for your help with this Much Appreciated Mike
You are welcome! I am glad you found the culprit. Kind regards, Benny