Fixes #10540 — Vertical bar character | not escaped in cURL (CMD) request snippet body

src/core/components/info.jsx

@@ -97,13 +97,13 @@ class Info extends React.Component {
     return (
       <div className="info">
         <hgroup className="main">
-          <h1 className="title">
+          <h2 className="title">
             {title}
             <span>
               {version && <VersionStamp version={version} />}
               <OpenAPIVersion oasVersion="2.0" />
             </span>
-          </h1>
+          </h2>
           {host || basePath ? (
             <InfoBasePath host={host} basePath={basePath} />
           ) : null}

src/core/components/responses.jsx

@@ -2,7 +2,7 @@ import React from "react"
 import { fromJS, Iterable } from "immutable"
 import PropTypes from "prop-types"
 import ImPropTypes from "react-immutable-proptypes"
-import { defaultStatusCode, getAcceptControllingResponse, isExtension } from "core/utils"
+import { defaultStatusCode, getAcceptControllingResponse } from "core/utils"
 import createHtmlReadyId from "core/utils/create-html-ready-id"
 
 export default class Responses extends React.Component {
@@ -87,11 +87,10 @@ export default class Responses extends React.Component {
     const acceptControllingResponse = isSpecOAS3 ?
       getAcceptControllingResponse(responses) : null
 
-    const nonExtensionResponses = responses.filter((_, key) => !isExtension(key))
     const regionId = createHtmlReadyId(`${method}${path}_responses`)
     const controlId = `${regionId}_select`
 
-    return (!nonExtensionResponses || !nonExtensionResponses.size) ? null : (
+    return (
       <div className="responses-wrapper">
         <div className="opblock-section-header">
           <h4>Responses</h4>
@@ -132,7 +131,7 @@ export default class Responses extends React.Component {
             </thead>
             <tbody>
               {
-                nonExtensionResponses.entrySeq().map( ([code, response]) => {
+                responses.entrySeq().map( ([code, response]) => {
 
                   let className = tryItOutResponse && tryItOutResponse.get("status") == code ? "response_current" : ""
                   return (

src/core/plugins/oas31/components/info.jsx

@@ -33,13 +33,13 @@ const Info = ({ getComponent, specSelectors }) => {
   return (
     <div className="info">
       <hgroup className="main">
-        <h1 className="title">
+        <h2 className="title">
           {title}
           <span>
             {version && <VersionStamp version={version} />}
             <OpenAPIVersion oasVersion="3.1" />
           </span>
-        </h1>
+        </h2>
 
         {(host || basePath) && <InfoBasePath host={host} basePath={basePath} />}
         {url && <InfoUrl getComponent={getComponent} url={url} />}

src/core/plugins/request-snippets/fn.js

@@ -28,11 +28,12 @@ const escapeShell = (str) => {
     return str
 }
 
-const escapeCMD = (str) => {
+export const escapeCMD = (str) => {
   str = str
     .replace(/\^/g, "^^")
     .replace(/\\"/g, "\\\\\"")
     .replace(/"/g, "\"\"")
+    .replace(/\|/g, "^|") 
     .replace(/\n/g, "^\n")
   if (str === "-d ") {
     return str

src/core/utils/index.js

@@ -704,16 +704,12 @@ export const createDeepLinkPath = (str) => typeof str == "string" || str instanc
 // suitable for use in CSS classes and ids
 export const escapeDeepLinkPath = (str) => cssEscape( createDeepLinkPath(str).replace(/%20/g, "_") )
 
-export const isExtension = (key) => {
-  const extensionRegExp = /^x-/
-  return extensionRegExp.test(key)
-}
-
 export const getExtensions = (defObj) => {
+  const extensionRegExp = /^x-/
   if(Map.isMap(defObj)) {
-    return defObj.filter((v, k) => isExtension(k))
+    return defObj.filter((v, k) => extensionRegExp.test(k))
   }
-  return Object.keys(defObj).filter((key) => isExtension(key))
+  return Object.keys(defObj).filter((key) => extensionRegExp.test(key))
 }
 export const getCommonExtensions = (defObj) => defObj.filter((v, k) => /^pattern|maxLength|minLength|maximum|minimum/.test(k))
 

test/e2e-cypress/e2e/bugs/5138.cy.js

@@ -2,7 +2,7 @@ describe("#5138: unwanted `url`/`urls` interactions", () => {
   it("should stably render the first `urls` entry", () => {
     cy
       .visit("/pages/5138/")
-      .get("h1.title")
+      .get("h2.title")
       .contains("USPTO Data Set API")
       .wait(3000)
       .contains("USPTO Data Set API")

test/e2e-cypress/e2e/features/urls.cy.js

@@ -19,7 +19,7 @@ describe("configuration options: `urls` and `urls.primaryName`", () => {
 
     it("should render the first URL in the list", () => {
       cy.visit("/?configUrl=/configs/urls.yaml")
-        .get("h1.title")
+        .get("h2.title")
         .should("have.text", "OneOAS 2.0")
         .window()
         .then(win => win.ui.specSelectors.url())
@@ -31,7 +31,7 @@ describe("configuration options: `urls` and `urls.primaryName`", () => {
     cy.visit("/?configUrl=/configs/urls-primary-name.yaml")
       .get("select")
       .should("contain.value", "/documents/features/urls/2.yaml")
-      .get("h1.title")
+      .get("h2.title")
       .should("have.text", "TwoOAS 3.0")
       .window()
       .then(win => win.ui.specSelectors.url())

test/unit/core/plugins/request-snippets/fn.test.js

@@ -0,0 +1,15 @@
+
+import { escapeCMD } from "../../../../../src/core/plugins/request-snippets/fn"
+
+describe("escapeCMD", () => {
+  it("escapes vertical bar | with caret ^ for CMD", () => {
+    const input = "foo|bar"
+    const output = escapeCMD(input)
+    expect(output).toContain("^|")
+  })
+
+  it("escapes other CMD special characters", () => {
+    expect(escapeCMD("foo^bar")).toContain("^^")
+    expect(escapeCMD("foo\"bar")).toContain("\"\"")
+  })
+})