Problems Using Gutenberg Field After Previously Using Another

Question

Problems Using Gutenberg Field After Previously Using Another

mikebronner opened this issue 5 years ago · comments

Gutenberg field fails with multiple JS errors if trying to edit a Gutenberg field after having previously edited another without doing a hard page refresh.

Mike Bronner · Answer 1 · Wed Jun 05 2019 07:16:58 GMT+0800 (China Standard Time)

@dimiandre Release 0.1.2 implements a non-optimal work-around to overcome this issue until a better solution can be found: if the editor had been previously used without a page refresh, the page will be forcefully reloaded.

Mike Bronner · Answer 2 · Wed Jun 05 2019 10:26:02 GMT+0800 (China Standard Time)

@dimiandre This is now fixed in 0.1.3. Thanks for your patience! Please let me know if you run into anything else. I will be implementing content display on index and detail page tomorrow.

Andrea Di Michele · Answer 3 · Wed Jun 05 2019 16:58:37 GMT+0800 (China Standard Time)

Thanks man, great job.
Do you need na hand implementing the upload image to laravel storage? I'm about to work on it

Mike Bronner · Answer 4 · Wed Jun 05 2019 20:59:30 GMT+0800 (China Standard Time)

@dimiandre I'll be happy to accept PRs! :) I will be looking into image uploading just as soon as I have finished the index and detail views.

Mike Bronner · Answer 5 · Wed Jun 05 2019 23:20:36 GMT+0800 (China Standard Time)

This issue seems to still persist. Not sure why, or why it seemed to have been resolved yesterday. :(
Re-implementing force-reloading of page. Ugh

Zach Johnson · Answer 6 · Tue Jun 11 2019 03:44:22 GMT+0800 (China Standard Time)

Would destroying the Gutenberg instance in a beforeDestroy event on the FormField help resolve this?

Mike Bronner · Answer 7 · Tue Jun 11 2019 03:45:12 GMT+0800 (China Standard Time)

@hellozach Would love a PR if you can figure it out. :)

Zach Johnson · Answer 8 · Tue Jun 11 2019 23:38:32 GMT+0800 (China Standard Time)

@mikebronner I was able to make some tweaks to the FormField.vue file and use it without needing a refresh on multiple pages inside Nova.

I did some digging into the WordPress/gutenberg project and it looks like the Block [block name] is already registered errors are cosmetic and not preventing the editor from functioning properly (personally, I feel like these would be better served as warnings instead of errors): https://github.com/WordPress/gutenberg/blob/d1cc70a377151f174a959788485599fad09249bc/packages/blocks/src/api/registration.js#L94-L99

The blocks can be unregistered before Laraberg.init(...) to prevent these errors, but when saving there is a split moment that Gutenberg can't find blocks to initialize again.

Unregistering blocks to prevent "already registered" errors:

wp.blocks.getBlockTypes().forEach(block => {
    wp.blocks.unregisterBlockType(block.name)
});

Single error while saving in Nova with a Gutenberg editor (I can't seem to find what exactly is causing this error):

TypeError: Cannot read property 'name' of undefined
    at fo (nova-gutenberg-laraberg:1041)
    at Ao (nova-gutenberg-laraberg:1041)
    at t.value (nova-gutenberg-laraberg:1041)
    at Fd (react-dom.production.min.js:92)
    at Mf (react-dom.production.min.js:92)
    at ph (react-dom.production.min.js:98)
    at eg (react-dom.production.min.js:125)
    at fg (react-dom.production.min.js:126)
    at wc (react-dom.production.min.js:138)
    at fa (react-dom.production.min.js:137)

Zach Johnson · Answer 9 · Wed Jun 12 2019 01:53:06 GMT+0800 (China Standard Time)

Added to my open PR to remove the hard refresh requirement: #7

Mike Bronner · Answer 10 · Tue Aug 06 2019 21:27:11 GMT+0800 (China Standard Time)

This should have been fixed a while back, I think I forgot to close this.