1 files changed, 17 insertions, 1 deletions
diff --git a/web/react/utils/markdown.jsx b/web/react/utils/markdown.jsx
index 179416ea0..3ef09211f 100644
--- a/web/react/utils/markdown.jsx
+++ b/web/react/utils/markdown.jsx
@@ -34,6 +34,11 @@ const highlightJsIni = require('highlight.js/lib/languages/ini.js');
 const Constants = require('../utils/constants.jsx');
 const HighlightedLanguages = Constants.HighlightedLanguages;
 
+function markdownImageLoaded(image) {
+    image.style.height = 'auto';
+}
+window.markdownImageLoaded = markdownImageLoaded;
+
 class MattermostInlineLexer extends marked.InlineLexer {
     constructor(links, options) {
         super(links, options);
@@ -132,6 +137,16 @@ class MattermostMarkdownRenderer extends marked.Renderer {
         return super.br();
     }
 
+    image(href, title, text) {
+        let out = '<img src="' + href + '" alt="' + text + '"';
+        if (title) {
+            out += ' title="' + title + '"';
+        }
+        out += ' onload="window.markdownImageLoaded(this)" class="markdown-inline-img"';
+        out += this.options.xhtml ? '/>' : '>';
+        return out;
+    }
+
     heading(text, level, raw) {
         const id = `${this.options.headerPrefix}${raw.toLowerCase().replace(/[^\w]+/g, '-')}`;
         return `<h${level} id="${id}" class="markdown__heading">${text}</h${level}>`;
@@ -193,7 +208,8 @@ export function format(text, options) {
     const markdownOptions = {
         renderer: new MattermostMarkdownRenderer(null, options),
         sanitize: true,
-        gfm: true
+        gfm: true,
+        tables: true
     };
 
     const tokens = marked.lexer(text, markdownOptions);