add_editor_style now copying html styles to .editor-styles-wrapper?

Question

Edit: I didn't adequately research this question before posting it, so the behavior I'm describing is much older than I realized. The issue I was observing comes from elsewhere. Leaving the original question here for context.

---

add_editor_style copies the styles of the body {} selector from the specified stylesheet into the class selector .editor-styles-wrapper {}. This isn't well-documented, as far as I can tell, other than in a comment in the documentation.

Since upgrading to 6.3 (or possibly earlier), I notice that the styles on html {} are also being copied to .editor-styles-wrapper {}.

So if you load a file like editor-styles.css that contains the following declarations:

html { font-size: 100%; } body { font-size: 1.2rem; } 

WordPress will inject these styles into the editor as:

.editor-styles-wrapper { font-size: 100%; } .editor-styles-wrapper { font-size: 1.2rem; } 

(Previously, the html {} styles would have just been dropped.)

Is this intentional? Is it documented anywhere? This has led to some slight breakages in my editor styles.

Answer 1

I had a look at the code history in the Gutenberg repository, and it looks like html and body have been transformed since the very beginning, 5 years ago:

https://github.com/WordPress/gutenberg/blame/15fc0c13eb33a6e4426ff4ad681b6bfb6d0adaec/packages/editor/src/editor-styles/transforms/wrap.js

:root was added several months later.

So yes, it appears to be intentional, but not new. If something has changed in your styles in 6.3 it must be something else. I can't see any meaningful change in how this feature has been implemented since it was introduced.