Two New User Experience Wins Coming to Drupal 10.1

By mherchel, 29 December, 2022

Drupal 10 got two (somewhat late) Christmas presents committed over the past week! Huge thank you to all the contributors who made this happen!

Claro’s bulk operations form has been redesigned

A culmination of over three years of hard work, the Implement bulk operation designs issue has finally been committed! This issue was trickier than expected because an enormous amount of work needed to be done to ensure an exceptional level of accessibility. This includes making sure that any focused items are not covered up by the floating toolbar. View the change record.

That was a long march - Lauri Eskola

CKEditor 5 now respects the field widget’s row value

In versions of Drupal prior to 10.1, the “row” setting within your field widget was completely ignored by CKEditor.

Image
Screenshot of field widget showing rows value
Field widget's row setting was previously ignored.

In prior versions of Drupal 10, the height of CKEditor 5 would always equate to 1 row regardless of the row setting (the editor's height would grow as more content is entered). Note that this behavior wasn’t technically a bug, because of the disclaimer text above that states, “Text editors (like CKEditor) may override this setting.”

Image
Screenshot of CKEditor showing a very short height
Even if the field widget rows value was set to a large value, CKEditor 5 would only show 1 row (and grow with content).

In my opinion, this is an editor usability issue. The body field above is meant for long-form content, but the short size of the WYSIWYG input doesn’t inform the editor of that purpose.

Within Drupal 10.1, we now respect that value. However, the number of lines is somewhat subjective. Are we counting the number of new paragraphs, or the number of paragraphs with multiple line-breaks in it? For that matter, we could count headings.

I personally don’t care… but after much discussion (and a slight bit of bikeshedding), we settled on making it take into account the height of new paragraphs. We do this by temporarily injecting a <p> tag and measuring its height and margin. We then factor in collapsing margins and multiply by the number of rows from the field widget! View the change record here.

Image
Screenshot of CKEditor showing a height consistent with the user inputted value
Within Drupal 10.1, CKEditor 5 will now respect the field widget's row values.

Drupal 10.1.0 will be a banner release!

Drupal 10.1 is still six months away (due to be released in June 2023). This leaves tons of time to get in new features including new Twig filters, Single Directory Components, additional administrative user experience improvements, and more! Drupal is free open source software, which means we need your help. If you’d like to get involved with things like this, find me (mherchel) in the #frontend channel within Drupal Slack.

Tags

Hey you! Leave a comment!5

Seriously... I really like it when people let me know their thoughts and that they've read this.

The content of this field is kept private and will not be shown publicly.

James Rome (not verified)

8 months 3 weeks ago

Why can't this be fixed in 10.0. I always like my editing pane to "breathe" about my text, and now even the resize pane tab is gone! So far CKE5 is a step backwards.

I totally agree with you. It's because this is technically a "feature request" (because of that disclaimer text above), and features go into the next release.

In the meantime, you can apply the patch directly via composer patches. I plan on doing that when moving my sites to D10.

For Drupal 10, the patch that you want is located in comment 83. The URL to the patch is https://www.drupal.org/files/issues/2022-12-28/3241295-d10-83.patch

If you're in Drupal 9.5, you can use the patch in #91 at https://www.drupal.org/files/issues/2023-01-01/3241295-ckeditor-height-9.5.x.patch

To apply these patches on a composer install, you need https://github.com/cweagans/composer-patches.

Once that's installed, you can use this article to add the patch https://support-acquia.force.com/s/article/360048081193-Managing-patches-with-Composer