question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Best way to override renderer rules?

See original GitHub issue

I’m working on something where users can use markdown. I’d like for all of the links to open in a new window. The following code works, but is this the best way to achieve this?

var md = new markdownit("default", {
    breaks: true, linkify: true, typographer: true
});
//Override link render to open all link in a new window
md.renderer.rules.link_open = (tokens, idx) => {
    var title = tokens[idx].title ? (' title="' + md.utils.escapeHtml(md.utils.replaceEntities(tokens[idx].title)) + '"') : '';
    return '<a href="' + md.utils.escapeHtml(tokens[idx].href) + '"' + title + ' target="_blank">';
};

I also want to allow fenced code to have a simpler syntax where you don’t need to have the triple backticks on their own lines. Input example would be:

```for (var i = 0; i <= items.length; i++) {
  console.log(i);
}```

How can I achieve this? Right now I’ve got a hacky partial solution where it treats the language parameter as the first line of code, but the last line isn’t seen.

//allow simpler fenced code
md.renderer.rules.fence = (tokens, idx, options) => {
    var token = tokens[idx];
    console.log(token)
    return '<pre>'
        + md.utils.escapeHtml(token.params+"\n" +token.content)
        + '</pre>\n';
};

I know this isn’t a good solution, and it seems like md.renderer.rules.fence isn’t the right place to do this sort of thing. How can I achieve this?

Issue Analytics

  • State:closed
  • Created 9 years ago
  • Comments:17 (12 by maintainers)

github_iconTop GitHub Comments

2reactions
puzrincommented, Mar 20, 2015

That’s full logic, can be reduced:

val old_render = md.renderer.rules.link_open || function(tokens, idx, options, env, self) {
  return self.renderToken(tokens, idx, options);
};

md.renderer.rules.link_open = (tokens, idx, options, env, self) => {
  token[idx].attrPush(['target', '_blank']);

  return old_render(tokens, idx, options, env, self);
};

Or patch attributes in core chain:

https://github.com/markdown-it/markdown-it-for-inline#use (example 3)

0reactions
caubcommented, Jan 12, 2018

Yes thanks, I’ve seen that link 5 messages up, I’ll look in the code too

Read more comments on GitHub >

github_iconTop Results From Across the Web

Overriding a renderer - MoodleDocs
This document explains renderers and how to override a renderer within a theme in order to achieve a unique look. It assumes you...
Read more >
Overriding renderers - Public developer documentation
The overwritten renderer should be placed in theme/<themename>/renderer.php and inherit from the previous class in the theme chain, using ...
Read more >
php - How to override a renderer such that the functionality of ...
1. Face your Fear! your on the right path! · 1. code.tutsplus.com/tutorials/… – solidau · @Juventus18 Thank you very much. I just went...
Read more >
Solved: How to use a Renderer to override the symbology co...
//To create a widget, you need to derive from BaseWidget. ... var symbol = new esri.symbol.SimpleFillSymbol().setColor(new esri.Color([255,0,0,0.5] ...
Read more >
Tokenizer - Marked Documentation
All options will overwrite those previously set, except for the following options which ... Marked provides methods for directly overriding the renderer and ......
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found