feat: add support for additionalOperations in oas32

docs/usage/configuration.md

@@ -288,6 +288,7 @@ Parameter name | Docker variable | Description
 <a name="responseInterceptor"></a>`responseInterceptor` | _Unavailable_ | `Function=(a => a)`. MUST be a function.  Function to intercept remote definition, "Try it out", and OAuth 2.0 responses.  Accepts one argument responseInterceptor(response) and must return the modified response, or a Promise that resolves to the modified response.
 <a name="showMutatedRequest"></a>`showMutatedRequest` | `SHOW_MUTATED_REQUEST` | `Boolean=true`. If set to `true`, uses the mutated request returned from a requestInterceptor to produce the curl command in the UI, otherwise the request before the requestInterceptor was applied is used.
 <a name="supportedSubmitMethods"></a>`supportedSubmitMethods` | `SUPPORTED_SUBMIT_METHODS` | `Array=["get", "put", "post", "delete", "options", "head", "patch", "trace", "query"]`. List of HTTP methods that have the "Try it out" feature enabled. An empty array disables "Try it out" for all operations. This does not filter the operations from the display.
+For OpenAPI 3.2 `additionalOperations`, custom method tokens are case-sensitive and must be listed exactly (e.g. `["get", "COPY", "Search-Pets"]`). Custom operations are always displayed; they are only executable when listed here. Execution requires `swagger-client` 3.38.2 or later. Browsers may still block some methods or cross-origin requests (CORS).
 <a name="validatorUrl"></a>`validatorUrl` | `VALIDATOR_URL` | `String="https://validator.swagger.io/validator" OR null`. By default, Swagger UI attempts to validate specs against swagger.io's online validator. You can use this parameter to set a different validator URL, for example for locally deployed validators ([Validator Badge](https://github.com/swagger-api/validator-badge)). Setting it to either `none`, `127.0.0.1` or `localhost` will disable validation.
 <a name="withCredentials"></a>`withCredentials` | `WITH_CREDENTIALS` | `Boolean=false` If set to `true`, enables passing credentials, [as defined in the Fetch standard](https://fetch.spec.whatwg.org/#credentials), in CORS requests that are sent by the browser. Note that Swagger UI cannot currently set cookies cross-domain (see [swagger-client#1163](https://github.com/swagger-api/swagger-client/issues/1163)) - as a result, you will have to rely on browser-supplied cookies (which this setting enables sending) that Swagger UI cannot control.
 

src/core/components/layouts/base.jsx

@@ -135,7 +135,7 @@ export default class BaseLayout extends React.Component {
               </Col>
             </Row>
 
-            {isOAS31 && (
+            {(isOAS31 || isOAS32) && (
               <Row className="webhooks-container">
                 <Col mobile={12} desktop={12}>
                   <Webhooks />

src/core/components/operation-summary-method.jsx

@@ -1,6 +1,7 @@
 import React, { PureComponent } from "react"
 import PropTypes from "prop-types"
 import { Iterable } from "immutable"
+import { OPERATION_METHODS } from "core/utils/operation-methods"
 
 export default class OperationSummaryMethod extends PureComponent {
 
@@ -19,7 +20,7 @@ export default class OperationSummaryMethod extends PureComponent {
     } = this.props
 
     return (
-      <span className="opblock-summary-method">{method.toUpperCase()}</span>
+      <span className="opblock-summary-method">{OPERATION_METHODS.includes(method) ? method.toUpperCase() : method}</span>
     )
   }
 }

src/core/components/operation-summary.jsx

@@ -63,7 +63,7 @@ export default class OperationSummary extends PureComponent {
     const securityIsOptional = hasSecurity && security.size === 1 && security.first().isEmpty()
     const allowAnonymous = !hasSecurity || securityIsOptional
     return (
-      <div className={`opblock-summary opblock-summary-${method}`} >
+      <div className="opblock-summary">
         <button
           aria-expanded={isShown}
           className="opblock-summary-control"

src/core/components/operation.jsx

@@ -6,6 +6,7 @@ import { Iterable, List } from "immutable"
 import ImPropTypes from "react-immutable-proptypes"
 
 import RollingLoadSVG from "core/assets/rolling-load.svg"
+import { OPERATION_METHODS } from "core/utils/operation-methods"
 
 export default class Operation extends PureComponent {
   static propTypes = {
@@ -87,6 +88,10 @@ export default class Operation extends PureComponent {
     let responses = operation.get("responses")
     let parameters = getList(operation, ["parameters"])
     let operationScheme = specSelectors.operationScheme(path, method)
+    const normalizedMethod = String(method).toLowerCase()
+    const methodClassName = OPERATION_METHODS.includes(normalizedMethod)
+      ? normalizedMethod
+      : "custom"
     let isShownKey = ["operations", tag, operationId]
     let extensions = getExtensions(operation)
 
@@ -115,7 +120,7 @@ export default class Operation extends PureComponent {
     const validationErrors = specSelectors.validationErrors([path, method])
 
     return (
-        <div className={deprecated ? "opblock opblock-deprecated" : isShown ? `opblock opblock-${method} is-open` : `opblock opblock-${method}`} id={escapeDeepLinkPath(isShownKey.join("-"))} >
+        <div className={deprecated ? "opblock opblock-deprecated" : isShown ? `opblock opblock-${methodClassName} is-open` : `opblock opblock-${methodClassName}`} id={escapeDeepLinkPath(isShownKey.join("-"))} >
           <OperationSummary operationProps={operationProps} isShown={isShown} toggleShown={toggleShown} getComponent={getComponent} authActions={authActions} authSelectors={authSelectors} specPath={specPath} />
           <Collapse isOpened={isShown}>
             <div className="opblock-body">

src/core/components/overview.jsx

@@ -1,6 +1,7 @@
 import React from "react"
 import PropTypes from "prop-types"
 import { Link } from "core/components/layout-utils"
+import { OPERATION_METHODS } from "core/utils/operation-methods"
 
 export default class Overview extends React.Component {
 
@@ -99,7 +100,7 @@ export class OperationLink extends React.Component {
     return (
       <Link href={ href } onClick={this.onClick} className={`block opblock-link ${shown ? "shown" : ""}`}>
         <div>
-          <small className={`bold-label-${method}`}>{method.toUpperCase()}</small>
+          <small>{OPERATION_METHODS.includes(method) ? method.toUpperCase() : method}</small>
           <span className="bold-label" >{id}</span>
         </div>
       </Link>

src/core/plugins/oas3/selectors.js

@@ -24,16 +24,22 @@ const onlyOAS3 =
     }
   }
 
+const pathMethodSpecPath = (specSelectors, path, method) => {
+  return specSelectors.operationSpecPath
+    ? specSelectors.operationSpecPath(path, method)
+    : ["paths", path, method]
+}
+
 function validateRequestBodyIsRequired(selector) {
   return (...args) =>
     (system) => {
-      const specJson = system.getSystem().specSelectors.specJson()
+      const specSelectors = system.getSystem().specSelectors
+      const specJson = specSelectors.specJsonWithResolvedSubtrees()
       const argsList = [...args]
       // expect argsList[0] = state
       let pathMethod = argsList[1] || []
       let isOas3RequestBodyRequired = specJson.getIn([
-        "paths",
-        ...pathMethod,
+        ...pathMethodSpecPath(specSelectors, ...pathMethod),
         "requestBody",
         "required",
       ])
@@ -84,9 +90,7 @@ export const selectDefaultRequestBodyValue =
       if (currentMediaType) {
         return getDefaultRequestBodyValue(
           specSelectors.specResolvedSubtree([
-            "paths",
-            path,
-            method,
+            ...pathMethodSpecPath(specSelectors, path, method),
             "requestBody",
           ]),
           currentMediaType,
@@ -110,9 +114,7 @@ export const hasUserEditedBody = onlyOAS3((state, path, method) => (system) => {
   const currentMediaType = oas3Selectors.requestContentType(path, method)
   let userEditedRequestBody = oas3Selectors.requestBodyValue(path, method)
   const requestBody = specSelectors.specResolvedSubtree([
-    "paths",
-    path,
-    method,
+    ...pathMethodSpecPath(specSelectors, path, method),
     "requestBody",
   ])
 

src/core/plugins/oas32/index.js

@@ -21,6 +21,9 @@ import { validOperationMethods } from "./selectors"
 import {
   isOAS3 as isOAS3SelectorWrapper,
   validOperationMethods as validOperationMethodsWrapper,
+  callbacksOperations,
+  selectWebhooksOperations,
+  webhooks,
 } from "./spec-extensions/wrap-selectors"
 import {
   license as selectLicense,
@@ -51,11 +54,11 @@ import afterLoad from "./after-load"
  *
  * New features in OAS 3.2 (basic implementation):
  * - query operation: QUERY HTTP method support
+ * - additionalOperations: Custom HTTP methods support
  * - info.summary: Short summary field in Info Object
  *
  * Additional features (not yet implemented):
  * - $self: Self-referencing URI for base URI resolution
- * - additionalOperations: Custom HTTP methods support
  * - mediaTypes in Components: Reusable Media Type Objects
  * - Tag enhancements (summary, kind, parent)
  * - querystring parameter location
@@ -112,8 +115,12 @@ const OAS32Plugin = ({ fn }) => {
         wrapSelectors: {
           // Ensure OAS 3.2 specs are recognized as OAS 3.x (for servers, etc.)
           isOAS3: isOAS3SelectorWrapper,
-          // Override validOperationMethods to include QUERY for OAS 3.2
+          // Extend validOperationMethods with QUERY and custom additionalOperations methods (OAS 3.2)
           validOperationMethods: validOperationMethodsWrapper,
+          // Include additionalOperations from callback and webhook Path Items (OAS 3.2)
+          callbacksOperations,
+          selectWebhooksOperations,
+          webhooks,
         },
       },
       oas32: {

src/core/plugins/oas32/spec-extensions/wrap-selectors.js

@@ -1,6 +1,12 @@
 /**
  * @prettier
  */
+import { createSelector } from "reselect"
+import { List, Map } from "immutable"
+import {
+  isOperationMethodField,
+  isFixedOperationMethod,
+} from "core/utils/operation-methods"
 import { createOnlyOAS32SelectorWrapper } from "../fn"
 
 /**
@@ -16,12 +22,152 @@ export const isOAS3 =
   }
 
 /**
- * Wraps validOperationMethods to include QUERY method for OAS 3.2.x
- * OAS 3.2.0 adds support for the QUERY HTTP method per
- * draft-ietf-httpbis-safe-method-w-body
+ * Memoized: recomputes only when the base list or the resolved `paths` change.
+ */
+const selectValidOperationMethods = createSelector(
+  [(baseMethods) => baseMethods, (baseMethods, paths) => paths],
+  (baseMethods, paths) => {
+    const customMethods = []
+
+    if (Map.isMap(paths)) {
+      paths.forEach((pathItem) => {
+        const additionalOperations = Map.isMap(pathItem)
+          ? pathItem.get("additionalOperations")
+          : null
+
+        if (Map.isMap(additionalOperations)) {
+          additionalOperations.forEach((operation, method) => {
+            if (
+              !isFixedOperationMethod(method) &&
+              !customMethods.includes(method)
+            ) {
+              customMethods.push(method)
+            }
+          })
+        }
+      })
+    }
+
+    return baseMethods.concat(customMethods)
+  }
+)
+
+/**
+ * Extends validOperationMethods for OAS 3.2.x with:
+ * - QUERY (new fixed field)
+ * - exact custom method tokens declared under Path Item `additionalOperations`
  *
  * Reference: https://spec.openapis.org/oas/v3.2.0.html#path-item-object
  */
 export const validOperationMethods = createOnlyOAS32SelectorWrapper(
-  () => (oriSelector, system) => system.oas32Selectors.validOperationMethods()
+  () => (oriSelector, system) =>
+    selectValidOperationMethods(
+      system.oas32Selectors.validOperationMethods(),
+      system.specSelectors.specJsonWithResolvedSubtrees().get("paths")
+    )
+)
+
+/**
+ * Collects operation DTOs from a single Path Item:
+ * - fixed-field operations (get, post, ..., query)
+ * - custom operations under `additionalOperations`, keeping exact method tokens
+ */
+const pathItemOperations = (pathItem, specPath) => {
+  if (!Map.isMap(pathItem)) return List()
+
+  const operations = pathItem
+    .entrySeq()
+    .filter(([key]) => isOperationMethodField(key))
+    .map(([method, operation]) => ({
+      operation: Map({ operation }),
+      method,
+      specPath: specPath.concat([method]),
+    }))
+    .toList()
+
+  const additionalOperations = pathItem.get("additionalOperations")
+  if (!Map.isMap(additionalOperations)) return operations
+
+  return operations.concat(
+    additionalOperations
+      .entrySeq()
+      .filter(([method]) => !isFixedOperationMethod(method))
+      .map(([method, operation]) => ({
+        operation: Map({ operation }),
+        method,
+        specPath: specPath.concat(["additionalOperations", method]),
+      }))
+  )
+}
+
+export const callbacksOperations = createOnlyOAS32SelectorWrapper(
+  (state, { callbacks, specPath }) =>
+    () => {
+      if (!Map.isMap(callbacks)) return {}
+
+      return callbacks
+        .reduce((allOperations, callback, callbackName) => {
+          if (!Map.isMap(callback)) return allOperations
+
+          return allOperations.concat(
+            callback.reduce(
+              (callbackOps, pathItem, expression) =>
+                callbackOps.concat(
+                  pathItemOperations(
+                    pathItem,
+                    specPath.concat([callbackName, expression])
+                  ).map((operationDTO) => ({
+                    ...operationDTO,
+                    path: expression,
+                    callbackName,
+                  }))
+                ),
+              List()
+            )
+          )
+        }, List())
+        .groupBy((operationDTO) => operationDTO.callbackName)
+        .map((operations) => operations.toArray())
+        .toObject()
+    }
+)
+
+export const webhooks = createOnlyOAS32SelectorWrapper(
+  () => (oriSelector, system) => {
+    const value = system.specSelectors
+      .specJsonWithResolvedSubtrees()
+      .get("webhooks")
+    return Map.isMap(value) ? value : Map()
+  }
+)
+
+/**
+ * Memoized on the resolved `webhooks` map, matching the OAS 3.1 selector.
+ */
+const selectWebhooksOperationsFromMap = createSelector(
+  [(webhooksMap) => webhooksMap],
+  (webhooksMap) => {
+    if (!Map.isMap(webhooksMap)) return {}
+
+    return webhooksMap
+      .reduce(
+        (allOperations, pathItem, pathItemName) =>
+          allOperations.concat(
+            pathItemOperations(pathItem, ["webhooks", pathItemName]).map(
+              (operationDTO) => ({ ...operationDTO, path: pathItemName })
+            )
+          ),
+        List()
+      )
+      .groupBy((operationDTO) => operationDTO.path)
+      .map((operations) => operations.toArray())
+      .toObject()
+  }
+)
+
+export const selectWebhooksOperations = createOnlyOAS32SelectorWrapper(
+  () => (oriSelector, system) =>
+    selectWebhooksOperationsFromMap(
+      system.specSelectors.specJsonWithResolvedSubtrees().get("webhooks")
+    )
 )

src/core/plugins/spec/reducers.js

@@ -5,6 +5,7 @@ import win from "core/window"
 // selector-in-reducer is suboptimal, but `operationWithMeta` is more of a helper
 import {
   specJsonWithResolvedSubtrees,
+  operationSpecPath,
   parameterValues,
   parameterInclusionSettingFor,
 } from "./selectors"
@@ -83,7 +84,7 @@ export default {
   },
 
   [VALIDATE_PARAMS]: ( state, { payload: { pathMethod, isOAS3 } } ) => {
-    const op = specJsonWithResolvedSubtrees(state).getIn(["paths", ...pathMethod])
+    const op = specJsonWithResolvedSubtrees(state).getIn(operationSpecPath(state, ...pathMethod))
     const paramValues = parameterValues(state, pathMethod).toJS()
 
     return state.updateIn(["meta", "paths", ...pathMethod, "parameters"], fromJS({}), paramMeta => {