pr review

I'll try to come up with an example

Author: Bruno Tremblay

src/components/api-request.js

@@ -677,7 +677,11 @@ export default class ApiRequest extends LitElement {
         ${this.responseIsBlob
           ? html`
             <div class="tab-content col" style="flex:1; display:${this.activeResponseTab === 'response' ? 'flex' : 'none'};">
-              <button class="m-btn" @click="${this.downloadResponseBlob}">${this.responseBlobType.toUpperCase()}</button>
+              <button class="m-btn" @click="${this.downloadResponseBlob}">DOWNLOAD</button>
+              ${this.responseBlobType === 'view'
+                ? html`<button class="m-btn" @click="${this.viewResponseBlob}">VIEW (NEW TAB)</button>`
+                : ''
+              }
             </div>`
           : html`
             <div class="tab-content col m-markdown" style="flex:1;display:${this.activeResponseTab === 'response' ? 'flex' : 'none'};" >
@@ -1003,20 +1007,20 @@ export default class ApiRequest extends LitElement {
           resp.json().then((respObj) => {
             me.responseText = JSON.stringify(respObj, null, 2);
           });
-        } else if (RegExp('7z|octet-stream|pdf|tar|zip').test(contentType)) {
+        } else if (RegExp('7z|octet-stream|tar|zip').test(contentType)) {
           me.responseIsBlob = true;
           me.responseBlobType = 'download';
-          const contentDisposition = resp.headers.get('content-disposition');
-          me.respContentDisposition = contentDisposition ? contentDisposition.split('filename=')[1] : 'filename';
-        } else if (RegExp('^audio|^image|^video').test(contentType)) {
+        } else if (RegExp('^audio|^image|pdf|^video').test(contentType)) {
           me.responseIsBlob = true;
-          me.responseBlobType = 'show';
+          me.responseBlobType = 'view';
         } else {
           resp.text().then((respText) => {
             me.responseText = respText;
           });
         }
         if (me.responseIsBlob) {
+          const contentDisposition = resp.headers.get('content-disposition');
+          me.respContentDisposition = contentDisposition ? contentDisposition.split('filename=')[1] : 'filename';
           resp.blob().then((respBlob) => {
             me.responseBlobUrl = URL.createObjectURL(respBlob);
           });
@@ -1077,11 +1081,19 @@ export default class ApiRequest extends LitElement {
       document.body.appendChild(a);
       a.style = 'display: none';
       a.href = this.responseBlobUrl;
-      if (this.responseBlobType === 'show') {
-        a.target = '_blank';
-      } else {
-        a.download = this.respContentDisposition;
-      }
+      a.download = this.respContentDisposition;
+      a.click();
+      a.remove();
+    }
+  }
+
+  viewResponseBlob() {
+    if (this.responseBlobUrl) {
+      const a = document.createElement('a');
+      document.body.appendChild(a);
+      a.style = 'display: none';
+      a.href = this.responseBlobUrl;
+      a.target = '_blank';
       a.click();
       a.remove();
     }