diff --git a/docs/usage/configuration.md b/docs/usage/configuration.md
index 2204b6da58a..77740567fd6 100644
--- a/docs/usage/configuration.md
+++ b/docs/usage/configuration.md
@@ -56,7 +56,7 @@ Parameter name | Docker variable | Description
`filter` | `FILTER` | `Boolean=false OR String`. If set, enables filtering. The top bar will show an edit box that you can use to filter the tagged operations that are shown. Can be Boolean to enable or disable, or a string, in which case filtering will be enabled using that string as the filter expression. Filtering is case sensitive matching the filter expression anywhere inside the tag.
`maxDisplayedTags` | `MAX_DISPLAYED_TAGS` | `Number`. If set, limits the number of tagged operations displayed to at most this many. The default is to show all operations.
`operationsSorter` | _Unavailable_ | `Function=(a => a)`. Apply a sort to the operation list of each API. It can be 'alpha' (sort by paths alphanumerically), 'method' (sort by HTTP method) or a function (see Array.prototype.sort() to know how sort function works). Default is the order returned by the server unchanged.
-`showExtensions` | `SHOW_EXTENSIONS` | `Boolean=false`. Controls the display of vendor extension (`x-`) fields and values for Operations, Parameters, and Schema.
+`showExtensions` | `SHOW_EXTENSIONS` | `Boolean=false`. Controls the display of vendor extension (`x-`) fields and values for Operations, Parameters, Responses, and Schema.
`showCommonExtensions` | `SHOW_COMMON_EXTENSIONS` | `Boolean=false`. Controls the display of extensions (`pattern`, `maxLength`, `minLength`, `maximum`, `minimum`) fields and values for Parameters.
`tagsSorter` | _Unavailable_ | `Function=(a => a)`. Apply a sort to the tag list of each API. It can be 'alpha' (sort by paths alphanumerically) or a function (see [Array.prototype.sort()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort) to learn how to write a sort function). Two tag name strings are passed to the sorter for each pass. Default is the order determined by Swagger UI.
`useUnsafeMarkdown` | `USE_UNSAFE_MARKDOWN` | `Boolean=false`. When enabled, sanitizer will leave `style`, `class` and `data-*` attributes untouched on all HTML Elements declared inside markdown strings. This parameter is **Deprecated** and will be removed in `4.0.0`.
diff --git a/src/core/components/response-extension.jsx b/src/core/components/response-extension.jsx
new file mode 100644
index 00000000000..e8f1b039693
--- /dev/null
+++ b/src/core/components/response-extension.jsx
@@ -0,0 +1,12 @@
+import React from "react"
+import PropTypes from "prop-types"
+
+export const ResponseExtension = ({ xKey, xVal }) => {
+ return
{ xKey }: { String(xVal) }
+}
+ResponseExtension.propTypes = {
+ xKey: PropTypes.string,
+ xVal: PropTypes.any
+}
+
+export default ResponseExtension
diff --git a/src/core/components/response.jsx b/src/core/components/response.jsx
index d4c7c782b4a..548b6dcfb38 100644
--- a/src/core/components/response.jsx
+++ b/src/core/components/response.jsx
@@ -3,7 +3,7 @@ import PropTypes from "prop-types"
import ImPropTypes from "react-immutable-proptypes"
import cx from "classnames"
import { fromJS, Seq, Iterable, List, Map } from "immutable"
-import { getSampleSchema, fromJSOrdered, stringify } from "core/utils"
+import { getExtensions, getSampleSchema, fromJSOrdered, stringify } from "core/utils"
import { isFunc } from "../utils"
const getExampleComponent = ( sampleResponse, HighlightCode, getConfigs ) => {
@@ -88,9 +88,12 @@ export default class Response extends React.Component {
let { inferSchema } = fn
let isOAS3 = specSelectors.isOAS3()
+ const { showExtensions } = getConfigs()
+ let extensions = showExtensions ? getExtensions(response) : null
let headers = response.get("headers")
let links = response.get("links")
+ const ResponseExtension = getComponent("ResponseExtension")
const Headers = getComponent("headers")
const HighlightCode = getComponent("highlightCode")
const ModelExample = getComponent("modelExample")
@@ -188,6 +191,8 @@ export default class Response extends React.Component {
+ { !showExtensions || !extensions.size ? null : extensions.map((v, key) => )}
+
{isOAS3 && response.get("content") ? (
{
+ describe("in Swagger 2", () => {
+ const swagger2BaseUrl = "/?showExtensions=true&docExpansion=full&url=/documents/features/response-extension.swagger.yaml"
+
+ describe("without x- values", () => {
+ it("should omit response extensions section", () => {
+ cy.visit(swagger2BaseUrl)
+ .get("tr.response[data-code='200'] td.response-col_description div.response__extension")
+ .should("not.exist")
+ })
+ })
+
+ describe("with x- values", () => {
+ it("should list each value", () => {
+ const page = cy.visit(swagger2BaseUrl)
+
+ page.get("tr.response[data-code='404'] td.response-col_description div.response__extension:nth-child(2)")
+ .should("have.text", "x-error: true")
+
+ page.get("tr.response[data-code='404'] td.response-col_description div.response__extension:nth-child(3)")
+ .should("have.text", "x-error-codes: List [ \"NOT_FOUND\" ]")
+ })
+ })
+ })
+
+ describe("in OpenAPI 3", () => {
+ const openAPI3BaseUrl = "/?showExtensions=true&docExpansion=full&url=/documents/features/response-extension.openapi.yaml"
+
+ describe("without x- values", () => {
+ it("should omit response extensions section", () => {
+ cy.visit(openAPI3BaseUrl)
+ .get("tr.response[data-code='200'] td.response-col_description div.response__extension")
+ .should("not.exist")
+ })
+ })
+
+ describe("with x- values", () => {
+ it("should list each value", () => {
+ const page = cy.visit(openAPI3BaseUrl)
+
+ page.get("tr.response[data-code='404'] td.response-col_description div.response__extension:nth-child(2)")
+ .should("have.text", "x-error: true")
+
+ page.get("tr.response[data-code='404'] td.response-col_description div.response__extension:nth-child(3)")
+ .should("have.text", "x-error-codes: List [ \"NOT_FOUND\" ]")
+ })
+ })
+ })
+})
diff --git a/test/unit/components/response.jsx b/test/unit/components/response.jsx
index b39cb5308fd..b54e332ead0 100644
--- a/test/unit/components/response.jsx
+++ b/test/unit/components/response.jsx
@@ -17,6 +17,9 @@ describe("", function () {
}
const props = {
getComponent: c => components[c],
+ getConfigs: () => {
+ return {}
+ },
specSelectors: {
isOAS3() {
return false