How to deal with an additional markup in RichTextWidet.astro getting lost in edit mode?

[pshemek]

In frontend/src/widgets/RichTextWidget.astro we can find:

---
const { widget } = Astro.props;
const { content } = widget;
---
<!-- We know Astro so no needless div here -->
<Fragment set:html={ content }></Fragment>

But what if I want to have a div or section here?
When I change the output to:

<section class="rich-text-widget">
  <div class="wrapper" set:html={content} />
</section>

everything works fine in preview.

Unfortunately, in edit mode the wrapping markup gets totally lost and cannot serve its purpose anymore. If I want to rely on it in styling there is no parity between preview and edit layout.

Is this intentional? Can be avoided?

Or maybe the only solution would be to build a custom widget like "TextContentWidget" which embeds AposArea with a single RichTextWidget available?

[BoDonkey]

Sorry that I missed this issue. This is a side effect of the in-context editor for rich text. You can either take the route you described at the end, or my colleague suggested adding .apos-rich-text-editor__editor as a selector with the same styling that is added to the .wrapper.