Step CIを利用して、API Testingを自動生成する

Posted at 2024-10-21

Step CIを利用して、API Testingを自動生成する

Open-source API Test Automation framework
Security. Performance. Load Testing

Step CIは、自動API TestのOpen Source Libraryです。
workflow.ymlに記載したテストケースを利用して、自動API Testを実施していきます。
Test Generator(Importing)などですでにある、OpenAPI, Postman, Insomniaからテストコードの自動生成もすることができます。

個人的には、jestなどのIntegrationとして扱ったり、QAチームの人と一緒に対応していくと、コードの資産化がしやすくなります。
Playwrightとも併用が可能なので、Playwrightがおすすめです。

0. before do

0-0. Project Structure

想定しているディレクトリ構成とファイルの中身

tree . -I node_modules
.
├── README.md
├── compose.yaml
├── dockerfile
├── openapi3
│   ├── generated
│   │   └── @typespec
│   │       └── openapi3
│   │           └── openapi.yaml
├── package-lock.json
├── package.json

compose.yaml

services:
  http_schema_container:
    container_name: http_schema_container
    build:
      context: .
      dockerfile: dockerfile
    tty: true
    restart: always
    volumes:
      - .:/usr/src/app

dockerfile

FROM node:23-alpine3.19

WORKDIR /usr/src/app

openapi3/generated/@typespec/openapi3/openapi.yaml

openapi: 3.0.0
info:
  title: (title)
  version: 0.0.0
tags: []
paths:
  /pets:
    get:
      operationId: Pets_list
      parameters:
        - name: filter
          in: query
          required: true
          schema:
            type: string
          explode: false
      responses:
        '200':
          description: The request has succeeded.
          content:
            application/json:
              schema:
                type: array
                items:
                  $ref: '#/components/schemas/Pet'
    post:
      operationId: Pets_create
      parameters: []
      responses:
        '200':
          description: The request has succeeded.
          content:
            application/json:
              schema:
                $ref: '#/components/schemas/Pet'
      requestBody:
        required: true
        content:
          application/json:
            schema:
              $ref: '#/components/schemas/Pet'
  /pets/{id}:
    get:
      operationId: Pets_read
      parameters:
        - name: id
          in: path
          required: true
          schema:
            type: string
      responses:
        '200':
          description: The request has succeeded.
          content:
            application/json:
              schema:
                $ref: '#/components/schemas/Pet'
  /stores:
    get:
      operationId: Stores_list
      parameters:
        - name: filter
          in: query
          required: true
          schema:
            type: string
          explode: false
      responses:
        '200':
          description: The request has succeeded.
          content:
            application/json:
              schema:
                type: array
                items:
                  $ref: '#/components/schemas/Store'
  /stores/{id}:
    get:
      operationId: Stores_read
      parameters:
        - name: id
          in: path
          required: true
          schema:
            type: string
      responses:
        '200':
          description: The request has succeeded.
          content:
            application/json:
              schema:
                $ref: '#/components/schemas/Store'
components:
  schemas:
    Address:
      type: object
      required:
        - street
        - city
      properties:
        street:
          type: string
        city:
          type: string
    Pet:
      type: object
      required:
        - name
        - age
      properties:
        name:
          type: string
        age:
          type: integer
          format: int32
    Store:
      type: object
      required:
        - name
        - address
      properties:
        name:
          type: string
        address:
          $ref: '#/components/schemas/Address'

0-1. typespec を利用して、OpenAPIのコードを生成する

tree . -I node_modules
.
├── README.md
├── compose.yaml
├── dockerfile
├── openapi3
│   ├── generated
│   │   └── @typespec
│   │       └── openapi3
│   │           └── openapi.yaml
│   ├── main.tsp
│   └── tspconfig.yaml
├── package-lock.json
├── package.json

openapi3/main.tsp

import "@typespec/http";

using TypeSpec.Http;

model Pet {
  name: string;
  age: int32;
}

model Store {
  name: string;
  address: Address;
}

model Address {
  street: string;
  city: string;
}

@route("/pets")
interface Pets {
  list(@query filter: string): Pet[];
  create(@body pet: Pet): Pet;
  read(@path id: string): Pet;
}

@route("/stores")
interface Stores {
  list(@query filter: string): Store[];
  read(@path id: string): Store;
}

openapi3/tspconfig.yaml

warn-as-error: true                           # Treat warnings as errors
output-dir: "{cwd}/openapi3/generated"       # Configure the base output directory for all emitters
emit:
  - "@typespec/openapi3"

1. Step CIの依存関係を設定する

% npm install stepci

package.json

"scripts": {
    "cli:stepci": "stepci"
}

2. OpenAPIファイルから、StepCIのAuto Testを追加する

package.json

"scripts": {
    "gen:test": "stepci generate ./openapi3/generated/@typespec/openapi3/openapi.yaml ./test/gen/workflow.yml",
}

% mkdir -p test/gen
% npm run gen:test
> app@0.1.0 gen:test
> stepci generate ./openapi3/generated/@typespec/openapi3/openapi.yaml ./workflow.yml

tree . -I node_modules
.
├── README.md
├── compose.yaml
├── dockerfile
├── openapi3
│   ├── generated
│   │   └── @typespec
│   │       └── openapi3
│   │           └── openapi.yaml
│   ├── main.tsp
│   └── tspconfig.yaml
├── package-lock.json
├── package.json
└── test
    └── gen
        └── workflow.yml

test/gen/workflow.yml

version: "1.0"
name: (title)
config:
  http: {}
tests:
  default:
    name: Default
    steps:
      - id: Pets_list
        http:
          url: /pets
          method: GET
          params:
            filter: sunt ex
          check:
            status: 200
            schema:
              type: array
              items:
                $ref: "#/components/schemas/Pet"
      - id: Pets_create
        http:
          url: /pets
          method: POST
          headers:
            Content-Type: application/json
            accept: application/json
          json:
            name: irure ex
            age: -971456
          check:
            status: 200
            schema:
              $ref: "#/components/schemas/Pet"
      - id: Pets_read
        http:
          url: /pets/aliqua Excepteur
          method: GET
          check:
            status: 200
            schema:
              $ref: "#/components/schemas/Pet"
      - id: Stores_list
        http:
          url: /stores
          method: GET
          params:
            filter: dolore consectetur
          check:
            status: 200
            schema:
              type: array
              items:
                $ref: "#/components/schemas/Store"
      - id: Stores_read
        http:
          url: /stores/sed dolor non consectetur incididunt
          method: GET
          check:
            status: 200
            schema:
              $ref: "#/components/schemas/Store"
components:
  schemas:
    Address:
      type: object
      required:
        - street
        - city
      properties:
        street:
          type: string
        city:
          type: string
    Pet:
      type: object
      required:
        - name
        - age
      properties:
        name:
          type: string
        age:
          type: integer
          format: int32
    Store:
      type: object
      required:
        - name
        - address
      properties:
        name:
          type: string
        address:
          $ref: "#/components/schemas/Address"

You get articles that match your needs
You can efficiently read back useful information
You can use dark theme

What you can do with signing up