Convert to blocks: preserve alignment

[ellatrix]

Description

Fixes #11676. When converting to blocks from legacy content, preserve alignment on paragraphs and headings.

How has this been tested?

Add a classic block, then add a paragraph and align it. Convert to blocks. Alignment should be preserved.

Screenshots

Types of changes

Checklist:

• My code is tested.
• My code follows the WordPress code style.
• My code follows the accessibility standards.
• My code has proper inline documentation.
• I've included developer documentation if appropriate.
• I've updated all React Native files affected by any refactorings/renamings in this PR. .

[hypest]

👋, this PR introduces a regression in the native mobile app (wordpress-mobile/gutenberg-mobile#1688) most probably due to the usage of node.style which is not available in the React Native app.

[ellatrix]

@hypest Why is it not available there?

[hypest]

Why is it not available there?

👋 @ellatrix. The jsdom library currently used in the native mobile side doesn't support/parse the style atrributes for the nodes. If I should speculate, I'd assume it's not supported because styling in RN is not applied via CSS.

We had a similar case before (code here), where we have to guard for null node.style. See related discussion here.

[ellatrix]

@hypest I expect it to be used much more in the future. Can it be set to an empty object or something?

[mkevins]

Hi @ellatrix 👋
Nice work with preserving alignment in the transforms! Regarding the undefined style property:

Can it be set to an empty object or something?

We could set this to {} in jsdom-jscore-rn, but one concern I have with that approach is that we won't know the future cases in which the behavior may deviate from expectation. Another possibility, in this case, would be something like const { textAlign } = node.style || {}.

Solving it on a case-by-case basis like this is not ideal, but at least allows us to see what impact it might have if we "fake" the property. A better long term solution would be to have an implementation of the style property on our HTMLElements in our mobile DOM implementation. A ticket has been opened for this: wordpress-mobile/gutenberg-mobile#1689

[hypest]

Thanks for adding your thoughts @mkevins !

I agree that only fixing this for the specific breaking case is not a long term solution but it will at least help us to not turn the crashes into silent errors that will manifest elsewhere (which would be harder to debug). Let's go with the const { textAlign } = node.style || {} solution. I'll open a PR.

[ellatrix]

I just opened #19196.