Remove the need to prune raw tags, simplify logic of replacement

src/Page.js

@@ -799,7 +799,6 @@ class Page {
         .then(result => this.insertFooterFile(result))
         .then(result => Page.insertTemporaryStyles(result))
         .then(result => markbinder.resolveBaseUrl(result, fileConfig))
-        .then(result => nunjuckUtils.removeNunjucksEscapes(result))
         .then(result => fs.outputFileAsync(this.tempPath, result))
         .then(() => markbinder.renderFile(this.tempPath, fileConfig))
         .then(result => this.postRender(result))
@@ -1066,7 +1065,6 @@ class Page {
           isDynamic: true,
           dynamicSource: source,
         }))
-        .then(result => nunjuckUtils.removeNunjucksEscapes(result))
         .then(result => fs.outputFileAsync(tempPath, result))
         .then(() => markbinder.renderFile(tempPath, {
           baseUrlMap: this.baseUrlMap,

src/lib/markbind/src/parser.js

@@ -146,10 +146,14 @@ class Parser {
     // Extract page variables from the CHILD file
     const pageVariables
       = this.extractPageVariables(asIfAt, fileContent, userDefinedVariables, includeVariables);
-    const content
-      = nunjuckUtils.renderEscaped(nunjucks, fileContent,
-                                   { ...pageVariables, ...includeVariables, ...userDefinedVariables },
-                                   { path: filePath });
+    const content = nunjuckUtils.renderEscaped(nunjucks,
+                                               fileContent,
+                                               {
+                                                 ...pageVariables,
+                                                 ...includeVariables,
+                                                 ...userDefinedVariables,
+                                               },
+                                               { path: filePath });
     const childContext = _.cloneDeep(context);
     childContext.cwf = asIfAt;
     childContext.variables = includeVariables;

src/lib/markbind/src/utils/nunjuckUtils.js

@@ -1,31 +1,14 @@
 const START_ESCAPE_STR = '{% raw %}';
 const END_ESCAPE_STR = '{% endraw %}';
-const REGEX = new RegExp('{% *raw *%}(.*?){% *endraw *%}', 'gs'); // eslint-disable-line no-useless-escape
-
-function addEscapeTags(match) {
-  return `${START_ESCAPE_STR}${match}${END_ESCAPE_STR}`;
-}
-
-function removeEscapeTags(_, p1) {
-  return p1;
-}
+const REGEX = new RegExp('{% *raw *%}(.*?){% *endraw *%}', 'gs');
 
 function preEscapeRawTags(pageData) {
-  return pageData.replace(REGEX, addEscapeTags);
+  return pageData.replace(REGEX, `${START_ESCAPE_STR}$&${END_ESCAPE_STR}`);
 }
 
 module.exports = {
   renderEscaped(nunjucks, pageData, variableMap = {}, options = {}) {
     const escapedPage = preEscapeRawTags(pageData);
     return nunjucks.renderString(escapedPage, variableMap, options);
   },
-
-  /**
-   * RemoveNunjucksEscapes removes raw tags from page data when processing
-   * Downstream calls to nunjuckUtils.renderEscaped will be essentially the same as nunjucks.renderString
-   * This ensures that we remove {{ and }} from the final output which prevents problem with Vue
-   */
-  removeNunjucksEscapes(pageData) {
-    return pageData.replace(REGEX, removeEscapeTags);
-  },
 };

test/functional/test_site/expected/index.html

@@ -490,11 +490,6 @@ <h1 id="markbind-plugin-pre-render">Markbind Plugin Pre-render<a class="fa fa-an
         </div>
         <h2 class="no-index" id="level-2-header-inside-headingsearchindex-with-no-index-attribute-should-not-be-indexed">Level 2 header (inside headingSearchIndex) with no-index attribute should not be indexed<a class="fa fa-anchor" href="#level-2-header-inside-headingsearchindex-with-no-index-attribute-should-not-be-indexed"></a></h2>
         <h6 class="always-index" id="level-6-header-outside-headingsearchindex-with-always-index-attribute-should-be-indexed">Level 6 header (outside headingSearchIndex) with always-index attribute should be indexed<a class="fa fa-anchor" href="#level-6-header-outside-headingsearchindex-with-always-index-attribute-should-be-indexed"></a></h6>
-        <p><strong>Test NunjuckUtils</strong></p>
-        <div>
-          <p>The standard trick to render braces still works {<span>{ content }</span>}.</p>
-          <p>Nonexistent variables should still be removed: . In the rare event that user wrapped an unknown variable inside a raw tag, it should retain its current behaviour and not be produced to ensure Vue does not break.</p>
-        </div>
         <hr class="footnotes-sep">
         <section class="footnotes">
           <ol class="footnotes-list">

test/functional/test_site/index.md

@@ -285,7 +285,3 @@ tags: ["tag-frontmatter-shown", "tag-included-file", "+tag-exp*", "-tag-exp-hidd
 ## Level 2 header (inside headingSearchIndex) with no-index attribute should not be indexed {.no-index}
 
 ###### Level 6 header (outside headingSearchIndex) with always-index attribute should be indexed {.always-index}
-
-**Test NunjuckUtils**
-
-<include src="testNunjuckUtils.md" />

test/functional/test_site_special_tags/_markbind/plugins/testSpecialTag.js

@@ -2,10 +2,6 @@ const cheerio = module.parent.require('cheerio');
 
 const ESCAPE_REGEX = new RegExp('{% *raw *%}(.*?){% *endraw *%}', 'gs');
 
-function removeEscapeTags(_, p1) {
-  return p1;
-}
-
 /*
  Simple test plugin that whitelists <testtag> as a special tag.
  If encountered, it wraps the text node inside with some indication text as to
@@ -23,20 +19,30 @@ function preRender(content) {
     $(testElement).text(wrappedText);
   });
 
+  return $.html();
+}
+
+/*
+  Tests that special tags like <mustache> which would contain a lot of mustache syntax
+  like {{ }}, we are able to replace them with !success!success success!success!
+  without interference from other dependencies
+*/
+function postRender(content) {
+  const $ = cheerio.load(content);
   const escapedNunjucks = $('mustache');
   escapedNunjucks.each((index, element) => {
     const unwrappedText = $(element).text();
-    const unescapedText = unwrappedText.replace(ESCAPE_REGEX, removeEscapeTags);
+    const unescapedText = unwrappedText.replace(ESCAPE_REGEX, 'raw$1endraw');
     const transformedText = unescapedText.replace(/{/g, '!success').replace(/}/g, 'success!');
     $(element).text(transformedText);
   });
 
-
   return $.html();
 }
 
 
 module.exports = {
   preRender,
+  postRender,
   getSpecialTags: () => ['testtag', 'mustache'],
 };

test/functional/test_site_special_tags/expected/index.html

@@ -24,7 +24,7 @@
       <div id="content-wrapper">
         <h1 id="functional-test-for-htmlparser2-and-markdown-it-patches-for-special-tags">Functional test for htmlparser2 and markdown-it patches for special tags<a class="fa fa-anchor" href="#functional-test-for-htmlparser2-and-markdown-it-patches-for-special-tags"></a></h1>
         <h2 id="so-far-as-to-comply-with-the-commonmark-spec">So far as to comply with the commonmark spec<a class="fa fa-anchor" href="#so-far-as-to-comply-with-the-commonmark-spec"></a></h2>
-        <p>There should be no text between this and the next <code>&lt;hr&gt;</code> tag in the browser, since it is a <code>&lt;script&gt;</code> tag.<br> There should be an alert with the value of 2 as well.</p>
+        <p>There should be no text between this and the next <code>&lt;hr&gt;</code> tag in the browser, since it is a <code>&lt;script&gt;</code> tag.<br> There should be an alert with the value of 2 as well.<br></p>
         <script>
           let x = 1;
 
@@ -43,12 +43,12 @@ <h2 id="so-far-as-to-comply-with-the-commonmark-spec">So far as to comply with t
           expected output)
         </p>
         <mustache>
-
+raw
 
 !success!success This should be enclosed in success string success!success!
 
 !success This should also be enclosed in success strings success!success!success!
-
+endraw
 </mustache>
         <testtag>!success
 
@@ -80,7 +80,7 @@ <h2 id="so-far-as-to-comply-with-the-commonmark-spec">So far as to comply with t
         <hr>
         <p>This should pass the htmlparser2 patch but not the markdown-it patch as it violates commonmark.<br> All lines after the first <code>!success</code> wrapping text will be wrapped in a <code>&lt;p&gt;...&lt;/p&gt;</code> tag as it is parsed as a
           markdown paragraph.
-        </p>
+          <br></p>
         <div>
           <testtag>!success
 <p>let x = 2;</p>

test/unit/nunjuckUtils.test.js

@@ -27,10 +27,3 @@ test('Escaping nested nunjucks raw tags', () => {
   const escapedContent = nunjuckUtils.renderEscaped(nunjucks, escapedString);
   expect(escapedContent).toBe(escapedString);
 });
-
-test('Removing Nunjucks Raw Tags', () => {
-  const escapedString = 'This is a content with escaped data {%raw%} CONTENT {%endraw%}';
-  const removedEscapedString = nunjuckUtils.removeNunjucksEscapes(escapedString);
-  const expectedRemove = 'This is a content with escaped data  CONTENT ';
-  expect(removedEscapedString).toBe(expectedRemove);
-});