From 938ca26cd40fd25cdfc1155eea3292c948cd8d12 Mon Sep 17 00:00:00 2001 From: nimrod-up9 <59927337+nimrod-up9@users.noreply.github.com> Date: Wed, 5 May 2021 17:23:10 +0300 Subject: [PATCH] Show gRPC as ASCII (#31) * Moved try-catch up one block. * Display grpc as ASCII. --- .../components/HarEntryViewer/HAREntrySections.tsx | 14 +++++++++----- 1 file changed, 9 insertions(+), 5 deletions(-) diff --git a/ui/src/components/HarEntryViewer/HAREntrySections.tsx b/ui/src/components/HarEntryViewer/HAREntrySections.tsx index ede3ca572..b69ad88ba 100644 --- a/ui/src/components/HarEntryViewer/HAREntrySections.tsx +++ b/ui/src/components/HarEntryViewer/HAREntrySections.tsx @@ -69,19 +69,23 @@ export const HAREntryBodySection: React.FC = ({ }) => { const MAXIMUM_BYTES_TO_HIGHLIGHT = 10000; // The maximum of chars to highlight in body, in case the response can be megabytes const supportedLanguages = [['html', 'html'], ['json', 'json'], ['application/grpc', 'json']]; // [[indicator, languageToUse],...] - const jsonLikeFormats = ['json', 'application/grpc']; + const jsonLikeFormats = ['json']; + const binaryFormats = ['application/grpc']; const [isWrapped, setIsWrapped] = useState(false); const formatTextBody = (body): string => { const chunk = body.slice(0, MAXIMUM_BYTES_TO_HIGHLIGHT); const bodyBuf = encoding === 'base64' ? atob(chunk) : chunk; - if (jsonLikeFormats.some(format => content?.mimeType?.indexOf(format) > -1)) { - try { + try { + if (jsonLikeFormats.some(format => content?.mimeType?.indexOf(format) > -1)) { return JSON.stringify(JSON.parse(bodyBuf), null, 2); - } catch (error) { - console.error(error); + } else if (binaryFormats.some(format => content?.mimeType?.indexOf(format) > -1)) { + // Replace all non printable characters (ASCII) + return atob(bodyBuf).replace(/[^ -~]/g, '.') } + } catch (error) { + console.error(error); } return bodyBuf; }