Indentation prevents processing

[tedw]

Just noticed that if the {% markdown %} block is indented and its contents are indented, it isn't processed and is output as a <pre> tag.

{% markdown %}
# YES
{% endmarkdown %}

{% markdown %}
  # YES
{% endmarkdown %}

  {% markdown %}
  # YES
  {% endmarkdown %}

  {% markdown %}
    # NO
  {% endmarkdown %}

Not the end of the world, but had me confused for a while.

[zephraph]

Interesting. I'm working on a re-write that should solve this issue (and allow other tags inside the body).

[zephraph]

Hey @tedw, sorry it took me so long to get back to you.

I'll try to write a test for this tonight, but I'm pretty sure it should work now. I've bumped the version with new parsing. Give it a try.

[tedw]

Hmm, still not working for me, but might be because I'm using 'gulp-nunjucks-render' instead of 'nunjucks'. Either way, this isn't that big of a deal.

[zephraph]

Does your task look something like this?

var gulp = require('gulp');
var nunjucksRender = require('gulp-nunjucks-render');
var markdown = require('nunjucks-markdown');

gulp.task('default', function () {
    var env = nunjucksRender.nunjucks.configure(['src/templates/']);
    markdown.register(env);

    return gulp.src('src/templates/*.html')
        .pipe(nunjucksRender())
        .pipe(gulp.dest('dist'));
});

[tedw]

Here's my full gulp task:

// Render Nunjucks templates with inline Markdown support
var fs = require('fs');
var gulp = require('gulp');
var jsoncombine = require("gulp-jsoncombine");
var markdown = require('nunjucks-markdown');
var marked = require('marked');
var nunjucksDate = require('nunjucks-date');
var nunjucksRender = require('gulp-nunjucks-render');
var prettify = require('gulp-prettify');
var prettifySettings = require('../config').prettify;
var config = require('../config').nunjucks
var handleErrors = require('../util/handleErrors');

var env = nunjucksRender.nunjucks.configure([ config.base ]);

// Set default date format. Any valid format works.
// http://momentjs.com/docs/#/displaying/format/
nunjucksDate.setDefaultFormat('MMM Do YYYY');

// Add custom date filter to Nunjucks
nunjucksDate.install(env);

// Create a new custom markdown renderer using marked
// https://github.com/chjj/marked
var renderer = new marked.Renderer();

// Don't add IDs to header elements
renderer.heading = function (text, level) {
  return '<h' + level + '>' + text + '</h' + level + '>';
};

// Add markdown processing to Nunjucks renderer
// See marked repo for options
marked.setOptions({
  renderer: renderer,
  // headerPrefix: 'md-',
  // gfm: true,
  // tables: true,
  // breaks: false,
  // pendantic: false,
  // sanitize: true,
  // smartLists: true,
  smartypants: false
});

markdown.register(env, marked);

// Render all nunjucks templates
gulp.task('nunjucks', function( initiator ) {
  return gulp.src( config.src, {base: config.base} )
    // Import compiled JSON data file
    .pipe( nunjucksRender( JSON.parse(fs.readFileSync(config.data, 'utf8'))))
    .on('error', handleErrors)
    .pipe( prettify( prettifySettings ))// Clean markup
    .pipe( gulp.dest( config.dest ));
});

Again, this is a very minor issue. Probably not worth spending too much time on.

[zephraph]

So this is still breaking? I thought I tested this... I'll take a look at it.

[tedw]

Yeah, it's still turning into a <pre> tag when indented inside of the markdown tag. I'm using a soft tab of two spaces fwiw.

[zephraph]

Happy to say that this is fixed in the 1.1.0 release, thanks to @internalfx.

[heyfarai]

Peace,

I'm using 1.1.0 and I'm seeing a similar issue with indentation.

I've attached 2 images showing code and the render, you'll notice that the "Hell" in "Hello World" gets chopped because of indentation.

[internalfx]

@mr-farai That's how it's designed to work.

the indentation depth of {% markdown %} is zero.

Where everything else is in relation to that, changes how it's rendered.

Probably should have a floor of zero though.

I'm guessing we are getting a negative number because you are actually "nagatively" indented relative to the markdown tag.

[internalfx]

Basically...

Correct

{% markdown %}
Hello World
=========
# Do stuff
{% endmarkdown %}

Correct

    {% markdown %}
    Hello World
    =========
    # Do stuff
    {% endmarkdown %}

Bad

    {% markdown %}
Hello World
=========
# Do stuff
{% endmarkdown %}

Bad

    {% markdown %}
Hello World
=========
# Do stuff
    {% endmarkdown %}

[heyfarai]

Awesomes @internalfx,

Thanks for the clarification.

Peace

On 06 Jan 2016, at 10:45 PM, Internalfx notifications@github.com wrote:

Basically...

Correct

{% markdown %}

Hello World

Do stuff

{% endmarkdown %} Correct

{% markdown %}
Hello World
=========
# Do stuff
{% endmarkdown %}

Bad

{% markdown %}

Hello World

Do stuff

{% endmarkdown %} Bad

{% markdown %}

Hello World

Do stuff

{% endmarkdown %}

— Reply to this email directly or view it on GitHub.

[zephraph]

Are any actions necessary?

[internalfx]

@zephraph There is a bug, not sure how severe I would classify it....

If the tab depth of the content is less than the tab depth of the {% markdown %} tag, it appears to chop the text.

[internalfx]

I'll take a look at the code later tonight.

[zephraph]

Cool. Well, you've done a lot for this project so far, so I added you as a collaborator.

[kevinmpowell]

I'm still seeing this issue, though it's slightly different than the OP's. Here's what my results are:

{% markdown %}
# YES
{% endmarkdown %}

{% markdown %}
  # NO
{% endmarkdown %}

  {% markdown %}
  # YES
  {% endmarkdown %}

  {% markdown %}
    # NO
  {% endmarkdown %}

Basically if the content within the {% markdown %} tags is indented, regardless of where the {% markdown %} tags are I see everything within rendered as a <pre><code> block.

I'm using grunt-nunjucks-2-html to compile my nunjucks files.

[internalfx]

@kevinmpowell

Indenting markdown does cause it to render as a pre so isn't this behavior expected?

[tedw]

@internalfx Ah, right, totally wasn’t thinking about that. I guess this is working as expected then. 👍