showdownjs/showdown

Using listener extensions to add divs

Open

#518 opened on Apr 19, 2018

View on GitHub
 (5 comments) (0 reactions) (1 assignee)JavaScript (13,700 stars) (1,640 forks)batch import
help wanted

Description

Hello @tivie,

I'm trying to use an extension to add divs. Within the showdown extensibility model, it seems to me that listener extensions are the right way to do this, but with them not being documented (and from what I can tell, buggy), it is difficult to figure out.

Digging into the code and looking at examples, I found a jsfiddle that I modified to see if I could make it work. My goal is simple: if I have ::: className as an enclosure opening and ::: as a enclosure closing, then convert that to <div class="className">...</div>, where ... represents everything within the div enclosure.

I've gotten this to work somewhat, here: https://jsfiddle.net/poshoholic/Lxkjyv11/34/

The problem I've run into is figuring where to put this in the listener event resolution order. How do I define this extension to get the following behavior:

  • <div ...> is never, ever wrapped in a paragraph tag;
  • </div> is never picked up as part of a list/list item, unless the entire div is inside of the list item;
  • </div> is never picked up at the end of a table as another row;

Ideally I would like this to work without having to place blank lines around tables, lists, etc. inside of the div block, but so far I've had limited success with that.

I think that I'm facing a bug or two in showdown (why would it wrap <div> in a paragraph tag?), combined with no knowledge of the actual listener event processing order. The two events I've had the best success with are tables.before and githubCodeBlocks.after, but it's still not right.

Can you please help fill in the blanks from what I've figured out so far so that this just works?

P.S. I know you're working hard on showdown 2.0, and I'm looking forward to it, but I'd love to get a handle on how extensions work in the meantime! I don't need full documentation, just some pointers (listener event processing order?) and maybe a bug fix or two.

Contributor guide