Merge pull request #744 from kethinov/1.1.0

1.1.0

Author: kethinov

CHANGELOG.md

@@ -4,6 +4,13 @@
 
 - Put your changes here...
 
+## 1.1.0
+
+- Added `<escape>` tag.
+- Excluded `<pre>` tags from Teddy parsing. Add a `parse` attribute to prevent this behavior.
+- Fixed a bug that could cause infinite loops in variable parsing.
+- Updated dependencies.
+
 ## 1.0.1
 
 - Fixed a bug that caused client-side Teddy to try to fetch resources from the server inappropriately while parsing the template.

README.md

@@ -91,7 +91,7 @@ Display a variable by simply writing `{varName}` anywhere in the template. You c
 
 All variable names are case-insensitive, both in `{varName}` form and when referenced in Teddy tags described below. This is to comply with the rules of HTML grammar which mandate that HTML tags and attributes be case insensitive.
 
-HTML entities such as `<`, `>`, `&`, `'`, and `"` will be escaped by default as a safeguard against [cross-site scripting](https://en.wikipedia.org/wiki/Cross-site_scripting).
+HTML entities such as `<`, `>`, `&`, `'`, and `"` will be escaped by default as a safeguard against [cross-site scripting](https://en.wikipedia.org/wiki/Cross-site_scripting). If you want to deliberately escape some text or some HTML, then wrap it in an `<escape>` tag like this: `<escape><p>hello</p></escape>` which will output: `&lt;p&gt;hello&lt;/p&gt;`.
 
 If you need to suppress this escaping in certain scenarios, write your variable like this: `{varName|s}`.
 
@@ -393,7 +393,7 @@ You can also instruct the contents of a variable to not be parsed after that var
 <p>{this_var_will_be_parsed_but_its_contents_will_not_be|p}</p>
 ```
 
-Note: Teddy tags will also not be parsed if they appear inside of elements that interpret child text as plain text, e.g. `<style>`, `<script>`, `<textarea>`, etc.
+Note: Teddy tags will also not be parsed if they appear inside of elements that interpret child text as plain text, e.g. `<style>`, `<script>`, `<textarea>`, etc. Teddy will also not parse anything in a `<pre>` tag unless you add a `parse` attribute to the `<pre>` tag like `<pre parse>`.
 
 Caching blocks
 ---

cheerioPolyfill.js

@@ -30,6 +30,11 @@ export function load (html) {
         return getTeddyDOMInnerHTML(el)
       },
 
+      // e.g. dom(arg).toString() from teddy
+      toString: function () {
+        return getTeddyDOMOuterHTML(el)
+      },
+
       // e.g. dom(el).attr('teddydeferreddynamicinclude', 'true') from teddy
       attr: function (attr, val) {
         return el.setAttribute(attr, val)
@@ -68,6 +73,11 @@ export function load (html) {
     return getTeddyDOMInnerHTML(doc)
   }
 
+  // e.g. dom.toString() from teddy
+  $.toString = function () {
+    return getTeddyDOMOuterHTML(doc)
+  }
+
   return $
 }
 
@@ -191,18 +201,17 @@ function parseTeddyDOMFromString (html) {
   return root
 }
 
-// custom function to get inner HTML without escaping various things to prevent teddy from infinitely escaping them
+// custom functions to get inner/outer HTML without escaping various things to prevent teddy from infinitely escaping them
+const doublyEncodedEntities = {
+  '&': '&',
+  '<': '<',
+  '>': '>',
+  '"': '"',
+  ''': ''',
+  '/': '/'
+}
+const entityEntries = Object.entries(doublyEncodedEntities)
 function getTeddyDOMInnerHTML (node) {
-  const doublyEncodedEntities = {
-    '&': '&',
-    '<': '<',
-    '>': '>',
-    '"': '"',
-    ''': ''',
-    '/': '/'
-  }
-  const entityEntries = Object.entries(doublyEncodedEntities)
-
   // build html string
   let html = ''
   for (const child of node.childNodes) {
@@ -223,3 +232,20 @@ function getTeddyDOMInnerHTML (node) {
 
   return html
 }
+function getTeddyDOMOuterHTML (node) {
+  // start with the outerHTML of the node
+  let outerHTML = ''
+
+  if (node.nodeType === window.Node.ELEMENT_NODE) {
+    outerHTML = node.outerHTML
+  } else if (node.nodeType === window.Node.TEXT_NODE) {
+    outerHTML = node.textContent
+  } else if (node.nodeType === window.Node.COMMENT_NODE) {
+    outerHTML = `<!--${node.textContent}-->`
+  }
+
+  // replace doubly encoded entities
+  for (const [doublyEncoded, singleEncoded] of entityEntries) outerHTML = outerHTML.replace(new RegExp(doublyEncoded, 'g'), singleEncoded)
+
+  return outerHTML
+}