Gutenberg: Post "update failed" with shortcode

Created on 4 Jan 2019 · 2Comments · Source: WordPress/gutenberg

Describe the bug
If you create a new page with a shortcode element in it (widget>shortcode or paragraph>[myshortcode] it outputs "update failed" although it saves the post.

To Reproduce
Steps to reproduce the behavior:

Add a shortcode in your functions.php:

add_shortcode('myshortcode', 'myshortcode_sc');

function myshortcode_sc() {
    ?>
    <p class="test">
This is a test
</p>
<?php
}

Create a new post
Insert the shortcode [myshortcode] in the post.
Press update/save
See error "update failed"
Preview Page and see that it saved although the error occured

Installed WP version: WordPress 5.0.2

Console log on save/update post:
Request URL: https://mydomain.de/wp-json/wp/v2/pages/6?_locale=user
Request Method: POST
Status Code: 200
Remote Address: 00.00.000.000:443
Referrer Policy: strict-origin-when-cross-origin

And now the strange thing - in the response you can find the rendered shortcode (which produces the error?):

<p class="test">
This is a test
</p>
        {"id":6,"date":"2018-12-27T12:53:23","date_gmt":"2018-12-27T11:53:23","guid":{"rendered":"https:\/\/mydomain.de\/?page_id=6","raw":"https:\/\/mydomain.de\/?page_id=6"},"modified":"2019-01-04T13:51:12","modified_gmt":"2019-01-04T12:51:12","password":"","slug":"startseite","status":"publish","type":"page","link":"https:\/\/mydomain.de\/startseite\/","title":{"raw":"Startseite 1","rendered":"Startseite 1"},"content":{"raw":"<!-- wp:shortcode -->\n[myshortcode]\n<!-- \/wp:shortcode -->","rendered":"\n","protected":false,"block_version":1},"excerpt":{"raw":"","rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":[],"permalink_template":"https:\/\/mydomain.de\/%pagename%\/","generated_slug":"startseite-1","_links":{"self":[{"href":"https:\/\/mydomain.de\/wp-json\/wp\/v2\/pages\/6"}],"collection":[{"href":"https:\/\/mydomain.de\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/mydomain.de\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/mydomain.de\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/mydomain.de\/wp-json\/wp\/v2\/comments?post=6"}],"version-history":[{"count":21,"href":"https:\/\/mydomain.de\/wp-json\/wp\/v2\/pages\/6\/revisions"}],"predecessor-version":[{"id":226,"href":"https:\/\/mydomain.de\/wp-json\/wp\/v2\/pages\/6\/revisions\/226"}],"wp:attachment":[{"href":"https:\/\/mydomain.de\/wp-json\/wp\/v2\/media?parent=6"}],"wp:action-publish":[{"href":"https:\/\/mydomain.de\/wp-json\/wp\/v2\/pages\/6"}],"wp:action-unfiltered-html":[{"href":"https:\/\/mydomain.de\/wp-json\/wp\/v2\/pages\/6"}],"wp:action-assign-author":[{"href":"https:\/\/mydomain.de\/wp-json\/wp\/v2\/pages\/6"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

Reload page
See that the shortcode is rendered in the response json containing the rendered shortcode (even before the <html>?):
Request URL: https://mydomain.de/wp-admin/post.php?post=6&action=edit
Request Method: GET
Status Code: 200
Remote Address: 00.00.00.000:443
Referrer Policy: strict-origin-when-cross-origin
See file response-loading-page.txt
response-loading-post.txt

[Feature] Shortcodes [Type] Help Request

Source

grosssmutttr

👍2

Most helpful comment

Shortcode callbacks are supposed to return content, not print content.

See https://codex.wordpress.org/Shortcode_API for examples on how to properly add shortcodes.

swissspidy on 4 Jan 2019

👍4 👀1

All 2 comments

Shortcode callbacks are supposed to return content, not print content.

See https://codex.wordpress.org/Shortcode_API for examples on how to properly add shortcodes.

swissspidy on 4 Jan 2019

👍4 👀1

Since Google points here when you search for this error, and I ran across this myself in a weird situation where I'm replacing a page instead of just inserting text into it (yeah, this is a serious abuse of a shortcode, I know), the following code at the top of your shortcode will get rid of the error saving it in the editor:

    if (count(array_filter(array_column(debug_backtrace(DEBUG_BACKTRACE_IGNORE_ARGS), 'file'), function($var) { return preg_match("/rest-api/", $var); } )) > 0) {
        # If we got invoked from the page/post editor generating a preview
        return "<p>This page would be replaced by a CSV document when viewed live.</p>";
    }

Replace the returned text with something appropriate.

Note that this is a really rare case that you would ever want to alter headers or directly echo from your shortcode. Unless you're intentionally doing something weird like I was, you should be returning your content instead of echoing it.