Make WordPress Core

#47281 closed enhancement (fixed)

Editor: KSES: Include Flex properties in CSS whitelist to support core Column block width

Reported by: aduth Owned by: peterwilsoncc
Milestone: 5.3 Priority: normal
Severity: normal Version:
Component: Editor Keywords: has-patch
Focuses: Cc:


Related: #46597 (r45242)
Related: https://github.com/WordPress/gutenberg/pull/15499

As of Gutenberg 5.7, the Column block supports a width attribute which is implemented by applying a flex-basis inline style to the block's produced markup. This style attribute is not currently included in the `safe_style_css` filtered array and thus would be removed by users not privileged with the `unfiltered_html` capability (filtered by Gutenberg). As was done with #46597, the default filtered array should be modified to include this new style attribute. This is only necessary if and when the Column enhancements arrive in trunk.

It is an open question whether all (or common) flex attributes should be whitelisted. In my initial patch, I will propose the inclusion of the minimal set necessary for Column block support.

Attachments (3)

47281.patch (734 bytes) - added by aduth 15 months ago.
47281.2.patch (824 bytes) - added by aduth 15 months ago.
47281.diff (1.4 KB) - added by peterwilsoncc 15 months ago.

Download all attachments as: .zip

Change History (8)

15 months ago

#1 @SergeyBiryukov
15 months ago

  • Milestone changed from Awaiting Review to 5.3

#2 @peterwilsoncc
15 months ago

  • Owner set to peterwilsoncc
  • Status changed from new to accepted

To ensure flex-basis is fully supported, let's add the related and shorthand properties as part of this ticket:

  • flex
  • flex-shrink
  • flex-grow

All of these can be considered safe.

15 months ago

#3 @aduth
15 months ago

Thanks for the feedback @peterwilsoncc . I agree. The updated patch 47281.2.patch includes all properties of the `flex` shorthand.

#4 @peterwilsoncc
15 months ago

Added some tests in 47281.diff, the main purpose is flex-shrink: 0 to ensure a bug doesn't get introduced that deletes falsey values.

#5 @peterwilsoncc
15 months ago

  • Resolution set to fixed
  • Status changed from accepted to closed

In 45363:

KSES: Add flex and related long form properties to safe CSS.

Allow flex, flex-grow, flex-shrink and flex-basis to be used in inline CSS. As of WordPress 5.3 the block editor is expected to use flex-basis inline to set the width in the column block.

Props aduth.
Fixes #47281.
See #37248.

Note: See TracTickets for help on using tickets.