@kubb/plugin-cypress 5.0.0-alpha.23 → 5.0.0-alpha.24

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kubb/plugin-cypress",
-  "version": "5.0.0-alpha.23",
+  "version": "5.0.0-alpha.24",
   "description": "Cypress test generator plugin for Kubb, creating end-to-end tests from OpenAPI specifications for automated API testing.",
   "keywords": [
     "cypress",
@@ -34,33 +34,10 @@
       "import": "./dist/index.js",
       "require": "./dist/index.cjs"
     },
-    "./components": {
-      "import": "./dist/components.js",
-      "require": "./dist/components.cjs"
-    },
-    "./generators": {
-      "import": "./dist/generators.js",
-      "require": "./dist/generators.cjs"
-    },
     "./package.json": "./package.json"
   },
   "types": "./dist/index.d.ts",
-  "typesVersions": {
-    "*": {
-      "utils": [
-        "./dist/utils.d.ts"
-      ],
-      "hooks": [
-        "./dist/hooks.d.ts"
-      ],
-      "components": [
-        "./dist/components.d.ts"
-      ],
-      "generators": [
-        "./dist/generators.d.ts"
-      ]
-    }
-  },
+  "typesVersions": {},
   "files": [
     "src",
     "dist",
@@ -77,10 +54,9 @@
   ],
   "dependencies": {
     "@kubb/react-fabric": "0.15.1",
-    "@kubb/core": "5.0.0-alpha.23",
-    "@kubb/oas": "5.0.0-alpha.23",
-    "@kubb/plugin-oas": "5.0.0-alpha.23",
-    "@kubb/plugin-ts": "5.0.0-alpha.23"
+    "@kubb/ast": "5.0.0-alpha.24",
+    "@kubb/core": "5.0.0-alpha.24",
+    "@kubb/plugin-ts": "5.0.0-alpha.24"
   },
   "engines": {
     "node": ">=22"

package/src/components/Request.tsx

@@ -1,8 +1,9 @@
-import { URLPath } from '@internals/utils'
-import { type HttpMethod, isAllOptional, isOptional } from '@kubb/oas'
-import type { OperationSchemas } from '@kubb/plugin-oas'
-import { getPathParams } from '@kubb/plugin-oas/utils'
-import { File, Function, FunctionParams } from '@kubb/react-fabric'
+import { camelCase, URLPath } from '@internals/utils'
+import { caseParams, createFunctionParameter, createOperationParams, createTypeNode } from '@kubb/ast'
+import type { OperationNode } from '@kubb/ast/types'
+import type { ResolverTs } from '@kubb/plugin-ts'
+import { functionPrinter } from '@kubb/plugin-ts'
+import { File, Function } from '@kubb/react-fabric'
 import type { FabricReactNode } from '@kubb/react-fabric/types'
 import type { PluginCypress } from '../types.ts'
 
@@ -11,132 +12,114 @@ type Props = {
    * Name of the function
    */
   name: string
-  typeSchemas: OperationSchemas
-  url: string
+  /**
+   * AST operation node
+   */
+  node: OperationNode
+  /**
+   * TypeScript resolver for resolving param/data/response type names
+   */
+  resolver: ResolverTs
   baseURL: string | undefined
   dataReturnType: PluginCypress['resolvedOptions']['dataReturnType']
   paramsCasing: PluginCypress['resolvedOptions']['paramsCasing']
   paramsType: PluginCypress['resolvedOptions']['paramsType']
   pathParamsType: PluginCypress['resolvedOptions']['pathParamsType']
-  method: HttpMethod
 }
 
-type GetParamsProps = {
-  paramsCasing: PluginCypress['resolvedOptions']['paramsCasing']
+const declarationPrinter = functionPrinter({ mode: 'declaration' })
+
+function getParams({
+  paramsType,
+  pathParamsType,
+  paramsCasing,
+  resolver,
+  node,
+}: {
   paramsType: PluginCypress['resolvedOptions']['paramsType']
   pathParamsType: PluginCypress['resolvedOptions']['pathParamsType']
-  typeSchemas: OperationSchemas
-}
-
-function getParams({ paramsType, paramsCasing, pathParamsType, typeSchemas }: GetParamsProps) {
-  if (paramsType === 'object') {
-    const pathParams = getPathParams(typeSchemas.pathParams, { typed: true, casing: paramsCasing })
-
-    return FunctionParams.factory({
-      data: {
-        mode: 'object',
-        children: {
-          ...pathParams,
-          data: typeSchemas.request?.name
-            ? {
-                type: typeSchemas.request?.name,
-                optional: isOptional(typeSchemas.request?.schema),
-              }
-            : undefined,
-          params: typeSchemas.queryParams?.name
-            ? {
-                type: typeSchemas.queryParams?.name,
-                optional: isOptional(typeSchemas.queryParams?.schema),
-              }
-            : undefined,
-          headers: typeSchemas.headerParams?.name
-            ? {
-                type: typeSchemas.headerParams?.name,
-                optional: isOptional(typeSchemas.headerParams?.schema),
-              }
-            : undefined,
-        },
-      },
-      options: {
-        type: 'Partial<Cypress.RequestOptions>',
-        default: '{}',
-      },
-    })
-  }
-
-  return FunctionParams.factory({
-    pathParams: typeSchemas.pathParams?.name
-      ? {
-          mode: pathParamsType === 'object' ? 'object' : 'inlineSpread',
-          children: getPathParams(typeSchemas.pathParams, { typed: true, casing: paramsCasing }),
-          default: isAllOptional(typeSchemas.pathParams?.schema) ? '{}' : undefined,
-        }
-      : undefined,
-    data: typeSchemas.request?.name
-      ? {
-          type: typeSchemas.request?.name,
-          optional: isOptional(typeSchemas.request?.schema),
-        }
-      : undefined,
-    params: typeSchemas.queryParams?.name
-      ? {
-          type: typeSchemas.queryParams?.name,
-          optional: isOptional(typeSchemas.queryParams?.schema),
-        }
-      : undefined,
-    headers: typeSchemas.headerParams?.name
-      ? {
-          type: typeSchemas.headerParams?.name,
-          optional: isOptional(typeSchemas.headerParams?.schema),
-        }
-      : undefined,
-    options: {
-      type: 'Partial<Cypress.RequestOptions>',
-      default: '{}',
-    },
+  paramsCasing: PluginCypress['resolvedOptions']['paramsCasing']
+  resolver: ResolverTs
+  node: OperationNode
+}): string {
+  const paramsNode = createOperationParams(node, {
+    paramsType,
+    pathParamsType,
+    paramsCasing,
+    resolver,
+    extraParams: [
+      createFunctionParameter({ name: 'options', type: createTypeNode({ variant: 'reference', name: 'Partial<Cypress.RequestOptions>' }), default: '{}' }),
+    ],
   })
-}
 
-export function Request({ baseURL = '', name, dataReturnType, typeSchemas, url, method, paramsType, paramsCasing, pathParamsType }: Props): FabricReactNode {
-  const path = new URLPath(url, { casing: paramsCasing })
-
-  const params = getParams({ paramsType, paramsCasing, pathParamsType, typeSchemas })
+  return declarationPrinter.print(paramsNode) ?? ''
+}
 
-  const returnType =
-    dataReturnType === 'data' ? `Cypress.Chainable<${typeSchemas.response.name}>` : `Cypress.Chainable<Cypress.Response<${typeSchemas.response.name}>>`
+export function Request({ baseURL = '', name, dataReturnType, resolver, node, paramsType, pathParamsType, paramsCasing }: Props): FabricReactNode {
+  const paramsSignature = getParams({ paramsType, pathParamsType, paramsCasing, resolver, node })
 
-  // Build the URL template string - this will convert /pets/:petId to /pets/${petId}
-  const urlTemplate = path.toTemplateString({ prefix: baseURL })
+  const responseType = resolver.resolveResponseName(node)
+  const returnType = dataReturnType === 'data' ? `Cypress.Chainable<${responseType}>` : `Cypress.Chainable<Cypress.Response<${responseType}>>`
 
-  // Build request options object
-  const requestOptions: string[] = [`method: '${method}'`, `url: ${urlTemplate}`]
+  const casedPathParams = caseParams(
+    node.parameters.filter((p) => p.in === 'path'),
+    paramsCasing,
+  )
+  // Build a lookup keyed by camelCase-normalized name so that path-template names
+  // (e.g. `{pet_id}`) correctly resolve to the function-parameter name (`petId`)
+  // even when the OpenAPI spec has inconsistent casing between the two.
+  const pathParamNameMap = new Map(casedPathParams.map((p) => [camelCase(p.name), p.name]))
+
+  const urlPath = new URLPath(node.path, { casing: paramsCasing })
+  const urlTemplate = urlPath.toTemplateString({
+    prefix: baseURL,
+    replacer: (param) => pathParamNameMap.get(camelCase(param)) ?? param,
+  })
 
-  // Add query params if they exist
-  if (typeSchemas.queryParams?.name) {
-    requestOptions.push('qs: params')
+  const requestOptions: string[] = [`method: '${node.method}'`, `url: ${urlTemplate}`]
+
+  const queryParams = node.parameters.filter((p) => p.in === 'query')
+  if (queryParams.length > 0) {
+    const casedQueryParams = caseParams(queryParams, paramsCasing)
+    // When paramsCasing renames query params (e.g. page_size → pageSize), we must remap
+    // the camelCase keys back to the original API names before passing them to `qs`.
+    const needsQsTransform = casedQueryParams.some((p, i) => p.name !== queryParams[i]!.name)
+    if (needsQsTransform) {
+      const pairs = queryParams.map((orig, i) => `${orig.name}: params.${casedQueryParams[i]!.name}`).join(', ')
+      requestOptions.push(`qs: params ? { ${pairs} } : undefined`)
+    } else {
+      requestOptions.push('qs: params')
+    }
   }
 
-  // Add headers if they exist
-  if (typeSchemas.headerParams?.name) {
-    requestOptions.push('headers')
+  const headerParams = node.parameters.filter((p) => p.in === 'header')
+  if (headerParams.length > 0) {
+    const casedHeaderParams = caseParams(headerParams, paramsCasing)
+    // When paramsCasing renames header params (e.g. x-api-key → xApiKey), we must remap
+    // the camelCase keys back to the original API names before passing them to `headers`.
+    const needsHeaderTransform = casedHeaderParams.some((p, i) => p.name !== headerParams[i]!.name)
+    if (needsHeaderTransform) {
+      const pairs = headerParams.map((orig, i) => `'${orig.name}': headers.${casedHeaderParams[i]!.name}`).join(', ')
+      requestOptions.push(`headers: headers ? { ${pairs} } : undefined`)
+    } else {
+      requestOptions.push('headers')
+    }
   }
 
-  // Add body if request schema exists
-  if (typeSchemas.request?.name) {
+  if (node.requestBody?.schema) {
     requestOptions.push('body: data')
   }
 
-  // Spread additional Cypress options
   requestOptions.push('...options')
 
   return (
     <File.Source name={name} isIndexable isExportable>
-      <Function name={name} export params={params.toConstructor()} returnType={returnType}>
+      <Function name={name} export params={paramsSignature} returnType={returnType}>
         {dataReturnType === 'data'
-          ? `return cy.request<${typeSchemas.response.name}>({
+          ? `return cy.request<${responseType}>({
   ${requestOptions.join(',\n  ')}
 }).then((res) => res.body)`
-          : `return cy.request<${typeSchemas.response.name}>({
+          : `return cy.request<${responseType}>({
   ${requestOptions.join(',\n  ')}
 })`}
       </Function>

package/src/generators/cypressGenerator.tsx

@@ -1,64 +1,76 @@
-import { useDriver } from '@kubb/core/hooks'
-import { createReactGenerator } from '@kubb/plugin-oas/generators'
-import { useOas, useOperationManager } from '@kubb/plugin-oas/hooks'
-import { getBanner, getFooter } from '@kubb/plugin-oas/utils'
+import path from 'node:path'
+import { caseParams } from '@kubb/ast'
+import { defineGenerator } from '@kubb/core'
+import type { PluginTs } from '@kubb/plugin-ts'
 import { pluginTsName } from '@kubb/plugin-ts'
 import { File } from '@kubb/react-fabric'
-import { Request } from '../components'
-import type { PluginCypress } from '../types'
+import { Request } from '../components/Request.tsx'
+import type { PluginCypress } from '../types.ts'
 
-export const cypressGenerator = createReactGenerator<PluginCypress>({
+export const cypressGenerator = defineGenerator<PluginCypress>({
   name: 'cypress',
-  Operation({ operation, generator, plugin }) {
-    const {
-      options: { output, baseURL, dataReturnType, paramsCasing, paramsType, pathParamsType },
-    } = plugin
-    const driver = useDriver()
+  type: 'react',
+  Operation({ node, adapter, options, config, driver, resolver }) {
+    const { output, baseURL, dataReturnType, paramsCasing, paramsType, pathParamsType, group } = options
+    const root = path.resolve(config.root, config.output.path)
 
-    const oas = useOas()
-    const { getSchemas, getName, getFile } = useOperationManager(generator)
+    const pluginTs = driver.getPlugin<PluginTs>(pluginTsName)
 
-    const request = {
-      name: getName(operation, { type: 'function' }),
-      file: getFile(operation),
+    if (!pluginTs) {
+      return null
     }
 
-    const type = {
-      file: getFile(operation, { pluginName: pluginTsName }),
-      schemas: getSchemas(operation, { pluginName: pluginTsName, type: 'type' }),
-    }
+    const file = resolver.resolveFile({ name: node.operationId, extname: '.ts', tag: node.tags[0] ?? 'default', path: node.path }, { root, output, group })
+    const tsFile = pluginTs.resolver.resolveFile(
+      { name: node.operationId, extname: '.ts', tag: node.tags[0] ?? 'default', path: node.path },
+      {
+        root,
+        output: pluginTs.options?.output ?? output,
+        group: pluginTs.options?.group,
+      },
+    )
+
+    const name = resolver.resolveName(node.operationId)
+
+    const casedParams = caseParams(node.parameters, paramsCasing)
+    const tsResolver = pluginTs.resolver
+
+    const pathParams = casedParams.filter((p) => p.in === 'path')
+    const queryParams = casedParams.filter((p) => p.in === 'query')
+    const headerParams = casedParams.filter((p) => p.in === 'header')
+
+    const importedTypeNames = [
+      ...(pathParams.length && tsResolver.resolvePathParamsName
+        ? pathParams.map((p) => tsResolver.resolvePathParamsName!(node, p))
+        : pathParams.map((p) => tsResolver.resolveParamName(node, p))),
+      ...(queryParams.length && tsResolver.resolveQueryParamsName
+        ? queryParams.map((p) => tsResolver.resolveQueryParamsName!(node, p))
+        : queryParams.map((p) => tsResolver.resolveParamName(node, p))),
+      ...(headerParams.length && tsResolver.resolveHeaderParamsName
+        ? headerParams.map((p) => tsResolver.resolveHeaderParamsName!(node, p))
+        : headerParams.map((p) => tsResolver.resolveParamName(node, p))),
+      node.requestBody?.schema ? tsResolver.resolveDataName(node) : undefined,
+      tsResolver.resolveResponseName(node),
+    ].filter(Boolean)
 
     return (
       <File
-        baseName={request.file.baseName}
-        path={request.file.path}
-        meta={request.file.meta}
-        banner={getBanner({ oas, output, config: driver.config })}
-        footer={getFooter({ oas, output })}
+        baseName={file.baseName}
+        path={file.path}
+        meta={file.meta}
+        banner={resolver.resolveBanner(adapter.rootNode, { output, config })}
+        footer={resolver.resolveFooter(adapter.rootNode, { output, config })}
       >
-        <File.Import
-          name={[
-            type.schemas.request?.name,
-            type.schemas.response.name,
-            type.schemas.pathParams?.name,
-            type.schemas.queryParams?.name,
-            type.schemas.headerParams?.name,
-            ...(type.schemas.statusCodes?.map((item) => item.name) || []),
-          ].filter(Boolean)}
-          root={request.file.path}
-          path={type.file.path}
-          isTypeOnly
-        />
+        {tsFile && importedTypeNames.length > 0 && <File.Import name={Array.from(new Set(importedTypeNames))} root={file.path} path={tsFile.path} isTypeOnly />}
         <Request
-          name={request.name}
+          name={name}
+          node={node}
+          resolver={tsResolver}
           dataReturnType={dataReturnType}
           paramsCasing={paramsCasing}
           paramsType={paramsType}
           pathParamsType={pathParamsType}
-          typeSchemas={type.schemas}
-          method={operation.method}
           baseURL={baseURL}
-          url={operation.path}
         />
       </File>
     )

package/src/index.ts

@@ -1,2 +1,9 @@
+export { Request } from './components/Request.tsx'
+
+export { cypressGenerator } from './generators/cypressGenerator.tsx'
+
 export { pluginCypress, pluginCypressName } from './plugin.ts'
-export type { PluginCypress } from './types.ts'
+
+export { resolverCypress } from './resolvers/resolverCypress.ts'
+
+export type { PluginCypress, ResolverCypress } from './types.ts'

package/src/plugin.ts

@@ -1,13 +1,34 @@
 import path from 'node:path'
 import { camelCase } from '@internals/utils'
-import { createPlugin, type Group, getBarrelFiles, getMode } from '@kubb/core'
-import { OperationGenerator, pluginOasName } from '@kubb/plugin-oas'
+import { walk } from '@kubb/ast'
+import { createPlugin, type Group, getBarrelFiles, getPreset, renderOperation } from '@kubb/core'
 import { pluginTsName } from '@kubb/plugin-ts'
-import { cypressGenerator } from './generators'
+import { presets } from './presets.ts'
+import { resolverCypress } from './resolvers/resolverCypress.ts'
 import type { PluginCypress } from './types.ts'
 
+/**
+ * Canonical plugin name for `@kubb/plugin-cypress`, used to identify the plugin
+ * in driver lookups and warnings.
+ */
 export const pluginCypressName = 'plugin-cypress' satisfies PluginCypress['name']
 
+/**
+ * The `@kubb/plugin-cypress` plugin factory.
+ *
+ * Generates Cypress `cy.request()` test functions from an OpenAPI/AST `RootNode`.
+ * Walks operations, delegates rendering to the active generators,
+ * and writes barrel files based on `output.barrelType`.
+ *
+ * @example
+ * ```ts
+ * import { pluginCypress } from '@kubb/plugin-cypress'
+ *
+ * export default defineConfig({
+ *   plugins: [pluginCypress({ output: { path: 'cypress' } })],
+ * })
+ * ```
+ */
 export const pluginCypress = createPlugin<PluginCypress>((options) => {
   const {
     output = { path: 'cypress', barrelType: 'named' },
@@ -16,94 +37,97 @@ export const pluginCypress = createPlugin<PluginCypress>((options) => {
     exclude = [],
     include,
     override = [],
-    transformers = {},
-    generators = [cypressGenerator].filter(Boolean),
-    contentType,
     baseURL,
     paramsCasing,
     paramsType = 'inline',
     pathParamsType = paramsType === 'object' ? 'object' : options.pathParamsType || 'inline',
+    compatibilityPreset = 'default',
+    resolvers: userResolvers = [],
+    transformers: userTransformers = [],
+    generators: userGenerators = [],
   } = options
 
+  const preset = getPreset({
+    preset: compatibilityPreset,
+    presets,
+    resolvers: [resolverCypress, ...userResolvers],
+    transformers: userTransformers,
+    generators: userGenerators,
+  })
+
   return {
     name: pluginCypressName,
-    options: {
-      output,
-      dataReturnType,
-      group,
-      baseURL,
-
-      paramsCasing,
-      paramsType,
-      pathParamsType,
+    get resolver() {
+      return preset.resolver
     },
-    pre: [pluginOasName, pluginTsName].filter(Boolean),
-    resolvePath(baseName, pathMode, options) {
-      const root = path.resolve(this.config.root, this.config.output.path)
-      const mode = pathMode ?? getMode(path.resolve(root, output.path))
-
-      if (mode === 'single') {
-        /**
-         * when output is a file then we will always append to the same file(output file), see fileManager.addOrAppend
-         * Other plugins then need to call addOrAppend instead of just add from the fileManager class
-         */
-        return path.resolve(root, output.path)
+    get options() {
+      return {
+        output,
+        dataReturnType,
+        group: group
+          ? ({
+              ...options.group,
+              name: options.group?.name
+                ? options.group.name
+                : (ctx: { group: string }) => {
+                    if (group.type === 'path') {
+                      return `${ctx.group.split('/')[1]}`
+                    }
+                    return `${camelCase(ctx.group)}Requests`
+                  },
+            } as Group)
+          : undefined,
+        baseURL,
+        paramsCasing,
+        paramsType,
+        pathParamsType,
+        resolver: preset.resolver,
+        transformers: preset.transformers,
       }
+    },
+    pre: [pluginTsName].filter(Boolean),
+    async install() {
+      const { config, fabric, plugin, adapter, rootNode, driver } = this
+      const root = path.resolve(config.root, config.output.path)
+      const resolver = preset.resolver
 
-      if (group && (options?.group?.path || options?.group?.tag)) {
-        const groupName: Group['name'] = group?.name
-          ? group.name
-          : (ctx) => {
-              if (group?.type === 'path') {
-                return `${ctx.group.split('/')[1]}`
-              }
-              return `${camelCase(ctx.group)}Requests`
-            }
-
-        return path.resolve(
-          root,
-          output.path,
-          groupName({
-            group: group.type === 'path' ? options.group.path! : options.group.tag!,
-          }),
-          baseName,
-        )
+      if (!adapter) {
+        throw new Error('Plugin cannot work without adapter being set')
       }
 
-      return path.resolve(root, output.path, baseName)
-    },
-    resolveName(name, type) {
-      const resolvedName = camelCase(name, {
-        isFile: type === 'file',
-      })
+      await walk(rootNode, {
+        depth: 'shallow',
+        async operation(operationNode) {
+          const writeTasks = preset.generators.map(async (generator) => {
+            if (generator.type === 'react' && generator.version === '2') {
+              const resolvedOptions = resolver.resolveOptions(operationNode, {
+                options: plugin.options,
+                exclude,
+                include,
+                override,
+              })
 
-      if (type) {
-        return transformers?.name?.(resolvedName, type) || resolvedName
-      }
+              if (resolvedOptions === null) {
+                return
+              }
 
-      return resolvedName
-    },
-    async install() {
-      const root = path.resolve(this.config.root, this.config.output.path)
-      const mode = getMode(path.resolve(root, output.path))
-      const oas = await this.getOas()
+              await renderOperation(operationNode, {
+                options: resolvedOptions,
+                adapter,
+                config,
+                fabric,
+                Component: generator.Operation,
+                plugin,
+                driver,
+                resolver,
+              })
+            }
+          })
 
-      const operationGenerator = new OperationGenerator(this.plugin.options, {
-        fabric: this.fabric,
-        oas,
-        driver: this.driver,
-        events: this.events,
-        plugin: this.plugin,
-        contentType,
-        exclude,
-        include,
-        override,
-        mode,
+          await Promise.all(writeTasks)
+        },
       })
 
-      const files = await operationGenerator.build(...generators)
-      await this.upsertFile(...files)
-
       const barrelFiles = await getBarrelFiles(this.fabric.files, {
         type: output.barrelType ?? 'named',
         root,

package/src/presets.ts

@@ -0,0 +1,23 @@
+import { definePresets } from '@kubb/core'
+import { cypressGenerator } from './generators/cypressGenerator.tsx'
+import { resolverCypress } from './resolvers/resolverCypress.ts'
+import type { ResolverCypress } from './types.ts'
+
+/**
+ * Built-in preset registry for `@kubb/plugin-cypress`.
+ *
+ * - `default` — uses `resolverCypress` and `cypressGenerator`.
+ * - `kubbV4`  — uses `resolverCypress` and `cypressGenerator`.
+ */
+export const presets = definePresets<ResolverCypress>({
+  default: {
+    name: 'default',
+    resolvers: [resolverCypress],
+    generators: [cypressGenerator],
+  },
+  kubbV4: {
+    name: 'kubbV4',
+    resolvers: [resolverCypress],
+    generators: [cypressGenerator],
+  },
+})