Container Queries break editor style loading

[tomjn]

Description

Adding an editor stylesheet to a theme does not work if that stylesheet contains CSS container queries.

This includes styles that are not container queries.

Step-by-step reproduction instructions

Add a container query such as the following to the editor stylesheet:

/* Default heading styles for the card title */
.card h2 {
  font-size: 1em;
}

/* If the container is larger than 700px */
@container (min-width: 700px) {
  .card h2 {
    font-size: 2em;
  }
}

Now load the editor and observe that all editor styles from the file fail to be applied.

Screenshots, screen recording, code snippet

No response

Environment info

WP 6.2

Please confirm that you have searched existing issues in the repo.

Yes

Please confirm that you have tested with all plugins deactivated except Gutenberg.

Yes

[carolinan]

Hi
WhIch method exactly are you using to load the editor style?
Which theme type? Block/classic, is it reproducable in any theme?
Which editor? Both block editor, template editor, site editor?

[tomjn]

all methods that I have tried have the issue, in my specific case add_editor_style with a block theme, however I raised this after someone on stack exchange also ran into this:

https://wordpress.stackexchange.com/questions/415275/add-editor-style-not-working-after-upgrade-to-wp-v-6-2

They had tried add_editor_style as well as placing a dedicated css file in their theme, and noted that it worked until they upgraded to 6.2.

Note that all block based editors have the problem that I can see, site editor/post editor/etc

[talldan]

If it happens with container queries, there's a good chance it's the same issue as #46277 (also noted in #42727).

There's some work/discussions on a fix in #49483, but I think it's a pretty challenging piece of work.

[tomjn]

Happy for this to be closed as a duplicate