Skip to content

Fix formatting bugs in Static Site Editor

Enrique Alcántara requested to merge fix-ordered-lists-single-marker-bug into master

What does this MR do?

This Merge Request fixes the following bugs in the Static Site Editor:

The marker in ordered lists becomes incrementing after then 9th item

The formatting preference for ordered lists in the Static Site Editor is to not auto-increment the list marker, for example:

<!-- We prefer -->

1. List item 1
1. List item 2
1. List item 3

<!-- Instead of this -->

1. List item 1
2. List item 2
3. List item 3

The bug occurs when there is a list with more than 9 items. The Static Site Editor will start counting in the 10th item, for example:


<!-- Instead of this -->

1. List item 8
1. List item 9
10. List item 10
11. List item 11

How to reproduce?

  1. In your local environment, open a markdown document in the Static Site Editor. You can use this document.
  2. In WYSIWYG mode, create an ordered list with more than 10 items.
  3. When switching to Markdown mode, the 10 or more items in the list should have the list marker 1..

The Static Site Editor breaks emphasized or bold text that contains softbreaks

For the following markdown:

If you have any product-related questions, comments, input, or otherwise, the
product manager is the primary person you should talk to, _if creating an issue
does not suffice_.

Toast UI generates the following HTML:

<p>If you have any product-related questions, comments, input, or otherwise, the<br>
product manager is the primary person you should talk to, <em>if creating an issue<br>
does not suffice</em>.

Squire, the rich content editor used by Toast UI, further converts that HTML into this:

If you have any product-related questions, comments, input, or otherwise, the<br>product manager is the primary person you should talk to, <i>if creating an issue</i><br>does not suffice. Otherwise, <a href=\"/handbook/product/product-processes/#how-to-submit-a-new-issue\">read this section on how to create an</a><br>issue.<br>

As you can see in this example, Squire breaks the emphasized text because part of the text appears in a new line. This MR fixes this bug by removing softbreaks from formatting nodes like _ and **.

How to reproduce?

  1. In your local environment, open a markdown document in the Static Site Editor. You can use this document.
  2. Switch to Markdown mode.
  3. Paste the markdown snippet shared on this bug description.
  4. Switch to WISIWYG mode.
  5. With the bug fix, the emphasized text should not break into two parts.

Does this MR meet the acceptance criteria?

Conformity

Availability and Testing

Security

If this MR contains changes to processing or storing of credentials or tokens, authorization and authentication methods and other items described in the security review guidelines:

  • Label as security and @ mention @gitlab-com/gl-security/appsec
  • The MR includes necessary changes to maintain consistency between UI, API, email, or other methods
  • Security reports checked/validated by a reviewer from the AppSec team
Edited by Enrique Alcántara

Merge request reports