Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Gutenberg Plugin: Add hook to allow writing-mode as a safe CSS property #54581

Merged
merged 1 commit into from
Sep 19, 2023
Merged

Gutenberg Plugin: Add hook to allow writing-mode as a safe CSS property #54581

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
18 changes: 18 additions & 0 deletions lib/compat/wordpress-6.4/kses.php
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,18 @@
<?php
/**
* Temporary compatibility shims for block APIs present in Gutenberg.
*
* @package gutenberg
*/

/**
* Update allowed inline style attributes list.
*
* @param string[] $attrs Array of allowed CSS attributes.
* @return string[] CSS attributes.
*/
function gutenberg_safe_style_attrs_6_4( $attrs ) {
$attrs[] = 'writing-mode';
return $attrs;
}
add_filter( 'safe_style_css', 'gutenberg_safe_style_attrs_6_4' );
1 change: 1 addition & 0 deletions lib/load.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -97,6 +97,7 @@ function gutenberg_is_experiment_enabled( $name ) {
require __DIR__ . '/compat/wordpress-6.4/block-hooks.php';
require __DIR__ . '/compat/wordpress-6.4/block-patterns.php';
require __DIR__ . '/compat/wordpress-6.4/script-loader.php';
require __DIR__ . '/compat/wordpress-6.4/kses.php';

// Experimental features.
require __DIR__ . '/experimental/block-editor-settings-mobile.php';
Expand Down
5 changes: 0 additions & 5 deletions packages/block-library/src/post-navigation-link/index.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -28,14 +28,9 @@ function render_block_core_post_navigation_link( $attributes, $content ) {
if ( isset( $attributes['textAlign'] ) ) {
$classes .= " has-text-align-{$attributes['textAlign']}";
}
$styles = '';
if ( isset( $attributes['style']['typography']['writingMode'] ) ) {
$styles = "writing-mode: {$attributes['style']['typography']['writingMode']};";
}
$wrapper_attributes = get_block_wrapper_attributes(
array(
'class' => $classes,
'style' => $styles,
)
);
Comment on lines -31 to 35
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Since this change will be bundled in with the packages update for core, would it be worth trying to land the change to core's safe_style_css list before attempting to land this Gutenberg PR?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I see, I think that's certainly true.

Would it be ideal to wait to merge this PR until a patch has been submitted to the core that adds writing-mode to the safe_style_css list and is committed in the core?

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I don't think it necessarily needs to be committed to core before merging this PR, but I'd recommend opening a trac ticket and corresponding PR for wordpress-develop before merging if you have the time, that way the change will be ready to land in time.

// Set default values.
Expand Down
4 changes: 3 additions & 1 deletion phpunit/style-engine/style-engine-test.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -192,11 +192,12 @@ public function data_wp_style_engine_get_styles() {
'textDecoration' => 'underline',
'textTransform' => 'uppercase',
'letterSpacing' => '2',
'writingMode' => 'vertical-rl',
),
),
'options' => null,
'expected_output' => array(
'css' => 'font-size:clamp(2em, 2vw, 4em);font-family:Roboto,Oxygen-Sans,Ubuntu,sans-serif;font-style:italic;font-weight:800;line-height:1.3;column-count:2;text-decoration:underline;text-transform:uppercase;letter-spacing:2;',
'css' => 'font-size:clamp(2em, 2vw, 4em);font-family:Roboto,Oxygen-Sans,Ubuntu,sans-serif;font-style:italic;font-weight:800;line-height:1.3;column-count:2;text-decoration:underline;text-transform:uppercase;letter-spacing:2;writing-mode:vertical-rl;',
'declarations' => array(
'font-size' => 'clamp(2em, 2vw, 4em)',
'font-family' => 'Roboto,Oxygen-Sans,Ubuntu,sans-serif',
Expand All @@ -207,6 +208,7 @@ public function data_wp_style_engine_get_styles() {
'text-decoration' => 'underline',
'text-transform' => 'uppercase',
'letter-spacing' => '2',
'writing-mode' => 'vertical-rl',
),
),
),
Expand Down
Loading