Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

RichText: add preserveWhiteSpace prop #18656

Merged
merged 3 commits into from
Nov 25, 2019

Conversation

ellatrix
Copy link
Member

Description

Fixes #18476. White space should be preserved with preformatted <=> paragraph transformations.
Also ensures that any white space in preformatted is preserved. Currently white space is collapsed.

I've done this by adding a preserveWhiteSpace and building it into RichText.

How has this been tested?

Merge a paragraph with a preformatted block.

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. .

@ellatrix ellatrix added [Type] Bug An existing feature does not function as intended [Package] Rich text /packages/rich-text [Block] Preformatted Affects the Preformatted Block - used for showing preformatted text labels Nov 21, 2019
Copy link
Contributor

@SergioEstevao SergioEstevao left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Tested it on RN-mobile on iOS and on the playground and all is working correctly now.

Thanks for the fix @ellatrix

@@ -6,7 +6,8 @@
"type": "string",
"source": "html",
"selector": "pre",
"default": ""
"default": "",
"__unstablePreserveWhiteSpace": true
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why is this in the block.json. Isn't this a RichText prop?

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It is needed for merging the values, which uses create and toHTMLString under the hood. It is similar to __unstableMultilineWrapperTags: https://github.com/WordPress/gutenberg/search?q=__unstableMultilineWrapperTags&unscoped_q=__unstableMultilineWrapperTags. I marked it unstable as maybe there's other ways we want to do this in future.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

mmm didn't know about that one. not great to be honest. Maybe the root issue is with the "merge" itself. maybe it should move to RichText somehow.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yes, we should have a look at it. The problem is that selection is stored based on the rich text value and not based on the HTML.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Does it mean we should add information about these flags in the selection reducer?

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm not sure... Normally they are set with RichText props. We should document the selection reducers to say that the offsets are based on the rich text values, yes.

Copy link
Member Author

@ellatrix ellatrix Nov 25, 2019

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I've added a bit more documentation for WPBlockSelection. I agree that the merge function could be improved, but this should be looked at separately while this PR fixes an issue. The attribute property has been marked unstable so it could be adjusted in the future.

@ellatrix ellatrix force-pushed the try/rich-text-preserve-white-space branch from def524f to 0a6f065 Compare November 22, 2019 08:27
@ellatrix ellatrix merged commit ada00b6 into master Nov 25, 2019
@ellatrix ellatrix deleted the try/rich-text-preserve-white-space branch November 25, 2019 13:53
@ellatrix
Copy link
Member Author

Thanks for the review @SergioEstevao and @youknowriad! Let me know if there's anything I can review for you.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Block] Preformatted Affects the Preformatted Block - used for showing preformatted text [Package] Rich text /packages/rich-text [Status] In Progress Tracking issues with work in progress [Type] Bug An existing feature does not function as intended
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Merge between Preformatted and Paragraph blocks is removing all newlines.
3 participants