[WIP] Gutenberg block for the [jobs] shortcode using Server-Side Rendering #1545
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
This is an iteration on #1521 to explore Server-Side Rendering as a more useful method for directly wrapping blocks around shortcodes (see #1521 (comment) for a bit more context).
This is not yet feature-complete, as there were a few technical hurdles to overcome in order to get this to work, specifically around getting the shortcode's JavaScript working within Gutenberg (so it would display the correct content). This was done by wrapping the jQuery functionality in a function that supplied a parent element's ID, only attaching handlers to elements within that parent, and rerunning whenever the block is added.
Issues
For the most part, all that is needed is to finish the remainder of the UI for editing attributes. However, there is also an issue with extensions that modify the UI of the shortcode. To see this, install and activate the Job Tags extension, create some tags, and view this block within Gutenberg. The Job Tags JavaScript is not run properly, and so the tags do not show up.
Testing
Install Gutenberg
Go to a Post and add the Jobs block.
Change some attributes in the Edit UI and save the post.
View the post on the frontend to ensure it is rendering the shortcode correctly.