Inline HTML Tags Incorrectly Format Closing Tags

[faelin]

Is this a hackmd.io issue?

• [x] Yes, the bug happens on https://hackmd.io
• [ ] No. If it's a self-hosted CodiMD instance, please fire up the issue in the repo of CodiMD: https://github.com/hackmdio/codimd

What's the problem

When adding inline HTML tags around existing text, the app automatically creates a paired closing tag. This tag will include the text of any word it is touching (see attached example).

Current behaviour

https://user-images.githubusercontent.com/8279240/116823906-3c780300-ab55-11eb-8edc-3b68f99fcbb3.mov

Provide steps to reproduce:

1. Create a new document.
2. Enter some text ("Example text")
3. Move the cursor to the left of any word ("Example |text").
4. Add any HTML tag (for example, <b>)
5. On typing the > part, a matching close-tag will appear, incorrectly including the word to the right. ("Example <b></btext>text")

NOTE: in some rare cases, this error will not be reproduced. Please see the example document linked below to find an example of the error.

If possible, create a note with reproducible content and share the link with us:

https://hackmd.io/@Faelin/BkiD-u2v_

Expected behavior

Closing tag should either be created immediately following start tag, or no closing tag should be created if the start tag is added next to a word.

Suggestions (using example from above):

Preferred behavior would be one of the two following options:

Closing tag immediately after opening.

1. Enter some text: "Example text"
2. Move the cursor to the left of any word: "Example |text"
3. Add any HTML tag: <b>
4. On typing the > part, a matching close-tag will appear immediately following: "Example <b></b>text"

No closing tag next to word.

1. Enter some text: "Example text"
2. Move the cursor to the left of any word: "Example |text"
3. Add any HTML tag: <b>
4. On typing the > part, no closing tag is generated, because the cursor is immediately before a word: "Example <b>text"

Environment

I use HackMD on:

Desktop

• OS: macOS 10.15.7
• Browser: Firefox
• Browser Version: 88.0

Additional context

Issue reproduces in browser and desktop app. In some rare cases, closing tags appear correctly immediately following opening tag. This correct behavior is rare.