From 12e350fcad66f7708e6bc3e18d8cb2c9a107bc16 Mon Sep 17 00:00:00 2001
From: Yann Savary <ysavary@users.noreply.github.com>
Date: Thu, 23 Aug 2018 00:15:12 +0200
Subject: [PATCH] fix: incorrect usage of lodash.lowerCase (via #4200)

* Wrong usage of https://lodash.com/docs/4.17.5#lowerCase

* Add basic tests about ResponseBody Content-Type
---
 src/core/components/response-body.jsx |  4 +--
 test/components/response-body.js      | 36 +++++++++++++++++++++++++++
 2 files changed, 38 insertions(+), 2 deletions(-)
 create mode 100644 test/components/response-body.js

diff --git a/src/core/components/response-body.jsx b/src/core/components/response-body.jsx
index b3ae59250b1..10b0d657238 100644
--- a/src/core/components/response-body.jsx
+++ b/src/core/components/response-body.jsx
@@ -1,7 +1,7 @@
 import React from "react"
 import PropTypes from "prop-types"
 import formatXml from "xml-but-prettier"
-import lowerCase from "lodash/lowerCase"
+import toLower from "lodash/toLower"
 import { extractFileNameFromContentDispositionHeader } from "core/utils"
 import win from "core/window"
 
@@ -110,7 +110,7 @@ export default class ResponseBody extends React.PureComponent {
       bodyEl = <HighlightCode downloadable fileName={`${downloadName}.xml`} value={ body } />
 
       // HTML or Plain Text
-    } else if (lowerCase(contentType) === "text/html" || /text\/plain/.test(contentType)) {
+    } else if (toLower(contentType) === "text/html" || /text\/plain/.test(contentType)) {
       bodyEl = <HighlightCode downloadable fileName={`${downloadName}.html`} value={ content } />
 
       // Image
diff --git a/test/components/response-body.js b/test/components/response-body.js
new file mode 100644
index 00000000000..f6255b0ba5c
--- /dev/null
+++ b/test/components/response-body.js
@@ -0,0 +1,36 @@
+import React from "react"
+import expect from "expect"
+import { shallow } from "enzyme"
+import ResponseBody from "components/response-body"
+import { inferSchema } from "corePlugins/samples/fn"
+
+describe("<ResponseBody />", function() {
+    const highlightCodeComponent = () => null
+    const components = {
+        highlightCode: highlightCodeComponent
+    }
+    const props = {
+        getComponent: c => components[c],
+    }
+
+    it("renders ResponseBody as 'application/json'", function() {
+        props.contentType = "application/json"
+        props.content = "{\"key\": \"a test value\"}"
+        const wrapper = shallow(<ResponseBody {...props}/>)
+        expect(wrapper.find("highlightCodeComponent").length).toEqual(1)
+    })
+
+    it("renders ResponseBody as 'text/html'", function() {
+        props.contentType = "application/json"
+        props.content = "<b>Result</b>"
+        const wrapper = shallow(<ResponseBody {...props}/>)
+        expect(wrapper.find("highlightCodeComponent").length).toEqual(1)
+    })
+
+    it("renders ResponseBody as 'image/svg'", function() {
+        props.contentType = "image/svg"
+        const wrapper = shallow(<ResponseBody {...props}/>)
+        console.warn(wrapper.debug())
+        expect(wrapper.find("highlightCodeComponent").length).toEqual(0)
+    })
+})