Existing images show error

  • When I edit an existing page that has image blocks, I see “This block contains unexpected or invalid content. Attempt Block Recovery”. This is only happening on some existing pages. Clicking “Block Recovery” restores the image but it is much bigger (shows Large on the Resolution drop down). If I select Medium it goes to small size. I need to stretch the image to go back to the original size. If I ignore the error message, the published site shows the image correctly. This problem started about 3 weeks ago. I have WP 6.3.1, Astra 1.2.12 and Gutenberg 16.5.1. Deactivating Gutenberg did not solve the problem.

    The page I need help with: [log in to see the link]

Viewing 11 replies - 1 through 11 (of 11 total)

  • Hi @gmeyers you mention the problem started about 3 weeks ago, can you remember if you upgraded WordPress to version 6.3 at about the same time?

    Does your webhost offer you a staging site option, where you could make a copy of the site, downgrade the WordPress version, and see if the problem is related to the WordPress upgrade?

    Thread Starter gmeyers

    (@gmeyers)

    It;s likely this problem happened after 6.3 was installed. I am not able to save a copy and downgrade to an earlier version. I use Gutenberg block editor and I see this problem in some image blocks. Has this problem been reported by others? When the error message occurs, is there any way I can generate any debugging information for you to analyze? Can you check in the code where this error message is generated to get more information?

    [ Please do not bump. ]

    • This reply was modified 1 year, 2 months ago by gmeyers.

    I’m not aware of any problems, it could be the upgrade, or it could also be a plugin or theme conflict. That’s why I asked if you’re able to perform a downgrade first, to see if things resolve themselves.

    With regards to debugging information, if you’re able to open your browser’s developer tools and go to edit a post or page where the problem is happening, you should see any errors being reported in the Dev Tools Console (example for Chrome browsers).

    Thread Starter gmeyers

    (@gmeyers)

    This is an example page where I see the image problem. Below is what I see in the developer tool for the first image (“having fun at AsiaSF”). Other images on this page have similar errors.

    =======================================

    logger.js:17 Block validation: Expected attributes Array(3), instead saw Array(4).

    (anonymous) @ logger.js:17

    logger.js:17 Block validation: Block validation failed for core/image (Object).

    Content generated by save function:

    <figure class=”wp-block-image aligncenter size-large is-resized”><img src=”https://berkeleyandbeyond2.com/wp-content/uploads/2023/01/SF-AsiaSF-cocktail-called-blow-job-c2014-Carole-Terwilliger-Meyers-iPhone-1024×765.jpg&#8221; alt=”having fun at AsiaSF in San Francisco, California” class=”wp-image-4085″/><figcaption class=”wp-element-caption”>having fun at AsiaSF in San Francisco, California</figcaption></figure>

    Content retrieved from post body:

    <figure class=”wp-block-image aligncenter size-large is-resized”><img src=”https://berkeleyandbeyond2.com/wp-content/uploads/2023/01/SF-AsiaSF-cocktail-called-blow-job-c2014-Carole-Terwilliger-Meyers-iPhone-1024×765.jpg&#8221; alt=”having fun at AsiaSF in San Francisco, California” class=”wp-image-4085″ style=”width:512px;height:383px”/><figcaption class=”wp-element-caption”>having fun at AsiaSF in San Francisco, California</figcaption></figure>

    Thank @gmeyers, I’m going to ask around and see if this is an error related to the core update or not.

    I will get back to you here once I know more.

    Thread Starter gmeyers

    (@gmeyers)

    Have you gotten any more info on this>

    Thread Starter gmeyers

    (@gmeyers)

    Any more updates on this error? We still see it on some existing pages that have images when we edit the page. The images were “normal” when we first added them to the page but now they require resizing to clear the error.

    I’m also seeing this. Look in console:

    [Warning] Block validation: Expected attributes  (gutenberg.js, line 7576)
Array (2)
0 ["src", "logo.svg", true] (3)
1 ["class", "wp-image-138492", true] (3)

Array Prototype
, instead saw 
Array (3)
0 ["src", "logo.svg", true] (3)
1 ["class", "wp-image-138492", true] (3)
2 ["style", "width:300px;height:undefinedpx", true] (3)

    To me it seems 6.3.X has introduced adding inline styles to image blocks and this is not being handled properly in the deprecations?

    Note: I only see this happening with SVGs. We are using the SafeSVG plugin to allow SVG uploading. Deactivating that does not affect the error.

    • This reply was modified 1 year, 1 month ago by James Hunt.
    devonbussell

    (@devonbussell)

    Just wanted to report that I am having the same issue on a client site – it applies to PNGs/JPEGs for me too.

    We have been running 6.3.2. I just upgraded to 6.4.1. The issue was brought to my attention two weeks ago.

    Has anyone seen the issue resolve itself after upgrading to 6.4, or is downgrading the only solution that has worked for anyone?

    Thread Starter gmeyers

    (@gmeyers)

    We have upgraded to WP 6.4.1 and the issue still exists. We’ve been living with the work-around of clicking the “Attempt Block Recovery” button and then resizing the resulting image. A pain but only needed if we need to update an existing page.

    Thread Starter gmeyers

    (@gmeyers)

    I’m at WP 6.4.2 and the problem still exists. Has anyone found a solution?

Viewing 11 replies - 1 through 11 (of 11 total)
  • The topic ‘Existing images show error’ is closed to new replies.