Namespace markdown rendering for theming

CHANGELOG.md

@@ -8,6 +8,7 @@
 - Spatial encoding fixes: prevent breaking unicode errors. [#1381](https://github.com/opendatateam/udata/pull/1381)
 - Ensure the multiple term search uses a `AND` operator [#1384](https://github.com/opendatateam/udata/pull/1384)
 - Facets encoding fixes: ensure lazy strings are propery encoded. [#1388](https://github.com/opendatateam/udata/pull/1388)
+- Markdown content is now easily themable (namespaced into a `markdown` class) [#1389](https://github.com/opendatateam/udata/pull/1389)
 
 ## 1.2.9 (2018-01-17)
 

js/plugins/markdown.js

@@ -11,6 +11,7 @@ export function install(Vue, options) {
             $(this.el).addClass('markdown');
         },
         update: function(value) {
+            this.el.classList.add('markdown');
             this.el.innerHTML = value ? commonmark(value) : '';
         },
         unbind: function() {
@@ -24,6 +25,7 @@ export function install(Vue, options) {
         }
         if (max_length) {
             const div = document.createElement('div');
+            div.classList.add('markdown');
             div.innerHTML = commonmark(text);
             return txt.truncate(div.textContent || div.innerText || '', max_length);
         } else {

udata/frontend/markdown.py

@@ -62,7 +62,7 @@ def __init__(self, app, parser, renderer):
         self.renderer = renderer
         app.jinja_env.filters.setdefault('markdown', self.__call__)
 
-    def __call__(self, stream, source_tooltip=False):
+    def __call__(self, stream, source_tooltip=False, wrap=True):
         if not stream:
             return ''
         stream = bleach_clean(stream)
@@ -77,6 +77,8 @@ def __call__(self, stream, source_tooltip=False):
         # Turn string links into HTML ones *after* markdown transformation.
         html = bleach.linkify(html, skip_tags=['pre'],
                               parse_email=True, callbacks=callbacks)
+        if wrap:
+            html = '<div class="markdown">{0}</div>'.format(html.strip())
         # Return a `Markup` element considered as safe by Jinja.
         return Markup(html)
 
@@ -105,7 +107,7 @@ def mdstrip(value, length=None, end='…'):
         return ''
     if EXCERPT_TOKEN in value:
         value = value.split(EXCERPT_TOKEN, 1)[0]
-    rendered = md(value)
+    rendered = md(value, wrap=False)
     text = do_striptags(rendered)
     text = bleach_clean(text)
     if length > 0:

udata/tests/frontend/test_markdown.py

@@ -25,9 +25,13 @@ def create_app(self):
         init_app(app)
         return app
 
+    def assert_md_equal(self, value, expected):
+        expected = '<div class="markdown">{0}</div>'.format(expected)
+        self.assertEqual(value.strip(), expected)
+
     def test_excerpt_is_not_removed(self):
         with self.app.test_request_context('/'):
-            self.assertEqual(md(EXCERPT_TOKEN).strip(), EXCERPT_TOKEN)
+            self.assert_md_equal(md(EXCERPT_TOKEN), EXCERPT_TOKEN)
 
     def test_markdown_filter_with_none(self):
         '''Markdown filter should not fails with None'''
@@ -92,29 +96,29 @@ def test_markdown_not_linkify_mails(self):
             result = render_template_string('{{ text|markdown }}', text=text)
             parsed = parser.parse(result)
             self.assertEqual(parsed.getElementsByTagName('a'), [])
-            self.assertEqual(result.strip(), '<p>coucou@cmoi.fr</p>')
+            self.assert_md_equal(result, '<p>coucou@cmoi.fr</p>')
 
     def test_markdown_linkify_within_pre(self):
         '''Markdown filter should not transform urls into <pre> anchors'''
         text = '<pre>http://example.net/</pre>'
         with self.app.test_request_context('/'):
             result = render_template_string('{{ text|markdown }}', text=text)
-            self.assertEqual(result.strip(), '<pre>http://example.net/</pre>')
+            self.assert_md_equal(result, '<pre>http://example.net/</pre>')
 
     def test_markdown_linkify_email_within_pre(self):
         '''Markdown filter should not transform emails into <pre> anchors'''
         text = '<pre>coucou@cmoi.fr</pre>'
         with self.app.test_request_context('/'):
             result = render_template_string('{{ text|markdown }}', text=text)
-            self.assertEqual(result.strip(), '<pre>coucou@cmoi.fr</pre>')
+            self.assert_md_equal(result, '<pre>coucou@cmoi.fr</pre>')
 
     def test_bleach_sanitize(self):
         '''Markdown filter should sanitize evil code'''
         text = 'an <script>evil()</script>'
         with self.app.test_request_context('/'):
             result = render_template_string('{{ text|markdown }}', text=text)
-            self.assertEqual(result.strip(),
-                             '<p>an &lt;script&gt;evil()&lt;/script&gt;</p>')
+            expected = '<p>an &lt;script&gt;evil()&lt;/script&gt;</p>'
+            self.assert_md_equal(result, expected)
 
     def test_mdstrip_filter(self):
         '''mdstrip should truncate the text before rendering'''