Description

🚧 🚧 🚧 🚧 🚧

This is a WIP PR exploring an idea for swapping out the randomly generated .wp-container-xxxx class names used by the Layout block support with descriptive classnames that we can then use to programmatically regenerate CSS in the editor from rendered markup. The goal is to find a way to resolve #35376 and this exploration follows the approach suggested (as an exploration) in this comment.

To-dos 🔨

• Replace the server-rendered randomly generated class names with descriptive class names
• See if we can extract the classnames from within the Post Content block
• See if we can regenerate the styles from within the block editor, based on the classnames
• If the approach looks viable, see if we can clean up the approach / make it tidy / add some tests
• See if we can de-dupe the generated styles

WIP Screenshots

Step 1: render descriptive class names:

How has this been tested?

TBC

Types of changes

Bug fix (non-breaking change which fixes an issue)

Checklist:

• My code is tested.
• My code follows the WordPress code style.
• My code follows the accessibility standards.
• I've tested my changes with keyboard and screen readers.
• My code has proper inline documentation.
• I've included developer documentation if appropriate.
• I've updated all React Native files affected by any refactorings/renamings in this PR (please manually search all *.native.js files for terms that need renaming or removal).