diff --git a/src/core/components/response-body.jsx b/src/core/components/response-body.jsx index 75b0f12f..fd5eaa94 100644 --- a/src/core/components/response-body.jsx +++ b/src/core/components/response-body.jsx @@ -5,7 +5,10 @@ import lowerCase from "lodash/lowerCase" import { extractFileNameFromContentDispositionHeader } from "core/utils" import win from "core/window" -export default class ResponseBody extends React.Component { +export default class ResponseBody extends React.PureComponent { + state = { + parsedContent: null + } static propTypes = { content: PropTypes.any.isRequired, @@ -15,8 +18,39 @@ export default class ResponseBody extends React.Component { url: PropTypes.string } + updateParsedContent = (prevContent) => { + const { content } = this.props + + if(prevContent === content) { + return + } + + if(content && content instanceof Blob) { + var reader = new FileReader() + reader.onload = () => { + this.setState({ + parsedContent: reader.result + }) + } + reader.readAsText(content) + } else { + this.setState({ + parsedContent: content.toString() + }) + } + } + + componentDidMount() { + this.updateParsedContent(null) + } + + componentDidUpdate(prevProps) { + this.updateParsedContent(prevProps.content) + } + render() { let { content, contentType, url, headers={}, getComponent } = this.props + const { parsedContent } = this.state const HighlightCode = getComponent("highlightCode") let body, bodyEl url = url || "" @@ -95,7 +129,22 @@ export default class ResponseBody extends React.Component { bodyEl = } else if ( content.size > 0 ) { // We don't know the contentType, but there was some content returned - bodyEl =
Unknown response type
+ if(parsedContent) { + // We were able to squeeze something out of content + // in `updateParsedContent`, so let's display it + bodyEl =
+

+ Unrecognized response type; displaying content as text. +

+ +
+ + } else { + // Give up + bodyEl =

+ Unrecognized response type; unable to display. +

+ } } else { // We don't know the contentType and there was no content returned bodyEl = null diff --git a/src/style/_layout.scss b/src/style/_layout.scss index 23b8214e..812f461e 100644 --- a/src/style/_layout.scss +++ b/src/style/_layout.scss @@ -632,6 +632,7 @@ > .microlight { overflow-y: auto; max-height: 400px; + min-height: 6em; } }