Gutenberg: Extending blocks - validation fail

Created on 20 May 2018 · 2Comments · Source: WordPress/gutenberg

I'm using blocks.getSaveContent.extraProps to add a background to all blocks. I'm using the exact code from the documentation. https://wordpress.org/gutenberg/handbook/extensibility/extending-blocks/#blocks-getsavecontent-extraprops

I'm running the code from a plugin and it works fine but when disabling the plugin I get Block validation failed on blocks. Is this normal or is it a bug?

[Feature] Block API [Feature] Extensibility [Type] Enhancement

Source

virgiliud

Most helpful comment

This is expected behavior, but it isn't perfect. We should improve this experience.

There is also a related issue described in this article WordPress Gutenberg Block API: Block Look and Feel:

Secondly, when editing the contents of the save method, something strange seems to happen to the editor window when it's next refreshed.

To demonstrate this, I added a new list item (<li>Indigo</li>) in the save method and then refreshed the post editor (after having to clear the cache again, of course!). Here's the result:

Block update issue

If you choose either Convert to Blocks or Edit as HTML then you get presented with the contents of the save method, which is meant to be viewed on the front end and not in the editor.

Convert to blocks and edit as HTML views

This is very confusing, and the only obvious way to bring things back to normality was to delete the block from the editor window and reinsert it again. As I mentioned in the previous post, Gutenberg is still a work in progress, and this is a good example of that!

gziolo on 21 May 2018

👍4

All 2 comments

This is expected behavior, but it isn't perfect. We should improve this experience.

There is also a related issue described in this article WordPress Gutenberg Block API: Block Look and Feel:

Secondly, when editing the contents of the save method, something strange seems to happen to the editor window when it's next refreshed.

To demonstrate this, I added a new list item (<li>Indigo</li>) in the save method and then refreshed the post editor (after having to clear the cache again, of course!). Here's the result:

Block update issue

If you choose either Convert to Blocks or Edit as HTML then you get presented with the contents of the save method, which is meant to be viewed on the front end and not in the editor.

Convert to blocks and edit as HTML views

This is very confusing, and the only obvious way to bring things back to normality was to delete the block from the editor window and reinsert it again. As I mentioned in the previous post, Gutenberg is still a work in progress, and this is a good example of that!

gziolo on 21 May 2018

👍4

In the meantime @johngodley added support for showing the difference between invalid block and the original one which should mitigate the issue:

The difference appears in a modal and the user can select to keep the current contents or apply the conversion, with full knowledge of the result of their action.