wordpress-mobile / wordpress-mobile/AztecEditor-iOS

Can't break out of Gutenberg quote block at end of post

Open
#1,090 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

[Type] Bug Gutenberg Compatibility
Dominant language
Swift
Stars
669
Forks
153
Avg merge
11h 27m
Merged PRs (30d)
4

Description

Original report by @rachelmcr here: https://github.com/wordpress-mobile/WordPress-iOS/issues/10465

Expected behavior

When a post ends with a blockquote, I should be able to break out of the quote to start a new paragraph.

Actual behavior

If a Gutenberg posts ends with a blockquote, you can't start a new paragraph block after it.

In visual mode it looks like you're starting a new paragraph, but it's absorbed into the quote block:

<!-- wp:quote -->
<blockquote class="wp-block-quote">
  <p>This is a quote.</p>
</blockquote>
<p>More text.</p>
<!-- /wp:quote -->

And if the quote includes a citation, your new paragraph ends up in cite tags:

<!-- wp:quote -->
<blockquote class="wp-block-quote">
  <p>This is a quote.</p>
<cite>And a citation.</cite>

</blockquote>
<cite>More text.</cite><!-- /wp:quote -->

This issue can be easily resolved if you edit the post in Gutenberg (the "Resolve" button there correctly moves the paragraphs into paragraph blocks) but it can cause front-end formatting problems if no changes are made to the post after saving it in the app.

Steps to reproduce the behavior
  1. Launch the empty Gutenberg editor demo.
  2. Switch to HTML mode and paste the following snippet:
<!-- wp:quote -->
<blockquote class="wp-block-quote">
  <p>This is a quote.</p>
</blockquote>
<!-- /wp:quote -->
  1. Switch back to visual mode.
  2. Try to start a new paragraph after the quote. (With the cursor at the end of the quote, hit Enter twice and then type new text.)
  3. Switch to HTML mode and view the output.
Tested on iPhone XS, iOS 12.0.1, WPiOS 11.2.0.2018110701 & iPhone XS simulator, WPiOS develop branch

Original report: https://ios.forums.wordpress.org/topic/create-new-block-after-blockquote

cc @diegoreymendez

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Reproduce the issue in the empty Gutenberg editor demo using the HTML snippet, then compare the output after switching between HTML and visual modes. Check the quote behavior when pressing Enter twice at its end, including a citation; done means new text is stored in a separate paragraph block rather than inside the quote or cite tags.

Written by the indexing model from the issue text.

Assessment

Tech stack
swift
Domain
mobile-dev
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Clearly specified
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.