Marked: Contenteditable div and marked.js

Created on 20 Nov 2020  路  7Comments  路  Source: markedjs/marked

Using cdn https://cdn.jsdelivr.net/npm/marked/marked.min.js

Markdown flavor: Default
The project I'm talking about is live at https://nikhilmwarrier.github.io/yellowboard/
Source code: github.com/nikhilmwarrier/yellowboard

Expectation

Whatever you type into a contenteditable div is saved into browser localstorge as plain text.
Whenever the page loads, JS checks localstorage for things last saved and it is parsed using marked. Then it is displayed on the aforementioned contenteditable div using innerHTML, thus displaying formatted text. Or anyway, that was the plan.

Result

It works, but only on the first line of text on the div.

Test it on this link: https://nikhilmwarrier.github.io/yellowboard/

other package question

All 7 comments

What did you type in to make it not work? It seems to work for me.

Just a guess but the issue probably has to do with the fact that html blocks in markdown are terminated by the first empty line.

And you are saving markdown then converting it to html then saving that html and running it through marked again.

Thanks for responding...
Actually, whatever I type gets converted to markdown only if it's in the first line...

it works for me for more than just the first line

paoty

I am pretty sure I am annoying you by this point, but I still can't get this to work. Here is my screen record.

I'm sorry for the video quality, but it's night now at where I live and I had multiple eye-comfort filters on, which also got recorded...

look at what is in the cache after the first refresh. As I said above you are converting it to html then running the html through marked on the second refresh.

According to the spec html blocks in markdown are not converted but left as is.

I don't think that project will work unless you can figure out how to know which parts have already been converted by marked to html and which parts haven't.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

bennycode picture bennycode  路  4Comments

chunhei2008 picture chunhei2008  路  3Comments

learykara picture learykara  路  3Comments

FireflyAndStars picture FireflyAndStars  路  3Comments

vsemozhetbyt picture vsemozhetbyt  路  4Comments