Markdown editor doesn't manage certain link syntax highlighting correctly when html is in play

Support
1

joplin 1.7.11

Do this in the markdown editor:

### blah1

<https://en.wikipedia.org/w/index.php?title=Thomas_Dyer_Seeley&oldid=999185096>

### blah2

All fine and dandy, right? Now do this.

### blah1

<s><https://en.wikipedia.org/w/index.php?title=Thomas_Dyer_Seeley&oldid=999185096></s>

### blah2

or this

### blah1

<div>

<https://en.wikipedia.org/w/index.php?title=Thomas_Dyer_Seeley&oldid=999185096>

</div>

### blah2

The markdown editor thinks that link is html. It's not. It's markdown.

2

I don't think you can have markdown within an html block. Everything within that block is assumed to be html.

3

Note. This is only a bug in the markdown editor. The resulting rendered output is correct.

Markdown and HTML can mix just fine ... in a markdown document. You just have to honor spacing between block elements and the markdown content. That's how styling is applied for example. I do whole complex-ish webpages in markdown. Floats, flex elements, everything.

Do this is Joplin and look at the rendered output. Discourse treats it right but strips out the styling or I would show you here:

> <div style="padding-left: 5.0vw; text-indent: -2.5vw; width: 50%; font-size: 85%;">
> 
> This is an example of a _hanging indent_  (in Joplin) set up so you can see the power of HTML mixed with markdown. But, you will notice that **this is markdown**. 
> 
> </div>

Same as with span and other inline HTML. It just does the right thing:

> <span>This is inside of a span, but **it's <s>html</s> still markdown**.</span>

<div>

## TEST HEADING0

Now, if add some URLs in their various formats, sometimes the syntax highlighting in the editor gets screwy in Joplin.

[https://example.com](https://example.com) https://example.com <https://example.com>

As you can see even in Discourse comments it does something ... different. BUT the difference stops within the <>s. In Joplin, it screws up the syntax highlighting for everything after the link in angle-brackets. For example, the ## TEST HEADINGs will no longer syntax highlight and be boosted in font size in the editor. All because of that link.

## TEST HEADING1

</div>

## TEST HEADING2

Just try it, and then try again removing the bracketed link, and then do the same but remove the divs. I think you will see what I mean. I hope anyway.

4

I determined that the markdown editor (and thankfully, not the markdown renderer) thinks that <https://example.com> is an unterminated HTML element. For example, <https://example.com/> sets everything straight again following the link. Definitely a bug.

5

Note: This is the case for some html elements, but not all. For example anything wrapped in the pre html tag will not be rendered (as expected).

The markdown editor (CodeMirror) uses a very simplistic parser and as such it can't handle situations like html inside markdown inside html. The new version of CodeMirror will have a better parser, so maybe it will be able to handle this situation. Either way, upgrading is not exactly on the horizon.

6

Great. As long is you're aware.

7

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.