Classic block: Convert to Blocks removes data, rb, and rtc elements

[ZebulanStanphill]

The issue

<data>, <rb>, and <rtc> elements are not preserved when converting a Classic block to other blocks using the Convert to Blocks option.

Reproduction steps

1. Create a post using the Classic Editor and open in it Gutenberg, or insert a Classic block in Gutenberg.
2. Open the More Options (ellipsis) menu and choose Edit as HTML.
3. Insert the following markup:

<data value="value">data</data> <ruby>ruby <rb>rb</rb> <rp>rp</rp> <rt>rt</rt> <rtc>rtc</rtc> <rp>rp</rp></ruby>

4. Open the More Options menu again and choose Edit visually.
5. Press More Options → Convert to Blocks. This will result in a Paragraph block being created.
6. Press More Options → Edit as HTML.
7. The markup should all be preserved from the Classic block, but this bug causes <data>, <rb>, and <rtc> elements to be removed.

Related issues and PRs

• Classic + Custom HTML blocks: Convert to Blocks removes valid inline formatting #6102

[designsimply]

Thanks for clearly written issue!

Since I wasn't familiar with these HTML elements, I looked them up and found some have limited browser compatibility and wanted to make a note about that and link to their respective specs for reference:

• https://developer.mozilla.org/en-US/docs/Web/HTML/Element/data#Specifications
• https://developer.mozilla.org/en-US/docs/Web/HTML/Element/rb#Specifications
• https://developer.mozilla.org/en-US/docs/Web/HTML/Element/rtc#Browser_compatibility

[oandregal]

This is now fixed. Probably by some of the changes that affected #12029

[ZebulanStanphill]

@nosolosw I can still reproduce in latest master. Please re-open.

[oandregal]

Hi @ZebulanStanphill this is a GIF I've just recorded with the latest master:

I understood that was what you were expecting to happen, is that correct?

[ZebulanStanphill]

@nosolosw No. If you look at the resulting markup, some of the tags have been stripped out. The <ruby> tag (and some others) were not stripped out, but that's not what this ticket is about. I just put the <ruby> tag there since you're supposed to nest the <rb> and <rtc> elements inside of one, assuming I understand the HTML specification correctly.

The title of this issue says <data>, <rb>, and <rtc> elements are removed, and that is precisely what happens in your GIF.

[oandregal]

Oh, you are so right, I was confused by the actual text while looking at other issues at the same time.

[ellatrix]

This is how the classic editor works (TinyMCE). There's nothing I can do about that. You'll notice that it works in Gutenberg:

1. Create a paragraph block. You'll have to type something in it so the controls appear.
2. Go to more options, then edit as HTML.
3. Insert:

<p><data value="value">data</data> <ruby>ruby <rb>rb</rb> <rp>rp</rp> <rt>rt</rt> <rtc>rtc</rtc> <rp>rp</rp></ruby></p>

4. Edit visually. All content is there.