From 60e8091eedde05244a1d8c498b5f85f7390ed9af Mon Sep 17 00:00:00 2001
From: Owen Conti <owen@ohseemedia.com>
Date: Sun, 8 Oct 2017 10:26:32 -0600
Subject: [PATCH] Add unit test for images in markdown

---
 src/core/components/providers/markdown.jsx |  3 ++
 test/components/markdown.js                | 56 +++++++++++++---------
 2 files changed, 36 insertions(+), 23 deletions(-)

diff --git a/src/core/components/providers/markdown.jsx b/src/core/components/providers/markdown.jsx
index ef95c6ae..2ef8b6a6 100644
--- a/src/core/components/providers/markdown.jsx
+++ b/src/core/components/providers/markdown.jsx
@@ -30,6 +30,9 @@ export default Markdown
 
 const sanitizeOptions = {
     allowedTags: sanitize.defaults.allowedTags.concat([ "h1", "h2", "img" ]),
+    allowedAttributes: {
+        "img": sanitize.defaults.allowedAttributes.img.concat(["title"])
+    },
     textFilter: function(text) {
         return text.replace(/&quot;/g, "\"")
     }
diff --git a/test/components/markdown.js b/test/components/markdown.js
index 6dd87053..01a55e1c 100644
--- a/test/components/markdown.js
+++ b/test/components/markdown.js
@@ -5,34 +5,44 @@ import { render } from "enzyme"
 import Markdown from "components/providers/markdown"
 import { Markdown as OAS3Markdown } from "corePlugins/oas3/wrap-components/markdown.js"
 
-describe.only("Markdown component", function() {
-  describe("Swagger 2.0", function() {
-    it("allows heading elements", function() {
-      const str = `
+describe("Markdown component", function() {
+    describe("Swagger 2.0", function() {
+        it("allows image elements", function() {
+            const str = `![Image alt text](http://image.source "Image title")`
+            const el = render(<Markdown source={str} />)
+            expect(el.html()).toEqual(`<div class="markdown"><p><img src="http://image.source" title="Image title"></p>\n</div>`)
+        })
+
+        it("allows heading elements", function() {
+            const str = `
 # h1
 ## h2
 ### h3
 #### h4
 ##### h5
-###### h6
-      `
-      const el = render(<Markdown source={str} />)
-      expect(el.html()).toEqual(`<div class="markdown"><h1>h1</h1>\n<h2>h2</h2>\n<h3>h3</h3>\n<h4>h4</h4>\n<h5>h5</h5>\n<h6>h6</h6>\n</div>`)
+###### h6`
+            const el = render(<Markdown source={str} />)
+            expect(el.html()).toEqual(`<div class="markdown"><h1>h1</h1>\n<h2>h2</h2>\n<h3>h3</h3>\n<h4>h4</h4>\n<h5>h5</h5>\n<h6>h6</h6>\n</div>`)
+        })
     })
-  })
 
-  describe("OAS 3", function() {
-    it("allows heading elements", function() {
-        const str = `
-  # h1
-  ## h2
-  ### h3
-  #### h4
-  ##### h5
-  ###### h6
-        `
-        const el = render(<OAS3Markdown source={str} />)
-        expect(el.html()).toEqual(`<div class="renderedMarkdown"><div><h1>h1</h1>\n<h2>h2</h2>\n<h3>h3</h3>\n<h4>h4</h4>\n<h5>h5</h5>\n<h6>h6</h6></div></div>`)
-      })
-  })
+    describe("OAS 3", function() {
+        it("allows image elements", function() {
+            const str = `![Image alt text](http://image.source "Image title")`
+            const el = render(<OAS3Markdown source={str} />)
+            expect(el.html()).toEqual(`<div class="renderedMarkdown"><div><p><img src="http://image.source" title="Image title"></p></div></div>`)
+        })
+
+        it("allows heading elements", function() {
+            const str = `
+# h1
+## h2
+### h3
+#### h4
+##### h5
+###### h6`
+            const el = render(<OAS3Markdown source={str} />)
+            expect(el.html()).toEqual(`<div class="renderedMarkdown"><div><h1>h1</h1>\n<h2>h2</h2>\n<h3>h3</h3>\n<h4>h4</h4>\n<h5>h5</h5>\n<h6>h6</h6></div></div>`)
+        })
+    })
 })