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 =
+ Unrecognized response type; displaying content as text. +
++ 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; } }