Address CKEditor5 "more items" bar contents not being fully visible

📌 CKeditor not loading on formatted text fields in the content entity + component instance forms Active is in!

That's an issue of a position: absolute; element inside a overflow: hidden; container. Similar to this https://front-back.com/how-to-make-absolute-positioned-elements-overlap-... but much more complicated. For the dropdown bar a relative element is a hamburger button in primary bar and the overflow: hidden; elements are much higher in the DOM tree.

The sticky toolbar is on the other hand a position: fixed; element so it is not contrained by parents with overflow: hidden;

There is a related issue on CKEditor's github, but unfortunately "Open". There is a workaround, but works only with chromium browsers: https://developer.mozilla.org/en-US/docs/Web/CSS/anchor-name

I wonder if there is a possibility to write a custom plugin that will make the toolbar fixed by default and calculate the proper position relative to the hamburger.

BTW there is same issue for layout builder: https://www.drupal.org/project/drupal/issues/3328095 🐛 CKEditor 5 toolbar overflow can become unusable in Off canvas Needs review

I don't think this would block stable. I'm also pretty sure there isn't currently a way to trigger this in XB.

This issue is related to CKEditor, and a solution has already been proposed in issue #3328095 (MR !8096), but the MR is still under review.
To unblock progress here, I’ve added the patch from that MR.

Please refer to this comment for more details. Patch Link 🐛 CKEditor 5 toolbar overflow can become unusable in Off canvas Needs review