Some fixes (#81)

* Some fixes

- urllib.quote_plus the url attributes
- Match link domain more precisely.
- Image height or width can be individually specified

* 0.17.0 -> 0.18.0

* Fix tests

* urllib.quote_plus -> html.escape

* Minor

* Escape doc

* escape land

* Escape recursively

* Review changes

CHANGELOG.rst

@@ -2,6 +2,12 @@
 History
 =======
 
+0.18.0 (2024-02-09)
+-------------------
+- html.escape all the attributes
+- Match link domain more precisely.
+- Image height or width can be individually specified
+
 0.16.0 (2023-03-14)
 -------------------
 * Support for new tiptap versions that uses camelCase over snake_case

setup.cfg

@@ -1,5 +1,5 @@
 [bumpversion]
-current_version = 0.17.0
+current_version = 0.18.0
 commit = True
 tag = True
 

setup.py

@@ -1,10 +1,8 @@
-
-from setuptools import setup, find_packages
-
+from setuptools import find_packages, setup
 
 setup(
     name="tiptapy",
-    version='0.17.0',  # TODO: why bumpversion works only for single quotes?
+    version="0.18.0",  # TODO: why bumpversion works only for single quotes?
     url="https://github.com/scrolltech/tiptapy",
     description="Library that generates HTML output from JSON export of tiptap editor",
     long_description=open("README.md").read(),
@@ -13,7 +11,13 @@
     author="Shekhar Tiwatne",
     author_email="[email protected]",
     license="http://www.opensource.org/licenses/mit-license.php",
-    package_data={"tiptapy": ["templates/*.html", "templates/extras/*.html", "templates/marks/*.html"]},
+    package_data={
+        "tiptapy": [
+            "templates/*.html",
+            "templates/extras/*.html",
+            "templates/marks/*.html",
+        ]
+    },
     classifiers=[
         "Programming Language :: Python :: 3",
         "License :: OSI Approved :: MIT License",

tests/data/html/audio-is_renderable.html

@@ -1 +1 @@
-<p>Quick brown fox jumps over the lazy dog. </p>
+<p>Quick brown fox jumps over the lazy dog. </p>

tests/data/html/code_block-is_renderable.html

@@ -1 +1 @@
-<p>Quick brown fox jumps over the lazy dog. </p>
+<p>Quick brown fox jumps over the lazy dog. </p>

tests/data/html/code_block.html

@@ -40,4 +40,4 @@
 num1 = 54
 num2 = 24
 
-print(&quot;The L.C.M. is&quot;, compute_lcm(num1, num2))</code></pre></div><blockquote><p>Readability counts.</p><p><a href="https://en.wikipedia.org/wiki/Zen_of_Python" target="_blank" rel="noopener nofollow">Zen of Python</a> By <strong>Tom Peters</strong></p></blockquote>
+print(&quot;The L.C.M. is&quot;, compute_lcm(num1, num2))</code></pre></div><blockquote><p>Readability counts.</p><p><a href="https://en.wikipedia.org/wiki/Zen_of_Python" target="_blank" rel="noopener nofollow">Zen of Python</a> By <strong>Tom Peters</strong></p></blockquote>

tests/data/html/data_attributes.html

@@ -1 +1 @@
-<div data-show-gap="true" data-type="imageStrip"><figure><picture><source srcset="https://placekitten.com/200/301" type="image"/><source srcset="https://placekitten.com/200/301" type="image"/><img src="https://placekitten.com/200/301" alt="Sleepy Kitten"width="300" height="400"/></picture><figcaption>Cute Kitty</figcaption></figure><figure><picture><source srcset="https://placekitten.com/200/301" type="image"/><source srcset="https://placekitten.com/200/301" type="image"/><img src="https://placekitten.com/200/301" alt="Happy Kitten"width="300" height="400"/></picture><figcaption>New Kitty</figcaption></figure></div>
+<div data-show-gap="true" data-type="imageStrip"><figure><picture><source srcset="https://placekitten.com/200/301" type="image"/><source srcset="https://placekitten.com/200/301" type="image"/><img src="https://placekitten.com/200/301" alt="Sleepy Kitten" width="300" height="400"/></picture><figcaption>Cute Kitty</figcaption></figure><figure><picture><source srcset="https://placekitten.com/200/301" type="image"/><source srcset="https://placekitten.com/200/301" type="image"/><img src="https://placekitten.com/200/301" alt="Happy Kitten" width="300" height="400"/></picture><figcaption>New Kitty</figcaption></figure></div>

tests/data/html/document-is_renderable.html

@@ -1 +1 @@
-<p>Quick brown fox jumps over the lazy dog. </p>
+<p>Quick brown fox jumps over the lazy dog. </p>

tests/data/html/document-pdf.html

@@ -16,4 +16,4 @@
       <li class="download-cta"><a href="http://www.africau.edu/images/default/sample.pdf" target="_blank" rel="noopener noreferrer" download>Download</a></li>
    </ul>
 </div>
-<figcaption>This is pdf caption.</figcaption></figure><p>Document Test</p>
+<figcaption>This is pdf caption.</figcaption></figure><p>Document Test</p>

tests/data/html/document-sketch.html

@@ -16,4 +16,4 @@
       <li class="download-cta"><a href="http://www.africau.edu/images/default/sample.sketch" target="_blank" rel="noopener noreferrer" download>Download</a></li>
    </ul>
 </div>
-<figcaption>Above URL may result into 404 :)</figcaption></figure><p>Document Test</p>
+<figcaption>Above URL may result into 404 :)</figcaption></figure><p>Document Test</p>

tests/data/html/featuredimage-height_width.html

@@ -1 +1 @@
-<figure class="featured-image"><picture><source srcset="https://placekitten.com/200/301" type="image"/><source srcset="https://placekitten.com/200/301" type="image"/><img src="https://placekitten.com/200/301" alt="Sleepy Kitten"width="300" height="400"/></picture><figcaption>Cute Kitty</figcaption></figure>
+<figure class="featured-image"><picture><source srcset="https://placekitten.com/200/301" type="image"/><source srcset="https://placekitten.com/200/301" type="image"/><img src="https://placekitten.com/200/301" alt="Sleepy Kitten" width="300" height="400"/></picture><figcaption>Cute Kitty</figcaption></figure>

tests/data/html/featuredimage-is_renderable.html

@@ -1 +1 @@
-<p>Quick brown fox jumps over the lazy dog. </p>
+<p>Quick brown fox jumps over the lazy dog. </p>

tests/data/html/featuredimage-mime_type.html

@@ -1 +1 @@
-<figure class="featured-image"><picture><source srcset="https://www.python.org/python-logo.webp" type="image/webp"/><source srcset="https://www.python.org/python-logo.png" type="image/png"/><img src="https://www.python.org/python-logo.png" alt="python"/></picture></figure>
+<figure class="featured-image"><picture><source srcset="https://www.python.org/python-logo.webp" type="image/webp"/><source srcset="https://www.python.org/python-logo.png" type="image/png"/><img src="https://www.python.org/python-logo.png" alt="python"/></picture></figure>

tests/data/html/featuredimage-missing_caption.html

@@ -1 +1 @@
-<figure class="featured-image"><picture><source srcset="https://placekitten.com/200/301" type="image"/><source srcset="https://placekitten.com/198/654" type="image"/><img src="https://placekitten.com/198/654" alt="Brown Kitten Image"/></picture></figure>
+<figure class="featured-image"><picture><source srcset="https://placekitten.com/200/301" type="image"/><source srcset="https://placekitten.com/198/654" type="image"/><img src="https://placekitten.com/198/654" alt="Brown Kitten Image"/></picture></figure>

tests/data/html/featuredimage-no_caption.html

@@ -1 +1 @@
-<figure class="featured-image"><picture><source srcset="https://placekitten.com/200/301" type="image"/><source srcset="https://placekitten.com/198/654" type="image"/><img src="https://placekitten.com/198/654" alt="Brown Kitten Image"/></picture></figure>
+<figure class="featured-image"><picture><source srcset="https://placekitten.com/200/301" type="image"/><source srcset="https://placekitten.com/198/654" type="image"/><img src="https://placekitten.com/198/654" alt="Brown Kitten Image"/></picture></figure>

tests/data/html/featuredimage.html

@@ -1 +1 @@
-<figure class="featured-image"><picture><source srcset="https://placekitten.com/200/301" type="image"/><source srcset="https://placekitten.com/198/654" type="image"/><img src="https://placekitten.com/198/654" alt="Brown Kitten Image"/></picture><figcaption>Cute Kitty</figcaption></figure>
+<figure class="featured-image"><picture><source srcset="https://placekitten.com/200/301" type="image"/><source srcset="https://placekitten.com/198/654" type="image"/><img src="https://placekitten.com/198/654" alt="Brown Kitten Image"/></picture><figcaption>Cute Kitty</figcaption></figure>

tests/data/html/heading.html

@@ -1 +1 @@
-<h2><strong>This</strong> is a <br><em>word</em></h2>
+<h2><strong>This</strong> is a <br><em>word</em></h2>

tests/data/html/image-height_width.html

@@ -1 +1 @@
-<figure><picture><source srcset="https://placekitten.com/200/301" type="image"/><source srcset="https://placekitten.com/200/301" type="image"/><img src="https://placekitten.com/200/301" alt="Sleepy Kitten"width="300" height="400"/></picture><figcaption>Cute Kitty</figcaption></figure>
+<figure><picture><source srcset="https://placekitten.com/200/301" type="image"/><source srcset="https://placekitten.com/200/301" type="image"/><img src="https://placekitten.com/200/301" alt="Sleepy Kitten" width="300" height="400"/></picture><figcaption>Cute Kitty</figcaption></figure>

tests/data/html/image-is_renderable.html

@@ -1 +1 @@
-<p>Quick brown fox jumps over the lazy dog. </p>
+<p>Quick brown fox jumps over the lazy dog. </p>

tests/data/html/image-mime_type.html

@@ -1 +1 @@
-<figure><picture><source srcset="https://www.python.org/python-logo.webp" type="image/webp"/><source srcset="https://www.python.org/python-logo.png" type="image/png"/><img src="https://www.python.org/python-logo.png" alt="python"/></picture></figure>
+<figure><picture><source srcset="https://www.python.org/python-logo.webp" type="image/webp"/><source srcset="https://www.python.org/python-logo.png" type="image/png"/><img src="https://www.python.org/python-logo.png" alt="python"/></picture></figure>

tests/data/html/image-missing_caption.html

@@ -1 +1 @@
-<figure><picture><source srcset="https://placekitten.com/200/301" type="image"/><source srcset="https://placekitten.com/198/654" type="image"/><img src="https://placekitten.com/198/654" alt="Sleepy Kitten"/></picture></figure>
+<figure><picture><source srcset="https://placekitten.com/200/301" type="image"/><source srcset="https://placekitten.com/198/654" type="image"/><img src="https://placekitten.com/198/654" alt="Sleepy Kitten"/></picture></figure>

tests/data/html/image-no_caption.html

@@ -1 +1 @@
-<figure><picture><source srcset="https://placekitten.com/200/301" type="image"/><source srcset="https://placekitten.com/198/654" type="image"/><img src="https://placekitten.com/198/654" alt="Sleepy Kitten"/></picture></figure>
+<figure><picture><source srcset="https://placekitten.com/200/301" type="image"/><source srcset="https://placekitten.com/198/654" type="image"/><img src="https://placekitten.com/198/654" alt="Sleepy Kitten"/></picture></figure>

tests/data/html/image.html

@@ -1 +1 @@
-<figure><picture><source srcset="https://placekitten.com/200/301" type="image"/><source srcset="https://placekitten.com/198/654" type="image"/><img src="https://placekitten.com/198/654" alt="Sleepy Kitten"/></picture><figcaption>&lt;script&gt;alert(23)&lt;/script&gt;Cute Kitty</figcaption></figure>
+<figure><picture><source srcset="https://placekitten.com/200/301?text=&quot;escape me&quot;" type="image"/><source srcset="https://placekitten.com/198/654" type="image"/><img src="https://placekitten.com/198/654" alt="Sleepy Kitten"/></picture><figcaption>&lt;script&gt;alert(23)&lt;/script&gt;Cute Kitty</figcaption></figure>

tests/data/html/ordered_list.html

@@ -1 +1 @@
-<h1>Scroll</h1><ol start="1"><li><p>One</p></li><li><p>Two</p></li><li><p>Three</p></li></ol><ol start="2"><li><p>One</p></li><li><p>Two</p></li><li><p>Three</p></li></ol>
+<h1>Scroll</h1><ol start="1"><li><p>One</p></li><li><p>Two</p></li><li><p>Three</p></li></ol><ol start="2"><li><p>One</p></li><li><p>Two</p></li><li><p>Three</p></li></ol>

tests/data/json/image.json

@@ -4,10 +4,13 @@
     {
       "type": "image",
       "attrs": {
-        "src": { "image": "https://placekitten.com/200/301", "fallback": "https://placekitten.com/198/654" },
+        "src": {
+          "image": "https://placekitten.com/200/301?text=\"escape me\"",
+          "fallback": "https://placekitten.com/198/654"
+        },
         "alt": "Sleepy Kitten",
         "caption": "<script>alert(23)</script>Cute Kitty"
       }
     }
-   ]
+  ]
 }

tests/test_transform.py

@@ -1,7 +1,8 @@
 import os
+
 import pytest
-import tiptapy
 
+import tiptapy
 
 tags_to_test = (
     "simple",
@@ -41,30 +42,39 @@
     "document-is_renderable",
     "document-sketch",
     "camel-case",
-    "data_attributes"
+    "data_attributes",
 )
 
 
 class config:
     """
     Config class to store constans which are used by the othe nodes.
     """
+
     DOMAIN = "python.org"
 
 
-def build_test_data():
+def build_test_data(rebuild_html=False):
     """
     Scan data directories and return test data
+
+    :param rebuild_html: If True, rebuild the html files
     """
-    store = {'json': {}, 'html': {}}
+    store = {"json": {}, "html": {}}
     for data_type in store:
-        dir_path = os.path.abspath(f'tests/data/{data_type}/')
+        dir_path = os.path.abspath(f"tests/data/{data_type}/")
         for file in os.listdir(dir_path):
             file_path = os.path.join(dir_path, file)
             with open(file_path) as f:
                 data = f.read()
-                store[data_type][file.split(f'.{data_type}')[0]] = data
-    return store['json'], store['html']
+                store[data_type][file.split(f".{data_type}")[0]] = data
+
+            # Use this to (re)generate the html files
+            if rebuild_html and data_type == "json":
+                with open(file_path.replace("json", "html"), "w") as f:
+                    f.write(tiptapy.BaseDoc(config).render(data))
+
+    return store["json"], store["html"]
 
 
 json_data, html_data = build_test_data()

tiptapy/__init__.py

@@ -1,31 +1,35 @@
+import json
 import os
 import sys
-import json
 from html import escape
-from jinja2 import FileSystemLoader, Environment, select_autoescape
 from typing import Dict
-from .image import url2mime
-from .macros import (make_img_src, build_link_handler,
-                     get_audio_player_block, get_doc_block)
 
+from jinja2 import Environment, FileSystemLoader, select_autoescape
+
+from .image import url2mime
+from .macros import (
+    build_link_handler,
+    get_audio_player_block,
+    get_doc_block,
+    make_img_src,
+)
 
-__version__ = '0.17.0'
+__version__ = "0.18.0"
 
 renderers: Dict = {}
 
 
 def init_env(path, config):
-    env = Environment(loader=FileSystemLoader(path),
-                      autoescape=select_autoescape(
-                          enabled_extensions=('html')))
+    env = Environment(
+        loader=FileSystemLoader(path),
+        autoescape=select_autoescape(enabled_extensions=("html")),
+    )
     # https://stackoverflow.com/a/6038550
-    env.globals['url2mime'] = url2mime
-    env.globals['make_img_src'] = make_img_src
-    env.globals['handle_links'] = build_link_handler(config)
-    # Cause jinja2 `e` filter is not exactly same as html.escape
-    env.globals['escape'] = escape
-    env.globals['get_audio_player_block'] = get_audio_player_block
-    env.globals['get_doc_block'] = get_doc_block
+    env.globals["url2mime"] = url2mime
+    env.globals["make_img_src"] = make_img_src
+    env.globals["handle_links"] = build_link_handler(config)
+    env.globals["get_audio_player_block"] = get_audio_player_block
+    env.globals["get_doc_block"] = get_doc_block
 
     return env
 
@@ -39,22 +43,38 @@ def _get_abs_template_path(path_str):
     return os.path.join(pkg_dir, path_str)
 
 
-class BaseDoc:
+def escape_values_recursive(node):
+    skip_key = "html"  # Skip escaping html values in embeds
+    if isinstance(node, dict):
+        for k, v in node.items():
+            if k != skip_key:
+                node[k] = escape_values_recursive(v)
+    elif isinstance(node, list):
+        for i, v in enumerate(node):
+            node[i] = escape_values_recursive(v)
+    elif isinstance(node, str):
+        return escape(node)
+    return node
 
-    doc_type = 'doc'
-    templates_path = (_get_abs_template_path('templates'),
-                      _get_abs_template_path('templates/extras'))
+
+class BaseDoc:
+    doc_type = "doc"
+    templates_path = (
+        _get_abs_template_path("templates"),
+        _get_abs_template_path("templates/extras"),
+    )
     locked = False
     # `locked` helps in templates determine to show/hide in anonymous views
     # Useful in case where code is referring same template for both protected
     # and guest views
 
     def __init__(self, config):
         environ = init_env(self.templates_path, config)
-        self.t = environ.get_template(f'{self.doc_type}.html')
-        self.t.environment.globals['locked'] = self.locked
+        self.t = environ.get_template(f"{self.doc_type}.html")
+        self.t.environment.globals["locked"] = self.locked
 
     def render(self, in_data):
         in_data = in_data if isinstance(in_data, dict) else json.loads(in_data)
         node = in_data if isinstance(in_data, dict) else json.loads(in_data)
+        node = escape_values_recursive(node)
         return self.t.render(node=node)

tiptapy/image.py

@@ -3,24 +3,24 @@
 # Link: https://developer.mozilla.org/en-US/docs/Web/Media/Formats/Image_types
 from os.path import splitext
 
-class SupportedFormatsMapper(dict):
 
+class SupportedFormatsMapper(dict):
     def __missing__(self, ext):
-        return 'image'
+        return "image"
 
 
 SUPPORTED_FORMATS_MAP = SupportedFormatsMapper(
-    PNG='image/png',
-    JPG='image/jpeg',
-    JPEG='image/jpeg',
-    GIF='image/gif',
-    BMP='image/bmp',
-    WEBP='image/webp',
-    SVG='image/svg+xml'
+    PNG="image/png",
+    JPG="image/jpeg",
+    JPEG="image/jpeg",
+    GIF="image/gif",
+    BMP="image/bmp",
+    WEBP="image/webp",
+    SVG="image/svg+xml",
 )
 
 
 def url2mime(url):
     ext = splitext(url)[-1]
-    ext = (ext[1:] if ext.startswith('.') else ext).upper()
+    ext = (ext[1:] if ext.startswith(".") else ext).upper()
     return SUPPORTED_FORMATS_MAP[ext]