Converting new lines to paragraph/br HTML tags, can this be a single regex?

Question

An app I am working on has the user enter content in plaintext that will later be displayed as HTML. To make the user's content display as nicely as possible, we transform the content as follows:

• Any blocks of text delimited by two or more new line characters are wrapped in <p> tags. The new line characters (and any whitespace in-between) are stripped out.

• Any single new line characters (along with surrounding whitespace) are replaced by a <br /> tag.

I'm currently achieving this by putting the the text through two regex replacements but was wondering if it could possibly be consolidated to one. Here's what I have right now (JavaScript):

// content holds the text to process
content = '<p>' + content.replace(/\n([ \t]*\n)+/g, '</p><p>')
                 .replace(/\n/g, '<br />') + '</p>';

Answer 1

There are two different replacement strings. So it's impossible to make it in single replace call.

But second replace() can be changed to more effective plain string substitution.

content = '<p>' + content.replace(/\n([ \t]*\n)+/g, '</p><p>')
                 .replace('\n', '<br />') + '</p>';

So, there's single regexp. :)

Update

Javascript bluffed me. String replace handles only first occurrence.

So you'll have to either use modern replaceAll function

or fall back to second regexp

                 .replace(/\n/g, '<br />') + '</p>';

or to use String replaceAll polyfill for legacy browsers.

Answer 2

I was facing a similar requirement - to mimic the wpautop functionality into javascript (for use in the theme customizer).

So here is my approach to the problem:

First, replace the case when there are two line breaks.

to = to.replace(/\n{2}/g, '&nbsp;</p><p>');

Then, replace the case when there are only one line breaks left.

to = to.replace(/\n/g, '&nbsp;<br />');

And lastly wrap the whole content in a <p> tag

to = '<p>' + to + '</p>';

I used the &nbsp; because my styling implied margin after the paragraph. You can omit them if you don't need them. Also, one drawback is that the single line breaks are inserted in the beginning of the next paragraph, but this is something I can live with that.