snarkdown icon indicating copy to clipboard operation
snarkdown copied to clipboard

Text is not wrapped in paragraphs

Open Andarist opened this issue 5 years ago • 5 comments

https://babelmark.github.io/?text=Test

Andarist avatar Sep 03 '19 13:09 Andarist

https://github.com/developit/snarkdown/pull/13

bastienrobert avatar Sep 10 '19 18:09 bastienrobert

Workaround:

const snarkdownEnhanced = (md: string) => {
    const htmls = md
        .split(/(?:\r?\n){2,}/)
        .map(l =>
            [' ', '\t', '#', '-', '*'].some(ch => l.startsWith(ch))
                ? snarkdown(l)
                : `<p>${snarkdown(l)}</p>`,
        )

    return htmls.join('\n\n')
}

Note that it will fail for fenced code blocks and probably other edge cases.

lionel-rowe avatar Jun 16 '20 18:06 lionel-rowe

https://github.com/developit/snarkdown/issues/11

robsonsobral avatar Jun 24 '20 00:06 robsonsobral

Workaround:

const snarkdownEnhanced = (md: string) => {
    const htmls = md
        .split(/(?:\r?\n){2,}/)
        .map(l =>
            [' ', '\t', '#', '-', '*'].some(ch => l.startsWith(ch))
                ? snarkdown(l)
                : `<p>${snarkdown(l)}</p>`,
        )

    return htmls.join('\n\n')
}

Note that it will fail for fenced code blocks and probably other edge cases.

This was what I needed. Appreciate it.

I understand that the scope of snarkdown is minimal, but personally I just can't imagine ever using a markdown file to make something only one line long. imo Enhanced should be default. But what do I know.

Thanks everyone.

6vx avatar Sep 17 '20 21:09 6vx

Heres a patch (still a bit of a hack) that I put together to wrap all loose text in <p>s. Unlike the solution above, it seems to work fine with fenced code blocks.

export default function(md) {
	// Run snarkdown
	let out = parse(md);

	// Add opening <p>
	if (!out.trim().startsWith('<')) {
		out = `<p>${out}`;
	}

	out = out
		// Replace e.g. "</h5>The..." with "</h5><p>The..."
		.replace(/(<(\/(h(\d))|em|strong|s|div|pre)>)([\s\r\n]){0,}([\w\d])/g, match => {
			const chars = [
				match.slice(0, match.length - 1),
				match.slice(match.length - 1)
			];
			return `${chars[0]}<p>${chars[1]}`
		})

		// Replace <br> with </p><p>
		.replace(/<br \/>/g, '</p><p>')

		// Ensure paragraphs before h-tags end with </p>
		.replace(/([\w\d.:;])([\r\n]){1,}(<((h(\d))|em|strong|s|div|pre)>)/g, (match, paraChars, space, followingEl) => {
			return `${paraChars || ''}</p>${space || ''}${followingEl || ''}`
		})

		// Div fix
		.replace(/<\/p><p><div/g, '</p><div')
		.replace(/<\/div><\/p>/g, '</div>')

		// Strong, em fix
		.replace(/<strong><p>/g, '<strong>')
		.replace(/<em><p>/g, '<em>')

		// Pre fix
		.replace(/<p><pre/g, '<pre')
		.replace(/<\/pre><\/p>/g, '</pre>')

		// Ul fix
		.replace(/<p><ul/g, '<ul')
		.replace(/<\/ul><\/p>/g, '</ul>')

		// Ol fix
		.replace(/<p><ol/g, '<ol')
		.replace(/<\/ol><\/p>/g, '</ol>')

	// Add closing </p>
	if (!out.trim().endsWith('>')) {
		out = `${out}</p>`;
	}

	return out;
}

kohloth avatar Jan 30 '22 17:01 kohloth