From 99fda81ae022e227fe3fcff91a8170d3a49ce7c1 Mon Sep 17 00:00:00 2001
From: Lucia Sarni <lucia@feedbackfruits.com>
Date: Thu, 15 Oct 2020 04:37:12 +0200
Subject: [PATCH] fix: missing commas in response header values #6183 (#6515)

---
 src/core/components/live-response.jsx         |  3 +-
 .../static/documents/bugs/6183.yaml           | 37 +++++++++++++++++++
 test/e2e-cypress/tests/bugs/6183.js           | 21 +++++++++++
 3 files changed, 60 insertions(+), 1 deletion(-)
 create mode 100644 test/e2e-cypress/static/documents/bugs/6183.yaml
 create mode 100644 test/e2e-cypress/tests/bugs/6183.js

diff --git a/src/core/components/live-response.jsx b/src/core/components/live-response.jsx
index 93c1fe23..d1b549f3 100644
--- a/src/core/components/live-response.jsx
+++ b/src/core/components/live-response.jsx
@@ -65,7 +65,8 @@ export default class LiveResponse extends React.Component {
     const Curl = getComponent("curl")
     const ResponseBody = getComponent("responseBody")
     const returnObject = headersKeys.map(key => {
-      return <span className="headerline" key={key}> {key}: {headers[key]} </span>
+      var joinedHeaders = Array.isArray(headers[key]) ? headers[key].join() : headers[key]
+      return <span className="headerline" key={key}> {key}: {joinedHeaders} </span>
     })
     const hasHeaders = returnObject.length !== 0
 
diff --git a/test/e2e-cypress/static/documents/bugs/6183.yaml b/test/e2e-cypress/static/documents/bugs/6183.yaml
new file mode 100644
index 00000000..2fefc78b
--- /dev/null
+++ b/test/e2e-cypress/static/documents/bugs/6183.yaml
@@ -0,0 +1,37 @@
+swagger: "2.0"
+info:
+  title: Response headers test
+  version: 1.0.0
+host: httpbin.org
+schemes: [https]
+paths:
+  /response-headers:
+    get:
+      summary: Run the request using the default parameter values
+      parameters:
+        - in: query
+          name: X-Header1
+          type: string
+          x-example: 'value1,value2'
+          required: true
+        - in: query
+          name: X-Header2
+          type: string
+          x-example: 'value3, value4'
+          required: true
+        - in: query
+          name: X-Header3
+          type: array
+          items:
+            type: string
+          x-example: [value5, value6]
+          collectionFormat: multi
+          required: true
+        - in: query
+          name: Access-Control-Expose-Headers
+          type: string
+          x-example: 'X-Header1, X-Header2, X-Header3, Access-Control-Expose-Headers'
+          required: true
+      responses:
+        200:
+          description: ok
diff --git a/test/e2e-cypress/tests/bugs/6183.js b/test/e2e-cypress/tests/bugs/6183.js
new file mode 100644
index 00000000..d151cdff
--- /dev/null
+++ b/test/e2e-cypress/tests/bugs/6183.js
@@ -0,0 +1,21 @@
+describe("When trying it out", () => {
+  it("should render the response headers as comma separated lists", () => {
+    cy.visit("/?url=/documents/bugs/6183.yaml")
+      .get("#operations-default-get_response_headers")
+      .click()
+      .get(".try-out__btn")
+      .click()
+      .get(".btn.execute")
+      .click()
+      .wait(1000)
+      .get(".response-col_description .microlight")
+      .find(("span:contains(\"value1,value2\")"))
+      .should("exist")
+      .get(".response-col_description .microlight")
+      .find(("span:contains(\"value3,value4\")"))
+      .should("exist")
+      .get(".response-col_description .microlight")
+      .find(("span:contains(\"value5,value6\")"))
+      .should("exist")
+  })
+})