openapi-explorer 0.7.243 → 0.7.248

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "openapi-explorer",
-  "version": "0.7.243",
+  "version": "0.7.248",
   "description": "OpenAPI Explorer - API viewer with dynamically generated components, documentation, and interaction console",
   "author": "Rhosys Developers <developers@rhosys.ch>",
   "repository": {

package/src/components/tag-input.js

@@ -1,23 +1,17 @@
 import { LitElement, html, css } from 'lit-element';
 
 export default class TagInput extends LitElement {
-  /* eslint-disable indent */
   render() {
-    let tagItemTmpl = '';
-    if (Array.isArray(this.value)) {
-      tagItemTmpl = html`${this.value
-        .filter((v) => v.trim() !== '')
-        .map((v) => html`<span class='tag'>${v}</span>`)
-      }`;
-    }
+    const tagItemTemplate = html`${
+      (this.value || []).filter(v => v.trim()).map((v) => html`<span class='tag'>${v}</span>`)
+    }`;
     return html`
       <div class='tags' tabindex="0">
-        ${tagItemTmpl}
+        ${tagItemTemplate}
         <input type="text" class='editor' @paste="${(e) => this.afterPaste(e)}" @keydown="${this.afterKeyDown}" placeholder="${this.placeholder || ''}">
       </div>
     `;
   }
-  /* eslint-enable indent */
 
   static get properties() {
     return {
@@ -26,10 +20,17 @@ export default class TagInput extends LitElement {
     };
   }
 
+  connectedCallback() {
+    super.connectedCallback();
+    if (!Array.isArray(this.value)) {
+      this.value = this.value !== '' ? [this.value] : [];
+    }
+  }
+
   attributeChangedCallback(name, oldVal, newVal) {
     if (name === 'value') {
       if (newVal && oldVal !== newVal) {
-        this.value = newVal.split(',').filter((v) => v.trim() !== '');
+        this.value = newVal.split(',').filter(v => v.trim());
       }
     }
     super.attributeChangedCallback(name, oldVal, newVal);
@@ -38,7 +39,8 @@ export default class TagInput extends LitElement {
   afterPaste(e) {
     const clipboardData = e.clipboardData || window.clipboardData;
     const pastedData = clipboardData.getData('Text');
-    this.value = pastedData ? pastedData.split(',').filter((v) => v.trim() !== '') : '';
+    const pastedArray = pastedData && pastedData.split(',').filter(v => v.trim()) || [];
+    this.value = this.value.concat(pastedArray);
     e.preventDefault();
   }
 
@@ -46,20 +48,11 @@ export default class TagInput extends LitElement {
     if (e.keyCode === 13) {
       e.stopPropagation();
       e.preventDefault();
-      if (e.target.value) {
-        if (Array.isArray(this.value)) {
-          this.value = [...this.value, e.target.value];
-        } else {
-          this.value = [e.target.value];
-        }
-        e.target.value = '';
-      }
+      this.value = this.value.concat(e.target.value || []);
+      e.target.value = '';
     } else if (e.keyCode === 8) {
       if (e.target.value.length === 0) {
-        if (Array.isArray(this.value) && this.value.length > 0) {
-          this.value.splice(-1);
-          this.value = [...this.value];
-        }
+        this.value = this.value.slice(0, -1);
       }
     }
   }

package/src/openapi-explorer.js

@@ -57,7 +57,6 @@ export default class OpenApiExplorer extends LitElement {
 
       // Spec
       specUrl: { type: String, attribute: 'spec-url' },
-      generateMissingTags: { type: String, attribute: 'generate-missing-tags' },
       specFile: { type: String, attribute: false },
 
       // UI Layouts
@@ -399,7 +398,6 @@ export default class OpenApiExplorer extends LitElement {
 
     if (!this.allowTry || !'true, false,'.includes(`${this.allowTry},`)) { this.allowTry = 'true'; }
 
-    if (!this.generateMissingTags || !'true, false,'.includes(`${this.generateMissingTags},`)) { this.generateMissingTags = 'false'; }
     if (!this.navItemSpacing || !'compact, relaxed, default,'.includes(`${this.navItemSpacing},`)) { this.navItemSpacing = 'default'; }
     if (!this.usePathInNavBar || !'true, false,'.includes(`${this.usePathInNavBar},`)) { this.usePathInNavBar = 'false'; }
     if (!this.fontSize || !'default, large, largest,'.includes(`${this.fontSize},`)) { this.fontSize = 'default'; }
@@ -533,7 +531,7 @@ export default class OpenApiExplorer extends LitElement {
       if (!this.serverUrl && isServerUrl) {
         this.serverUrl = new URL(specUrlOrObject).origin;
       }
-      const spec = await ProcessSpec(isServerUrl, specUrlOrObject, this.generateMissingTags === 'true', this.serverUrl);
+      const spec = await ProcessSpec(isServerUrl, specUrlOrObject, this.serverUrl);
       this.loading = false;
       if (spec === undefined || spec === null) {
         console.error('Unable to resolve the API spec. '); // eslint-disable-line no-console

package/src/templates/navbar-template.js

@@ -118,7 +118,7 @@ export default function navbarTemplate() {
         <div id='link-paths' class='nav-bar-section' part="navbar-operations-header">
         <div class='nav-bar-section-title'>OPERATIONS</div>  
         <div style="display:flex; margin-left:10px;">
-            ${this.renderStyle === 'focused'
+            ${this.renderStyle === 'focused' && this.resolvedSpec.tags.length > 1
               ? html`
                 ${this.operationsCollapsed
                   ? html`<div @click="${(e) => { onExpandCollapseAll.call(this, e, 'expand-all'); this.operationsCollapsed = false; }}" style="font-size: 16px; transform: rotate(0deg); cursor: pointer;">▸</div>`

package/src/templates/security-scheme-template.js

@@ -170,7 +170,6 @@ async function onInvokeOAuthFlow(apiKeyId, flowType, authUrl, tokenUrl, e) {
 
   const checkedScopeEls = [...authFlowDivEl.querySelectorAll('input[type="checkbox"]:checked')];
   const securityObj = this.resolvedSpec.securitySchemes.find(v => v.apiKeyId === apiKeyId);
-  const redirectUrlObj = new URL(securityObj.redirectUri || window.location.href);
   let grantType = '';
   let responseType = '';
 
@@ -200,7 +199,7 @@ async function onInvokeOAuthFlow(apiKeyId, flowType, authUrl, tokenUrl, e) {
       authCodeParams.set('scope', selectedScopes);
     }
     authCodeParams.set('client_id', clientId);
-    authCodeParams.set('redirect_uri', redirectUrlObj.toString());
+    authCodeParams.set('redirect_uri', securityObj.redirectUri || window.location.href);
     authCodeParams.set('response_type', responseType);
     authCodeParams.set('state', base64url.encode(JSON.stringify({ apiKeyId, flowId: flowType, url: window.location.href })));
 
@@ -209,7 +208,7 @@ async function onInvokeOAuthFlow(apiKeyId, flowType, authUrl, tokenUrl, e) {
   } else if (flowType === 'clientCredentials') {
     grantType = 'client_credentials';
     const selectedScopes = checkedScopeEls.map((v) => v.value).join(' ');
-    fetchAccessToken.call(this, tokenUrl, clientId, clientSecret, redirectUrlObj.toString(), grantType, '', sendClientSecretIn, apiKeyId, authFlowDivEl, selectedScopes);
+    fetchAccessToken.call(this, tokenUrl, clientId, clientSecret, '', grantType, '', sendClientSecretIn, apiKeyId, authFlowDivEl, selectedScopes);
   }
 }
 

package/src/utils/spec-parser.js

@@ -3,7 +3,7 @@ import marked from 'marked';
 import yaml from 'js-yaml';
 import { invalidCharsRegEx } from './common-utils';
 
-export default async function ProcessSpec(requiresLookup, specUrlOrObject, generateMissingTags = false, serverUrl = '') {
+export default async function ProcessSpec(requiresLookup, specUrlOrObject, serverUrl = '') {
   let specMeta;
   if (requiresLookup) {
     specMeta = await SwaggerClient(specUrlOrObject);
@@ -19,7 +19,7 @@ export default async function ProcessSpec(requiresLookup, specUrlOrObject, gener
   }
 
   // Tags with Paths and WebHooks
-  const tags = groupByTags(jsonParsedSpec, generateMissingTags);
+  const tags = groupByTags(jsonParsedSpec);
 
   // Components
   const components = getComponents(jsonParsedSpec);
@@ -188,7 +188,7 @@ function getComponents(openApiSpec) {
   return components || [];
 }
 
-function groupByTags(openApiSpec, generateMissingTags = false) {
+function groupByTags(openApiSpec) {
   const supportedMethods = ['get', 'put', 'post', 'delete', 'patch', 'head', 'options']; // this is also used for ordering endpoints by methods
   const tags = openApiSpec.tags && Array.isArray(openApiSpec.tags)
     ? openApiSpec.tags.map((t) => ({
@@ -223,18 +223,7 @@ function groupByTags(openApiSpec, generateMissingTags = false) {
         // If path.methods are tagged, else generate it from path
         const pathTags = pathOrHookObj.tags || [];
         if (pathTags.length === 0) {
-          if (generateMissingTags) {
-            const pathOrHookNameKey = pathOrHookName.replace(/^\/+|\/+$/g, '');
-            const firstWordEndIndex = pathOrHookNameKey.indexOf('/');
-            if (firstWordEndIndex === -1) {
-              pathTags.push(pathOrHookNameKey);
-            } else {
-              // firstWordEndIndex -= 1;
-              pathTags.push(pathOrHookNameKey.substr(0, firstWordEndIndex));
-            }
-          } else {
-            pathTags.push('General ⦂');
-          }
+          pathTags.push('General ⦂');
         }
 
         pathTags.forEach((tag) => {