acrylblends 0.6.3 → 0.7.0

package/plugins/acryl-router/src/core/client/client.test.ts

@@ -1,2313 +0,0 @@
-/* eslint-disable @typescript-eslint/no-unused-vars */
-
-/* eslint-disable @typescript-eslint/ban-ts-comment */
-import { HttpResponse, http } from 'msw'
-import { setupServer } from 'msw/node'
-import { expectTypeOf, vi } from 'vitest'
-import { defineWebSocketHelper } from '../helper/websocket/index.ts'
-import { Acryl } from '../app.ts'
-import { parse } from '../utils/cookie.ts'
-import type { Equal, Expect, JSONValue, SimplifyDeepArray } from '../utils/types.ts'
-import { validator } from '../validator/index.ts'
-import { hc } from './client.ts'
-import type {
-  ClientResponse,
-  InferRequestType,
-  InferResponseType,
-  ApplyGlobalResponse,
-  PickResponseByStatusCode,
-} from './types.ts'
-
-// The Deno adapter is not part of ACRYL; these tests only build client URLs, so a helper that never upgrades stands in for it.
-const upgradeWebSocket = defineWebSocketHelper(async () => {})
-
-class SafeBigInt {
-  unsafe = BigInt(42)
-
-  toJSON() {
-    return {
-      value: '42n',
-    }
-  }
-}
-
-describe('Basic - JSON', () => {
-  const app = new Acryl()
-
-  const route = app
-    .post(
-      '/posts',
-      validator('cookie', () => {
-        return {} as {
-          debug: string
-        }
-      }),
-      validator('header', () => {
-        return {} as {
-          'x-message': string
-        }
-      }),
-      validator('json', () => {
-        return {} as {
-          id: number
-          title: string
-        }
-      }),
-      (c) => {
-        return c.json({
-          success: true,
-          message: 'dummy',
-          requestContentType: 'dummy',
-          requestAcryl: 'dummy',
-          requestMessage: 'dummy',
-          requestBody: {
-            id: 123,
-            title: 'dummy',
-          },
-        })
-      }
-    )
-    .get('/hello-not-found', (c) => c.notFound())
-    .get('/null', (c) => c.json(null))
-    .get('/empty', (c) => c.json({}))
-    .get('/bigint', (c) => c.json({ value: BigInt(42) }))
-    .get('/safe-bigint', (c) => c.json(new SafeBigInt()))
-
-  type AppType = typeof route
-
-  const server = setupServer(
-    http.post('http://localhost/posts', async ({ request }) => {
-      const requestContentType = request.headers.get('content-type')
-      const requestAcryl = request.headers.get('x-acryl')
-      const requestMessage = request.headers.get('x-message')
-      const requestBody = await request.json()
-      const payload = {
-        message: 'Hello!',
-        success: true,
-        requestContentType,
-        requestAcryl,
-        requestMessage,
-        requestBody,
-      }
-      return HttpResponse.json(payload)
-    }),
-    http.get('http://localhost/hello-not-found', () => {
-      return HttpResponse.text(null, {
-        status: 404,
-      })
-    }),
-    http.get('http://localhost/null', () => {
-      return HttpResponse.json(null)
-    }),
-    http.get('http://localhost/empty', () => {
-      return HttpResponse.json({})
-    }),
-    http.get('http://localhost/bigint', () => {
-      return HttpResponse.json({ value: BigInt(42) })
-    }),
-    http.get('http://localhost/safe-bigint', () => {
-      return HttpResponse.json(new SafeBigInt())
-    }),
-    http.get('http://localhost/api/string', () => {
-      return HttpResponse.json('a-string')
-    }),
-    http.get('http://localhost/api/number', async () => {
-      return HttpResponse.json(37)
-    }),
-    http.get('http://localhost/api/boolean', async () => {
-      return HttpResponse.json(true)
-    }),
-    http.get('http://localhost/api/generic', async () => {
-      return HttpResponse.json(Math.random() > 0.5 ? Boolean(Math.random()) : Math.random())
-    })
-  )
-
-  beforeAll(() => server.listen())
-  afterEach(() => server.resetHandlers())
-  afterAll(() => server.close())
-
-  const payload = {
-    id: 123,
-    title: 'Hello! Acryl!',
-  }
-
-  const client = hc<AppType>('http://localhost', { headers: { 'x-acryl': 'acryl' } })
-
-  it('Should get 200 response', async () => {
-    const res = await client.posts.$post(
-      {
-        json: payload,
-        header: {
-          'x-message': 'foobar',
-        },
-        cookie: {
-          debug: 'true',
-        },
-      },
-      {}
-    )
-
-    expect(res.ok).toBe(true)
-    const data = await res.json()
-    expect(data.success).toBe(true)
-    expect(data.message).toBe('Hello!')
-    expect(data.requestContentType).toBe('application/json')
-    expect(data.requestAcryl).toBe('acryl')
-    expect(data.requestMessage).toBe('foobar')
-    expect(data.requestBody).toEqual(payload)
-  })
-
-  it('Should get 404 response', async () => {
-    const res = await client['hello-not-found'].$get()
-    expect(res.status).toBe(404)
-  })
-
-  it('Should get a `null` content', async () => {
-    const client = hc<AppType>('http://localhost')
-    const res = await client.null.$get()
-    const data = await res.json()
-    expectTypeOf(data).toMatchTypeOf<null>()
-    expect(data).toBe(null)
-  })
-
-  it('Should get a `{}` content', async () => {
-    const client = hc<AppType>('http://localhost')
-    const res = await client.empty.$get()
-    const data = await res.json()
-    expectTypeOf(data).toMatchTypeOf<{}>()
-    expect(data).toStrictEqual({})
-  })
-
-  it('Should get a `{}` content', async () => {
-    const client = hc<AppType>('http://localhost')
-    const res = await client['safe-bigint'].$get()
-    const data = await res.json()
-    expectTypeOf(data).toMatchTypeOf<{ value: string }>()
-    expect(data).toStrictEqual({ value: '42n' })
-  })
-
-  it('Should get an error response', async () => {
-    const client = hc<AppType>('http://localhost')
-    const res = await client.bigint.$get()
-    const data = await res.json()
-    expectTypeOf(data).toMatchTypeOf<never>()
-    expect(res.status).toBe(500)
-    expect(data).toMatchObject({
-      message: 'Do not know how to serialize a BigInt',
-      name: 'TypeError',
-    })
-  })
-
-  it('Should have correct types - primitives', async () => {
-    const app = new Acryl()
-    const route = app
-      .get('/api/string', (c) => c.json('a-string'))
-      .get('/api/number', (c) => c.json(37))
-      .get('/api/boolean', (c) => c.json(true))
-      .get('/api/generic', (c) =>
-        c.json(Math.random() > 0.5 ? Boolean(Math.random()) : Math.random())
-      )
-    type AppType = typeof route
-    const client = hc<AppType>('http://localhost')
-    const stringFetch = await client.api.string.$get()
-    const stringRes = await stringFetch.json()
-    const numberFetch = await client.api.number.$get()
-    const numberRes = await numberFetch.json()
-    const booleanFetch = await client.api.boolean.$get()
-    const booleanRes = await booleanFetch.json()
-    const genericFetch = await client.api.generic.$get()
-    const genericRes = await genericFetch.json()
-    type stringVerify = Expect<Equal<'a-string', typeof stringRes>>
-    expect(stringRes).toBe('a-string')
-    type numberVerify = Expect<Equal<37, typeof numberRes>>
-    expect(numberRes).toBe(37)
-    type booleanVerify = Expect<Equal<true, typeof booleanRes>>
-    expect(booleanRes).toBe(true)
-    type genericVerify = Expect<Equal<number | boolean, typeof genericRes>>
-    expect(typeof genericRes === 'number' || typeof genericRes === 'boolean').toBe(true)
-
-    // using .text() on json endpoint should return string
-    type textTest = Expect<Equal<Promise<string>, ReturnType<typeof genericFetch.text>>>
-  })
-})
-
-describe('Basic - query, queries, form, path params, header and cookie', () => {
-  const app = new Acryl()
-
-  const route = app
-    .get(
-      '/search',
-      validator('query', () => {
-        return {} as { q: string; tag: string[]; filter: string }
-      }),
-      (c) => {
-        return c.json({
-          q: 'fake',
-          tag: ['fake'],
-          filter: 'fake',
-        })
-      }
-    )
-    .put(
-      '/posts/:id',
-      validator('form', () => {
-        return {
-          title: 'Hello',
-        }
-      }),
-      (c) => {
-        const data = c.req.valid('form')
-        return c.json(data)
-      }
-    )
-    .get(
-      '/header',
-      validator('header', () => {
-        return {
-          'x-message-id': 'Hello',
-        }
-      }),
-      (c) => {
-        const data = c.req.valid('header')
-        return c.json(data)
-      }
-    )
-    .get(
-      '/cookie',
-      validator('cookie', () => {
-        return {
-          hello: 'world',
-          goodbye: 'moon',
-        }
-      }),
-      (c) => {
-        const data = c.req.valid('cookie')
-        return c.json(data)
-      }
-    )
-
-  const server = setupServer(
-    http.get('http://localhost/api/search', ({ request }) => {
-      const url = new URL(request.url)
-      const query = url.searchParams.get('q')
-      const tag = url.searchParams.getAll('tag')
-      const filter = url.searchParams.get('filter')
-      return HttpResponse.json({
-        q: query,
-        tag,
-        filter,
-      })
-    }),
-    http.get('http://localhost/api/posts', ({ request }) => {
-      const url = new URL(request.url)
-      const tags = url.searchParams.getAll('tags')
-      return HttpResponse.json({
-        tags: tags,
-      })
-    }),
-    http.put('http://localhost/api/posts/123', async ({ request }) => {
-      const buffer = await request.arrayBuffer()
-      // @ts-ignore
-      const string = String.fromCharCode.apply('', new Uint8Array(buffer))
-      return HttpResponse.text(string)
-    }),
-    http.get('http://localhost/api/header', async ({ request }) => {
-      const message = await request.headers.get('x-message-id')
-      return HttpResponse.json({ 'x-message-id': message })
-    }),
-    http.get('http://localhost/api/cookie', async ({ request }) => {
-      return HttpResponse.json(parse(request.headers.get('cookie') || ''))
-    })
-  )
-
-  beforeAll(() => server.listen())
-  afterEach(() => server.resetHandlers())
-  afterAll(() => server.close())
-
-  type AppType = typeof route
-
-  const client = hc<AppType>('http://localhost/api')
-
-  it('Should get 200 response - query', async () => {
-    const res = await client.search.$get({
-      query: {
-        q: 'foobar',
-        tag: ['a', 'b'],
-        // @ts-expect-error
-        filter: undefined,
-      },
-    })
-
-    expect(res.status).toBe(200)
-    expect(await res.json()).toEqual({
-      q: 'foobar',
-      tag: ['a', 'b'],
-      filter: null,
-    })
-  })
-
-  it('Should get 200 response - form, params', async () => {
-    const res = await client.posts[':id'].$put({
-      form: {
-        title: 'Good Night',
-      },
-      param: {
-        id: '123',
-      },
-    })
-
-    expect(res.status).toBe(200)
-    expect(await res.text()).toMatch('Good Night')
-  })
-
-  it('Should get 200 response - header', async () => {
-    const header = {
-      'x-message-id': 'Hello',
-    }
-    const res = await client.header.$get({
-      header,
-    })
-
-    expect(res.status).toBe(200)
-    expect(await res.json()).toEqual(header)
-  })
-
-  it('Should get 200 response - cookie', async () => {
-    const cookie = {
-      hello: 'world',
-      goodbye: 'moon',
-    }
-    const res = await client.cookie.$get({
-      cookie,
-    })
-
-    expect(res.status).toBe(200)
-    expect(await res.json()).toEqual(cookie)
-  })
-})
-
-describe('Basic - $url()', () => {
-  const api = new Acryl().get('/', (c) => c.text('API')).get('/posts/:id', (c) => c.text('Post'))
-  const content = new Acryl().get(
-    '/search',
-    validator('query', () => {
-      return { page: '1', limit: '10' }
-    }),
-    (c) => c.text('Search')
-  )
-  const app = new Acryl()
-    .get('/', (c) => c.text('Index'))
-    .route('/api', api)
-    .route('/content', content)
-
-  it('Should return a correct url via $url().href', async () => {
-    const client = hc<typeof app>('http://fake')
-    expect(client.index.$url().href).toBe('http://fake/')
-    expect(
-      client.index.$url({
-        query: {
-          page: '123',
-          limit: '20',
-        },
-      }).href
-    ).toBe('http://fake/?page=123&limit=20')
-    expect(client.api.$url().href).toBe('http://fake/api')
-    expect(
-      client.api.posts[':id'].$url({
-        param: {
-          id: '123',
-        },
-      }).href
-    ).toBe('http://fake/api/posts/123')
-    expect(
-      client.content.search.$url({
-        query: {
-          page: '123',
-          limit: '20',
-        },
-      }).href
-    ).toBe('http://fake/content/search?page=123&limit=20')
-  })
-
-  it.each(['http://fake', 'http://fake/', 'http://fake//', 'http://fake/api'])(
-    'Should return a correct path via $path() regardless of %s',
-    async (baseURL) => {
-      const client = hc<typeof app>(baseURL)
-      expect(client.index.$path()).toBe('/')
-      expect(
-        client.index.$path({
-          query: {
-            page: '123',
-            limit: '20',
-          },
-        })
-      ).toBe('/?page=123&limit=20')
-      expect(client.api.$path()).toBe('/api')
-      expect(
-        client.api.posts[':id'].$path({
-          param: {
-            id: '123',
-          },
-        })
-      ).toBe('/api/posts/123')
-      expect(
-        client.content.search.$path({
-          query: {
-            page: '123',
-            limit: '20',
-          },
-        })
-      ).toBe('/content/search?page=123&limit=20')
-    }
-  )
-})
-
-describe('Form - Multiple Values', () => {
-  const server = setupServer(
-    http.post('http://localhost/multiple-values', async ({ request }) => {
-      const data = await request.formData()
-      return HttpResponse.json(data.getAll('key'))
-    })
-  )
-
-  beforeAll(() => server.listen())
-  afterEach(() => server.resetHandlers())
-  afterAll(() => server.close())
-
-  const client = hc('http://localhost/')
-
-  it('Should get 200 response - query', async () => {
-    // @ts-expect-error `client['multiple-values'].$post` is not typed
-    const res = await client['multiple-values'].$post({
-      form: {
-        key: ['foo', 'bar'],
-      },
-    })
-    expect(res.status).toBe(200)
-    expect(await res.json()).toEqual(['foo', 'bar'])
-  })
-})
-
-describe('Form - Undefined Values', () => {
-  const server = setupServer(
-    http.post('http://localhost/form-undefined', async ({ request }) => {
-      const data = await request.formData()
-      return HttpResponse.json({
-        keys: [...data.keys()],
-        title: data.get('title'),
-        optional: data.get('optional'),
-      })
-    })
-  )
-
-  beforeAll(() => server.listen())
-  afterEach(() => server.resetHandlers())
-  afterAll(() => server.close())
-
-  const client = hc('http://localhost/')
-
-  it('Should skip undefined values in form data', async () => {
-    // @ts-expect-error `client['form-undefined'].$post` is not typed
-    const res = await client['form-undefined'].$post({
-      form: {
-        title: 'Hello',
-        optional: undefined,
-      },
-    })
-    expect(res.status).toBe(200)
-    const json = await res.json()
-    expect(json).toEqual({
-      keys: ['title'],
-      title: 'Hello',
-      optional: null,
-    })
-  })
-})
-
-describe('Form arrays containing undefined', () => {
-  const app = new Acryl().post(
-    '/',
-    validator('form', () => ({}) as { tag: (string | undefined)[] | undefined }),
-    async (c) => {
-      const body = await c.req.parseBody({ all: true })
-      return c.json({ tag: body['tag'] })
-    }
-  )
-  const client = hc<typeof app>('', { fetch: app.request })
-
-  it('Should not send the literal string "undefined" for an absent entry', async () => {
-    const res = await client.index.$post({
-      form: {
-        tag: ['a', undefined, 'b'],
-      },
-    })
-    expect(res.status).toBe(200)
-    expect(await res.json()).toEqual({ tag: ['a', 'b'] })
-  })
-
-  it('Should keep an empty string in an array', async () => {
-    const res = await client.index.$post({
-      form: {
-        tag: ['a', '', 'b'],
-      },
-    })
-    expect(res.status).toBe(200)
-    expect(await res.json()).toEqual({ tag: ['a', '', 'b'] })
-  })
-})
-
-describe('Optional header and cookie values', () => {
-  const app = new Acryl().get(
-    '/',
-    validator('header', () => {
-      return {} as {
-        'x-required': string
-        'x-optional'?: string
-      }
-    }),
-    validator('cookie', () => {
-      return {} as {
-        required: string
-        optional?: string
-      }
-    }),
-    (c) =>
-      c.json({
-        requiredHeader: c.req.header('x-required'),
-        optionalHeader: c.req.header('x-optional') ?? null,
-        cookies: parse(c.req.header('cookie') ?? ''),
-      })
-  )
-  const client = hc<typeof app>('', { fetch: app.request })
-
-  it('Should skip undefined header and cookie values', async () => {
-    const res = await client.index.$get({
-      header: {
-        'x-required': 'header-value',
-        'x-optional': undefined,
-      },
-      cookie: {
-        required: 'cookie-value',
-        optional: undefined,
-      },
-    })
-
-    expect(res.status).toBe(200)
-    expect(await res.json()).toEqual({
-      requiredHeader: 'header-value',
-      optionalHeader: null,
-      cookies: {
-        required: 'cookie-value',
-      },
-    })
-  })
-
-  it('Should not send a Cookie header if all cookie values are undefined', async () => {
-    const app = new Acryl().get(
-      '/',
-      validator('cookie', () => {
-        return {} as {
-          optional?: string
-        }
-      }),
-      (c) => c.json({ cookieHeader: c.req.header('cookie') ?? null })
-    )
-    const client = hc<typeof app>('', { fetch: app.request })
-
-    const res = await client.index.$get({
-      cookie: {
-        optional: undefined,
-      },
-    })
-
-    expect(res.status).toBe(200)
-    expect(await res.json()).toEqual({ cookieHeader: null })
-  })
-})
-
-describe('Infer the response/request type', () => {
-  const app = new Acryl()
-  const route = app.get(
-    '/',
-    validator('query', () => {
-      return {
-        name: 'dummy',
-        age: 'dummy',
-      }
-    }),
-    validator('header', () => {
-      return {
-        'x-request-id': 'dummy',
-      }
-    }),
-    validator('cookie', () => {
-      return {
-        name: 'dummy',
-      }
-    }),
-    (c) =>
-      c.json({
-        id: 123,
-        title: 'Morning!',
-      })
-  )
-
-  type AppType = typeof route
-
-  it('Should infer response type the type correctly', () => {
-    const client = hc<AppType>('/')
-    const req = client.index.$get
-
-    type Actual = InferResponseType<typeof req>
-    type Expected = {
-      id: number
-      title: string
-    }
-    type verify = Expect<Equal<Expected, Actual>>
-  })
-
-  it('Should infer request type the type correctly', () => {
-    const client = hc<AppType>('/')
-    const req = client.index.$get
-
-    type Actual = InferRequestType<typeof req>
-    type Expected = {
-      age: string | string[]
-      name: string | string[]
-    }
-    type verify = Expect<Equal<Expected, Actual['query']>>
-  })
-
-  it('Should infer request header type the type correctly', () => {
-    const client = hc<AppType>('/')
-    const req = client.index.$get
-    type c = typeof req
-
-    type Actual = InferRequestType<c>
-    type Expected = {
-      'x-request-id': string
-    }
-    type verify = Expect<Equal<Expected, Actual['header']>>
-  })
-
-  it('Should infer request cookie type the type correctly', () => {
-    const client = hc<AppType>('/')
-    const req = client.index.$get
-    type c = typeof req
-
-    type Actual = InferRequestType<c>
-    type Expected = {
-      name: string
-    }
-    type verify = Expect<Equal<Expected, Actual['cookie']>>
-  })
-
-  describe('Without input', () => {
-    const route = app.get('/', (c) => c.json({ ok: true }))
-    type AppType = typeof route
-
-    it('Should infer response type the type correctly', () => {
-      const client = hc<AppType>('/')
-      const req = client.index.$get
-
-      type Actual = InferResponseType<typeof req>
-      type Expected = { ok: true }
-      type verify = Expect<Equal<Expected, Actual>>
-    })
-
-    it('Should infer request type the type correctly', () => {
-      const client = hc<AppType>('/')
-      const req = client.index.$get
-
-      type Actual = InferRequestType<typeof req>
-      type Expected = {}
-      type verify = Expect<Equal<Expected, Actual>>
-    })
-  })
-})
-
-describe('Merge path with `app.route()`', () => {
-  const server = setupServer(
-    http.get('http://localhost/api/search', async () => {
-      return HttpResponse.json({
-        ok: true,
-      })
-    }),
-    http.get('http://localhost/api/searchArray', async () => {
-      return HttpResponse.json([
-        {
-          ok: true,
-        },
-      ])
-    }),
-    http.get('http://localhost/api/foo', async () => {
-      return HttpResponse.json({
-        ok: true,
-      })
-    }),
-    http.post('http://localhost/api/bar', async () => {
-      return HttpResponse.json({
-        ok: true,
-      })
-    }),
-    http.get('http://localhost/v1/book', async () => {
-      return HttpResponse.json({
-        ok: true,
-      })
-    })
-  )
-
-  beforeAll(() => server.listen())
-  afterEach(() => server.resetHandlers())
-  afterAll(() => server.close())
-
-  type Env = {
-    Bindings: {
-      TOKEN: string
-    }
-  }
-
-  it('Should have correct types', async () => {
-    const api = new Acryl<Env>().get('/search', (c) => c.json({ ok: true }))
-    const app = new Acryl<Env>().route('/api', api)
-    type AppType = typeof app
-    const client = hc<AppType>('http://localhost')
-    const res = await client.api.search.$get()
-    const data = await res.json()
-    type verify = Expect<Equal<true, typeof data.ok>>
-    expect(data.ok).toBe(true)
-  })
-
-  it('Should have correct types - basePath() then get()', async () => {
-    const base = new Acryl<Env>().basePath('/api')
-    const app = base.get('/search', (c) => c.json({ ok: true }))
-    type AppType = typeof app
-    const client = hc<AppType>('http://localhost')
-    const res = await client.api.search.$get()
-    const data = await res.json()
-    type verify = Expect<Equal<true, typeof data.ok>>
-    expect(data.ok).toBe(true)
-  })
-
-  it('Should have correct types - basePath(), route(), get()', async () => {
-    const book = new Acryl().get('/', (c) => c.json({ ok: true }))
-    const app = new Acryl().basePath('/v1').route('/book', book)
-    type AppType = typeof app
-    const client = hc<AppType>('http://localhost')
-    const res = await client.v1.book.$get()
-    const data = await res.json()
-    type verify = Expect<Equal<true, typeof data.ok>>
-    expect(data.ok).toBe(true)
-  })
-
-  it('Should have correct types - with interface', async () => {
-    interface Result {
-      ok: boolean
-      okUndefined?: boolean
-    }
-    const result: Result = { ok: true }
-    const base = new Acryl<Env>().basePath('/api')
-    const app = base.get('/search', (c) => c.json(result))
-    type AppType = typeof app
-    const client = hc<AppType>('http://localhost')
-    const res = await client.api.search.$get()
-    const data = await res.json()
-    type verify = Expect<Equal<Result, typeof data>>
-    expect(data.ok).toBe(true)
-
-    // A few more types only tests
-    interface DeepInterface {
-      l2: {
-        l3: Result
-      }
-    }
-    interface ExtraDeepInterface {
-      l4: DeepInterface
-    }
-    type verifyDeepInterface = Expect<
-      Equal<SimplifyDeepArray<DeepInterface> extends JSONValue ? true : false, true>
-    >
-    type verifyExtraDeepInterface = Expect<
-      Equal<SimplifyDeepArray<ExtraDeepInterface> extends JSONValue ? true : false, true>
-    >
-  })
-
-  it('Should have correct types - with array of interfaces', async () => {
-    interface Result {
-      ok: boolean
-      okUndefined?: boolean
-    }
-    type Results = Result[]
-
-    const results: Results = [{ ok: true }]
-    const base = new Acryl<Env>().basePath('/api')
-    const app = base.get('/searchArray', (c) => c.json(results))
-    type AppType = typeof app
-    const client = hc<AppType>('http://localhost')
-    const res = await client.api.searchArray.$get()
-    const data = await res.json()
-    type verify = Expect<Equal<Results, typeof data>>
-    expect(data[0].ok).toBe(true)
-
-    // A few more types only tests
-    type verifyNestedArrayTyped = Expect<
-      Equal<SimplifyDeepArray<[string, Results]> extends JSONValue ? true : false, true>
-    >
-    type verifyNestedArrayInterfaceArray = Expect<
-      Equal<SimplifyDeepArray<[string, Result[]]> extends JSONValue ? true : false, true>
-    >
-    type verifyExtraNestedArrayTyped = Expect<
-      Equal<SimplifyDeepArray<[string, Results[]]> extends JSONValue ? true : false, true>
-    >
-    type verifyExtraNestedArrayInterfaceArray = Expect<
-      Equal<SimplifyDeepArray<[string, Result[][]]> extends JSONValue ? true : false, true>
-    >
-  })
-
-  it('Should allow a Date object and return it as a string', async () => {
-    const app = new Acryl()
-    const route = app.get('/api/foo', (c) => c.json({ datetime: new Date() }))
-    type AppType = typeof route
-    const client = hc<AppType>('http://localhost')
-    const res = await client.api.foo.$get()
-    const { datetime } = await res.json()
-    type verify = Expect<Equal<string, typeof datetime>>
-  })
-
-  describe('Multiple endpoints', () => {
-    const api = new Acryl()
-      .get('/foo', (c) => c.json({ foo: '' }))
-      .post('/bar', (c) => c.json({ bar: 0 }))
-    const app = new Acryl().route('/api', api)
-    type AppType = typeof app
-    const client = hc<typeof app>('http://localhost')
-
-    it('Should return correct types - GET /api/foo', async () => {
-      const res = await client.api.foo.$get()
-      const data = await res.json()
-      type verify = Expect<Equal<string, typeof data.foo>>
-    })
-
-    it('Should return correct types - POST /api/bar', async () => {
-      const res = await client.api.bar.$post()
-      const data = await res.json()
-      type verify = Expect<Equal<number, typeof data.bar>>
-    })
-    it('Should work with $url', async () => {
-      const url = client.api.bar.$url()
-      expect(url.href).toBe('http://localhost/api/bar')
-    })
-    it('Should work with $path', async () => {
-      const path = client.api.bar.$path()
-      expect(path).toBe('/api/bar')
-    })
-  })
-
-  describe('With a blank path', () => {
-    const app = new Acryl().basePath('/api/v1')
-    const routes = app.route(
-      '/me',
-      new Acryl().route(
-        '',
-        new Acryl().get('', async (c) => {
-          return c.json({ name: 'acryl' })
-        })
-      )
-    )
-    const client = hc<typeof routes>('http://localhost')
-
-    it('Should infer paths correctly', async () => {
-      // Should not a throw type error
-      const url = client.api.v1.me.$url()
-      expectTypeOf<URL>(url)
-      expect(url.href).toBe('http://localhost/api/v1/me')
-
-      const path = client.api.v1.me.$path()
-      expectTypeOf<'/api/v1/me'>(path)
-      expect(path).toBe('/api/v1/me')
-    })
-  })
-
-  describe('With endpoint pathname', () => {
-    const app = new Acryl().basePath('/api/v1')
-    const routes = app.route(
-      '/me',
-      new Acryl().route(
-        '',
-        new Acryl().get('', async (c) => {
-          return c.json({ name: 'acryl' })
-        })
-      )
-    )
-    const client = hc<typeof routes>('http://localhost/proxy')
-
-    it('Should infer paths correctly', async () => {
-      // Should not a throw type error
-      const url = client.api.v1.me.$url()
-      expectTypeOf<URL>(url)
-      expect(url.href).toBe('http://localhost/proxy/api/v1/me')
-
-      const path = client.api.v1.me.$path()
-      expectTypeOf<'/api/v1/me'>(path)
-      expect(path).toBe('/api/v1/me')
-    })
-  })
-})
-
-describe('Use custom fetch method', () => {
-  it('Should call the custom fetch method when provided', async () => {
-    const fetchMock = vi.fn()
-
-    const api = new Acryl().get('/search', (c) => c.json({ ok: true }))
-    const app = new Acryl().route('/api', api)
-    type AppType = typeof app
-    const client = hc<AppType>('http://localhost', { fetch: fetchMock })
-    await client.api.search.$get()
-    expect(fetchMock).toHaveBeenCalledTimes(1)
-  })
-
-  it('Should return Response from custom fetch method', async () => {
-    const fetchMock = vi.fn()
-    const returnValue = new Response(null, { status: 200 })
-    fetchMock.mockReturnValueOnce(returnValue)
-
-    const api = new Acryl().get('/search', (c) => c.json({ ok: true }))
-    const app = new Acryl().route('/api', api)
-    type AppType = typeof app
-    const client = hc<AppType>('http://localhost', { fetch: fetchMock })
-    const res = await client.api.search.$get()
-    expect(res.ok).toBe(true)
-    expect(res).toEqual(returnValue)
-  })
-})
-
-describe('Use custom fetch (app.request) method', () => {
-  it('Should return Response from app request method', async () => {
-    const app = new Acryl().get('/search', (c) => c.json({ ok: true }))
-    type AppType = typeof app
-    const client = hc<AppType>('', { fetch: app.request })
-    const res = await client.search.$get()
-    expect(res.ok).toBe(true)
-  })
-
-  it.each([false, 0, '', null])('Should send falsy JSON value: %j', async (json) => {
-    const app = new Acryl().post(
-      '/json',
-      validator('json', (value) => value as boolean | number | string | null),
-      (c) => c.json(c.req.valid('json'))
-    )
-    const client = hc<typeof app>('', { fetch: app.request })
-
-    const res = await client.json.$post({ json })
-
-    expect(res.status).toBe(200)
-    expect(await res.json()).toBe(json)
-  })
-})
-
-describe('Optional parameters in JSON response', () => {
-  it('Should return the correct type', async () => {
-    const app = new Acryl().get('/', (c) => {
-      return c.json({ message: 'foo' } as { message?: string })
-    })
-    type AppType = typeof app
-    const client = hc<AppType>('', { fetch: app.request })
-    const res = await client.index.$get()
-    const data = await res.json()
-    expectTypeOf(data).toEqualTypeOf<{
-      message?: string
-    }>()
-  })
-})
-
-describe('ClientResponse<T>.json() returns a Union type correctly', () => {
-  const condition = () => true
-  const app = new Acryl().get('/', async (c) => {
-    const ok = condition()
-    if (ok) {
-      return c.json({ data: 'foo' })
-    }
-    return c.json({ message: 'error' })
-  })
-
-  const client = hc<typeof app>('', { fetch: app.request })
-  it('Should be a Union type', async () => {
-    const res = await client.index.$get()
-    const json = await res.json()
-    expectTypeOf(json).toEqualTypeOf<{ data: string } | { message: string }>()
-  })
-})
-
-describe('Response with different status codes', () => {
-  const condition = () => true
-  const app = new Acryl().get('/', async (c) => {
-    const ok = condition()
-    if (ok) {
-      return c.json({ data: 'foo' }, 200)
-    }
-    if (!ok) {
-      return c.json({ message: 'error' }, 400)
-    }
-    return c.json(null)
-  })
-
-  const client = hc<typeof app>('', { fetch: app.request })
-
-  it('all', async () => {
-    const res = await client.index.$get()
-    const json = await res.json()
-    expectTypeOf(json).toEqualTypeOf<{ data: string } | { message: string } | null>()
-  })
-
-  it('status 200', async () => {
-    const res = await client.index.$get()
-    if (res.status === 200) {
-      const json = await res.json()
-      expectTypeOf(json).toEqualTypeOf<{ data: string } | null>()
-    }
-  })
-
-  it('status 400', async () => {
-    const res = await client.index.$get()
-    if (res.status === 400) {
-      const json = await res.json()
-      expectTypeOf(json).toEqualTypeOf<{ message: string } | null>()
-    }
-  })
-
-  it('response is ok', async () => {
-    const res = await client.index.$get()
-    if (res.ok) {
-      const json = await res.json()
-      expectTypeOf(json).toEqualTypeOf<{ data: string } | null>()
-    }
-  })
-
-  it('response is not ok', async () => {
-    const res = await client.index.$get()
-    if (!res.ok) {
-      const json = await res.json()
-      expectTypeOf(json).toEqualTypeOf<{ message: string } | null>()
-    }
-  })
-})
-
-describe('Infer the response type with different status codes', () => {
-  const condition = () => true
-  const app = new Acryl().get('/', async (c) => {
-    const ok = condition()
-    if (ok) {
-      return c.json({ data: 'foo' }, 200)
-    }
-    if (!ok) {
-      return c.json({ message: 'error' }, 400)
-    }
-    return c.json(null)
-  })
-
-  const client = hc<typeof app>('', { fetch: app.request })
-
-  it('Should infer response type correctly', () => {
-    const req = client.index.$get
-
-    type Actual = InferResponseType<typeof req>
-    type Expected =
-      | {
-          data: string
-        }
-      | {
-          message: string
-        }
-      | null
-    type verify = Expect<Equal<Expected, Actual>>
-  })
-
-  it('Should infer response type of status 200 correctly', () => {
-    const req = client.index.$get
-
-    type Actual = InferResponseType<typeof req, 200>
-    type Expected = {
-      data: string
-    } | null
-    type verify = Expect<Equal<Expected, Actual>>
-  })
-})
-
-describe('Infer the response types from middlewares', () => {
-  const app = new Acryl()
-    .get(
-      '/',
-      validator('query', (input, c) => {
-        if (!input.page || typeof input.page !== 'string') {
-          return c.json({ error: 'Bad request' as const }, 400)
-        }
-
-        return input as { page: string }
-      }),
-      async (c) => {
-        const query = c.req.valid('query')
-        return c.json({ data: 'foo', page: query.page }, 200)
-      }
-    )
-    .post(
-      '/posts',
-      async (c, next) => {
-        const auth = c.req.header('authorization')
-        if (!auth || !auth.startsWith('Bearer ')) {
-          return c.json({ error: 'Unauthorized' as const }, 401)
-        }
-        return next()
-      },
-      validator('json', (input, c) => {
-        if (!input.title) {
-          return c.json({ error: 'Bad request' as const }, 400)
-        }
-
-        return input as { title: string }
-      }),
-      (c) => {
-        const data = c.req.valid('json')
-        return c.json(data, 200)
-      }
-    )
-
-  type AppType = typeof app
-  const client = hc<AppType>('', { fetch: app.request })
-
-  it('Should infer response type of status 200 correctly', () => {
-    const req = client.posts.$post
-
-    type Actual = InferResponseType<typeof req, 200>
-    type Expected = {
-      title: string
-    }
-    type verify = Expect<Equal<Expected, Actual>>
-  })
-
-  it('Should infer response type of status 400 correctly', () => {
-    const req = client.posts.$post
-
-    type Actual = InferResponseType<typeof req, 400>
-    type Expected = {
-      error: 'Bad request'
-    }
-    type verify = Expect<Equal<Expected, Actual>>
-  })
-
-  it('Should infer response type of status 401 correctly', () => {
-    const req = client.posts.$post
-
-    type Actual = InferResponseType<typeof req, 401>
-    type Expected = {
-      error: 'Unauthorized'
-    }
-    type verify = Expect<Equal<Expected, Actual>>
-  })
-
-  it('Should infer all possible response statuses', async () => {
-    const req = await client.posts.$post({
-      json: {
-        title: 'hello',
-      },
-    })
-
-    type Actual = typeof req.status
-    type Expected = 200 | 400 | 401
-    type verify = Expect<Equal<Expected, Actual>>
-  })
-
-  it('Should properly assign response to corresponding status', async () => {
-    const req = await client.posts.$post({
-      json: {
-        title: 'hello',
-      },
-    })
-
-    if (req.status === 200) {
-      const data = await req.json()
-
-      expectTypeOf(data).toEqualTypeOf<{ title: string }>()
-    } else if (req.status === 400) {
-      const data = await req.json()
-
-      expectTypeOf(data).toEqualTypeOf<{ error: 'Bad request' }>()
-    } else if (req.status === 401) {
-      const data = await req.json()
-
-      expectTypeOf(data).toEqualTypeOf<{ error: 'Unauthorized' }>()
-    }
-  })
-})
-
-const pathname = <T extends URL | string>(value: T): string =>
-  value instanceof URL ? value.pathname : value
-
-describe.each(['$path', '$url'] as const)('%s() with a param option', (cmd) => {
-  const app = new Acryl()
-    .get('/posts/:id/comments', (c) => c.json({ ok: true }))
-    .get('/something/:firstId/:secondId/:version?', (c) => c.json({ ok: true }))
-    .get('/docs/:page', (c) => c.json({ ok: true }))
-    .get('/files/:dir/', (c) => c.json({ ok: true }))
-    .get('/:page', (c) => c.json({ ok: true }))
-    .get('/index/:v?', (c) => c.json({ ok: true }))
-  type AppType = typeof app
-  const client = hc<AppType>('http://localhost')
-
-  it('Should return the correct url path - /posts/123/comments', async () => {
-    const value = client.posts[':id'].comments[cmd]({
-      param: {
-        id: '123',
-      },
-    })
-    expect(pathname(value)).toBe('/posts/123/comments')
-  })
-
-  it('Should return the correct path - /posts/:id/comments', async () => {
-    const value = client.posts[':id'].comments[cmd]()
-    expect(pathname(value)).toBe('/posts/:id/comments')
-  })
-
-  it('Should return the correct path - /something/123/456', async () => {
-    const value = client.something[':firstId'][':secondId'][':version?'][cmd]({
-      param: {
-        firstId: '123',
-        secondId: '456',
-        version: undefined,
-      },
-    })
-    expect(pathname(value)).toBe('/something/123/456')
-  })
-
-  it('Should keep a param value of "index" - /docs/index', async () => {
-    const value = client.docs[':page'][cmd]({
-      param: {
-        page: 'index',
-      },
-    })
-    expect(pathname(value)).toBe('/docs/index')
-  })
-
-  it('Should keep a root-level param value of "index" - /index', async () => {
-    const value = client[':page'][cmd]({
-      param: {
-        page: 'index',
-      },
-    })
-    expect(pathname(value)).toBe('/index')
-  })
-
-  it('Should keep a literal index segment when an optional param is omitted - /index', async () => {
-    const value = client.index[':v?'][cmd]({
-      param: {
-        v: undefined,
-      },
-    })
-    expect(pathname(value)).toBe('/index')
-  })
-
-  it('Should still drop the index alias of a route with a param - /files/123', async () => {
-    const value = client.files[':dir'].index[cmd]({
-      param: {
-        dir: '123',
-      },
-    })
-    expect(pathname(value)).toBe('/files/123')
-  })
-})
-
-describe('$url() / $path() with a query option', () => {
-  const app = new Acryl()
-    .get(
-      '/posts',
-      validator('query', () => {
-        return {} as { filter: 'test' }
-      }),
-      (c) => c.json({ ok: true })
-    )
-    .get('/docs/:page', (c) => c.json({ ok: true }))
-  type AppType = typeof app
-  const client = hc<AppType>('http://localhost')
-
-  it('Should return the correct path - /posts?filter=test', async () => {
-    const url = client.posts.$url({
-      query: {
-        filter: 'test',
-      },
-    })
-    expect(url.search).toBe('?filter=test')
-
-    const path = client.posts.$path({
-      query: {
-        filter: 'test',
-      },
-    })
-    expect(path).toBe('/posts?filter=test')
-  })
-
-  it('Should return the correct path - /docs/index?filter=test', async () => {
-    const url = client.docs[':page'].$url({
-      param: {
-        page: 'index',
-      },
-      query: {
-        filter: 'test',
-      },
-    })
-    expect(url.href).toBe('http://localhost/docs/index?filter=test')
-
-    const path = client.docs[':page'].$path({
-      param: {
-        page: 'index',
-      },
-      query: {
-        filter: 'test',
-      },
-    })
-    expect(path).toBe('/docs/index?filter=test')
-  })
-})
-
-describe('Client can be awaited', () => {
-  it('Can be awaited without side effects', async () => {
-    const client = hc('http://localhost')
-
-    const awaited = await client
-
-    expect(awaited).toEqual(client)
-  })
-})
-
-describe('Dynamic headers', () => {
-  const app = new Acryl()
-
-  const route = app.post('/posts', (c) => {
-    return c.json({
-      requestDynamic: 'dummy',
-      requestAcryl: 'dummy',
-    })
-  })
-
-  type AppType = typeof route
-
-  const server = setupServer(
-    http.post('http://localhost/posts', async ({ request }) => {
-      const requestDynamic = request.headers.get('x-dynamic')
-      const requestAcryl = request.headers.get('x-acryl')
-      const payload = {
-        requestDynamic,
-        requestAcryl,
-      }
-      return HttpResponse.json(payload)
-    })
-  )
-
-  beforeAll(() => server.listen())
-  afterEach(() => server.resetHandlers())
-  afterAll(() => server.close())
-
-  let dynamic = ''
-
-  const client = hc<AppType>('http://localhost', {
-    headers: () => ({ 'x-acryl': 'acryl', 'x-dynamic': dynamic }),
-  })
-
-  it('Should have "x-dynamic": "one"', async () => {
-    dynamic = 'one'
-
-    const res = await client.posts.$post()
-
-    expect(res.ok).toBe(true)
-    const data = await res.json()
-    expect(data.requestDynamic).toEqual('one')
-  })
-
-  it('Should have "x-dynamic": "two"', async () => {
-    dynamic = 'two'
-
-    const res = await client.posts.$post()
-
-    expect(res.ok).toBe(true)
-    const data = await res.json()
-    expect(data.requestDynamic).toEqual('two')
-  })
-
-  it('Should merge function headers with per-request object headers', async () => {
-    const clientWithFn = hc<AppType>('http://localhost', {
-      headers: async () => ({ 'x-acryl': 'acryl' }),
-    })
-
-    const res = await clientWithFn.posts.$post({}, { headers: { 'x-dynamic': 'request' } })
-
-    expect(res.ok).toBe(true)
-    const data = await res.json()
-    expect(data.requestAcryl).toEqual('acryl')
-    expect(data.requestDynamic).toEqual('request')
-  })
-
-  it('Should merge function headers with per-request function headers', async () => {
-    const clientWithFn = hc<AppType>('http://localhost', {
-      headers: () => ({ 'x-acryl': 'acryl' }),
-    })
-
-    const res = await clientWithFn.posts.$post(
-      {},
-      { headers: async () => ({ 'x-dynamic': 'request' }) }
-    )
-
-    expect(res.ok).toBe(true)
-    const data = await res.json()
-    expect(data.requestAcryl).toEqual('acryl')
-    expect(data.requestDynamic).toEqual('request')
-  })
-
-  it('Should merge object headers with per-request function headers', async () => {
-    const clientWithObject = hc<AppType>('http://localhost', {
-      headers: { 'x-acryl': 'acryl' },
-    })
-
-    const res = await clientWithObject.posts.$post(
-      {},
-      { headers: async () => ({ 'x-dynamic': 'request' }) }
-    )
-
-    expect(res.ok).toBe(true)
-    const data = await res.json()
-    expect(data.requestAcryl).toEqual('acryl')
-    expect(data.requestDynamic).toEqual('request')
-  })
-
-  it('Should prioritize per-request headers when the keys conflict', async () => {
-    const clientWithFn = hc<AppType>('http://localhost', {
-      headers: async () => ({ 'x-acryl': 'client' }),
-    })
-
-    const res = await clientWithFn.posts.$post({}, { headers: { 'x-acryl': 'request' } })
-
-    expect(res.ok).toBe(true)
-    const data = await res.json()
-    expect(data.requestAcryl).toEqual('request')
-  })
-})
-
-describe('RequestInit work as expected', () => {
-  const app = new Acryl()
-
-  const route = app
-    .get('/credentials', (c) => {
-      return c.text('' as RequestCredentials)
-    })
-    .get('/headers', (c) => {
-      return c.json({} as Record<string, string>)
-    })
-    .post('/headers', (c) => c.text('Not found', 404))
-
-  type AppType = typeof route
-
-  const server = setupServer(
-    http.get('http://localhost/credentials', ({ request }) => {
-      return HttpResponse.text(request.credentials)
-    }),
-    http.get('http://localhost/headers', ({ request }) => {
-      const allHeaders: Record<string, string> = {}
-      for (const [k, v] of request.headers.entries()) {
-        allHeaders[k] = v
-      }
-
-      return HttpResponse.json(allHeaders)
-    }),
-    http.post('http://localhost/headers', () => {
-      return HttpResponse.text('Should not be here', {
-        status: 400,
-      })
-    })
-  )
-
-  beforeAll(() => server.listen())
-  afterEach(() => server.resetHandlers())
-  afterAll(() => server.close())
-
-  const client = hc<AppType>('http://localhost', {
-    headers: { 'x-acryl': 'fire' },
-    init: {
-      credentials: 'include',
-    },
-  })
-
-  it('Should overwrite method and fail', async () => {
-    const res = await client.headers.$get(undefined, { init: { method: 'POST' } })
-
-    expect(res.ok).toBe(false)
-  })
-
-  it('Should clear headers', async () => {
-    const res = await client.headers.$get(undefined, { init: { headers: undefined } })
-
-    expect(res.ok).toBe(true)
-    const data = await res.json()
-    expect(data).toEqual({})
-  })
-
-  it('Should overwrite headers', async () => {
-    const res = await client.headers.$get(undefined, {
-      init: { headers: new Headers({ 'x-acryl': 'awesome' }) },
-    })
-
-    expect(res.ok).toBe(true)
-    const data = await res.json()
-    expect(data).toEqual({ 'x-acryl': 'awesome' })
-  })
-
-  it('credentials is include', async () => {
-    const res = await client.credentials.$get()
-
-    expect(res.ok).toBe(true)
-    const data = await res.text()
-    expect(data).toEqual('include')
-  })
-
-  it('deepMerge should works and not unset credentials', async () => {
-    const res = await client.credentials.$get(undefined, { init: { headers: { hi: 'hello' } } })
-
-    expect(res.ok).toBe(true)
-    const data = await res.text()
-    expect(data).toEqual('include')
-  })
-
-  it('Should unset credentials', async () => {
-    const res = await client.credentials.$get(undefined, { init: { credentials: undefined } })
-
-    expect(res.ok).toBe(true)
-    const data = await res.text()
-    expect(data).toEqual('same-origin')
-  })
-})
-
-describe('WebSocket URL Protocol Translation', () => {
-  const app = new Acryl()
-  const route = app.get(
-    '/',
-    upgradeWebSocket((c) => ({
-      onMessage(event, ws) {
-        console.log(`Message from client: ${event.data}`)
-        ws.send('Hello from server!')
-      },
-      onClose: () => {
-        console.log('Connection closed')
-      },
-    }))
-  )
-
-  type AppType = typeof route
-
-  const server = setupServer()
-  const webSocketMock = vi.fn()
-
-  beforeAll(() => server.listen())
-  beforeEach(() => {
-    vi.stubGlobal('WebSocket', webSocketMock)
-  })
-  afterEach(() => {
-    vi.clearAllMocks()
-    server.resetHandlers()
-  })
-  afterAll(() => server.close())
-
-  it('Translates HTTP to ws', async () => {
-    const client = hc<AppType>('http://localhost')
-    client.index.$ws()
-    expect(webSocketMock).toHaveBeenCalledWith('ws://localhost/')
-  })
-
-  it('Translates HTTPS to wss', async () => {
-    const client = hc<AppType>('https://localhost')
-    client.index.$ws()
-    expect(webSocketMock).toHaveBeenCalledWith('wss://localhost/')
-  })
-
-  it('Keeps ws unchanged', async () => {
-    const client = hc<AppType>('ws://localhost')
-    client.index.$ws()
-    expect(webSocketMock).toHaveBeenCalledWith('ws://localhost/')
-  })
-
-  it('Keeps wss unchanged', async () => {
-    const client = hc<AppType>('wss://localhost')
-    client.index.$ws()
-    expect(webSocketMock).toHaveBeenCalledWith('wss://localhost/')
-  })
-
-  it('Preserves an index path parameter value', async () => {
-    const dynamicRoute = new Acryl().get(
-      '/:id',
-      upgradeWebSocket(() => ({}))
-    )
-    const client = hc<typeof dynamicRoute>('http://localhost')
-
-    client[':id'].$ws({ param: { id: 'index' } })
-
-    expect(webSocketMock).toHaveBeenCalledWith('ws://localhost/index')
-  })
-})
-
-describe('WebSocket URL Protocol Translation with Query Parameters', () => {
-  const app = new Acryl()
-  const route = app.get(
-    '/',
-    upgradeWebSocket((c) => ({
-      onMessage(event, ws) {
-        ws.send('Hello from server!')
-      },
-      onClose: () => {
-        console.log('Connection closed')
-      },
-    }))
-  )
-
-  type AppType = typeof route
-
-  const server = setupServer()
-  const webSocketMock = vi.fn()
-
-  beforeAll(() => server.listen())
-  beforeEach(() => {
-    vi.stubGlobal('WebSocket', webSocketMock)
-  })
-  afterEach(() => {
-    vi.clearAllMocks()
-    server.resetHandlers()
-  })
-  afterAll(() => server.close())
-
-  it('Translates HTTP to ws and includes query parameters', async () => {
-    const client = hc<AppType>('http://localhost')
-    client.index.$ws({
-      query: {
-        id: '123',
-        type: 'test',
-        tag: ['a', 'b'],
-      },
-    })
-    expect(webSocketMock).toHaveBeenCalledWith('ws://localhost/?id=123&type=test&tag=a&tag=b')
-  })
-
-  it('Translates HTTPS to wss and includes query parameters', async () => {
-    const client = hc<AppType>('https://localhost')
-    client.index.$ws({
-      query: {
-        id: '456',
-        type: 'secure',
-      },
-    })
-    expect(webSocketMock).toHaveBeenCalledWith('wss://localhost/?id=456&type=secure')
-  })
-
-  it('Keeps ws unchanged and includes query parameters', async () => {
-    const client = hc<AppType>('ws://localhost')
-    client.index.$ws({
-      query: {
-        id: '789',
-        type: 'plain',
-      },
-    })
-    expect(webSocketMock).toHaveBeenCalledWith('ws://localhost/?id=789&type=plain')
-  })
-
-  it('Keeps wss unchanged and includes query parameters', async () => {
-    const client = hc<AppType>('wss://localhost')
-    client.index.$ws({
-      query: {
-        id: '1011',
-        type: 'secure',
-      },
-    })
-    expect(webSocketMock).toHaveBeenCalledWith('wss://localhost/?id=1011&type=secure')
-  })
-})
-
-describe('Client can be console.log in react native', () => {
-  it('Returns a function name with function.name.toString', async () => {
-    const client = hc('http://localhost')
-    // @ts-ignore
-    expect(client.posts.name.toString()).toEqual('posts')
-  })
-
-  it('Returns a function name with function.name.valueOf', async () => {
-    const client = hc('http://localhost')
-    // @ts-ignore
-    expect(client.posts.name.valueOf()).toEqual('posts')
-  })
-
-  it('Returns a function with function.valueOf', async () => {
-    const client = hc('http://localhost')
-    expect(typeof client.posts.valueOf()).toEqual('function')
-  })
-
-  it('Returns a function source with function.toString', async () => {
-    const client = hc('http://localhost')
-    expect(client.posts.toString()).toMatch('function proxyCallback')
-  })
-})
-
-describe('Text response', () => {
-  const text = 'My name is Acryl'
-  const obj = { ok: true }
-  const server = setupServer(
-    http.get('http://localhost/about/me', async () => {
-      return HttpResponse.text(text)
-    }),
-    http.get('http://localhost/api', async ({ request }) => {
-      return HttpResponse.json(obj)
-    })
-  )
-
-  beforeAll(() => server.listen())
-  afterEach(() => server.resetHandlers())
-  afterAll(() => server.close())
-
-  const app = new Acryl().get('/about/me', (c) => c.text(text)).get('/api', (c) => c.json(obj))
-  const client = hc<typeof app>('http://localhost/')
-
-  it('Should be never with res.json() - /about/me', async () => {
-    const res = await client.about.me.$get()
-    type Actual = ReturnType<typeof res.json>
-    type Expected = Promise<never>
-    type verify = Expect<Equal<Expected, Actual>>
-  })
-
-  it('Should be "Hello, World!" with res.text() - /about/me', async () => {
-    const res = await client.about.me.$get()
-    const data = await res.text()
-    expectTypeOf(data).toEqualTypeOf<'My name is Acryl'>()
-    expect(data).toBe(text)
-  })
-
-  /**
-   * Also check the type of JSON response with res.text().
-   */
-  it('Should be string with res.text() - /api', async () => {
-    const res = await client.api.$get()
-    type Actual = ReturnType<typeof res.text>
-    type Expected = Promise<string>
-    type verify = Expect<Equal<Expected, Actual>>
-  })
-})
-
-describe('Redirect response - only types', () => {
-  const server = setupServer(
-    http.get('http://localhost/', async () => {
-      return HttpResponse.redirect('/')
-    })
-  )
-
-  beforeAll(() => server.listen())
-  afterEach(() => server.resetHandlers())
-  afterAll(() => server.close())
-
-  const condition = () => true
-  const app = new Acryl().get('/', async (c) => {
-    const ok = condition()
-    const temporary = condition()
-    if (ok) {
-      return c.json({ ok: true }, 200)
-    }
-    if (temporary) {
-      return c.redirect('/302')
-    }
-    return c.redirect('/301', 301)
-  })
-
-  const client = hc<typeof app>('http://localhost/')
-  const req = client.index.$get
-
-  it('Should infer request type the type correctly', () => {
-    type Actual = InferResponseType<typeof req>
-    type Expected =
-      | {
-          ok: true
-        }
-      | undefined
-    type verify = Expect<Equal<Expected, Actual>>
-  })
-
-  it('Should infer response type correctly', async () => {
-    const res = await req()
-    if (res.ok) {
-      const data = await res.json()
-      expectTypeOf(data).toMatchTypeOf({ ok: true })
-    }
-    if (res.status === 301) {
-      type Expected = ClientResponse<undefined, 301, 'redirect'>
-      type verify = Expect<Equal<Expected, typeof res>>
-    }
-    if (res.status === 302) {
-      type Expected = ClientResponse<undefined, 302, 'redirect'>
-      type verify = Expect<Equal<Expected, typeof res>>
-    }
-  })
-})
-
-describe('WebSocket Provider Integration', () => {
-  const app = new Acryl()
-  const route = app.get(
-    '/',
-    upgradeWebSocket((c) => ({
-      onMessage(event, ws) {
-        ws.send('Hello from server!')
-      },
-      onClose() {
-        console.log('Connection closed')
-      },
-    }))
-  )
-
-  type AppType = typeof route
-
-  const server = setupServer()
-  beforeAll(() => server.listen())
-  afterEach(() => {
-    vi.clearAllMocks()
-    server.resetHandlers()
-  })
-  afterAll(() => server.close())
-
-  it.each([
-    {
-      description: 'should initialize the WebSocket provider correctly',
-      url: 'http://localhost',
-      query: undefined,
-      expectedUrl: 'ws://localhost/',
-    },
-    {
-      description: 'should correctly add query parameters to the WebSocket URL',
-      url: 'http://localhost',
-      query: { id: '123', type: 'test', tag: ['a', 'b'] },
-      expectedUrl: 'ws://localhost/?id=123&type=test&tag=a&tag=b',
-    },
-  ])('$description', ({ url, expectedUrl, query }) => {
-    const webSocketMock = vi.fn()
-    const client = hc<AppType>(url, {
-      webSocket(url, options) {
-        return webSocketMock(url, options)
-      },
-    })
-    client.index.$ws({ query })
-    expect(webSocketMock).toHaveBeenCalledWith(expectedUrl, undefined)
-  })
-})
-
-describe('Query arrays containing undefined', () => {
-  // A validator whose query field is an optional union gives the client an input
-  // type of `(string | undefined)[] | undefined`, so this compiles with no cast.
-  const app = new Acryl().get(
-    '/search',
-    validator('query', () => ({}) as { tag: (string | undefined)[] | undefined }),
-    (c) => c.json({ ok: true })
-  )
-  type AppType = typeof app
-
-  it('Should not send the literal string "undefined" for an absent entry', async () => {
-    let requestedUrl = ''
-    const client = hc<AppType>('http://localhost', {
-      fetch: (input: RequestInfo | URL) => {
-        requestedUrl = input.toString()
-        return Promise.resolve(new Response('{}'))
-      },
-    })
-
-    await client.search.$get({ query: { tag: ['a', undefined, 'b'] } })
-
-    expect(requestedUrl).toBe('http://localhost/search?tag=a&tag=b')
-  })
-})
-
-describe('Empty serialized query', () => {
-  const app = new Acryl().get(
-    '/search',
-    validator('query', () => ({}) as { q?: string }),
-    (c) => c.json({ ok: true })
-  )
-  const input = { query: { q: undefined } }
-
-  it('Should omit the query delimiter when no query values are serialized', async () => {
-    let requestedUrl = ''
-    const client = hc<typeof app>('http://localhost', {
-      fetch: (input: RequestInfo | URL) => {
-        requestedUrl = input.toString()
-        return Promise.resolve(new Response('{}'))
-      },
-    })
-
-    await client.search.$get(input)
-
-    expect(requestedUrl).toBe('http://localhost/search')
-    expect(client.search.$url(input).href).toBe('http://localhost/search')
-    expect(client.search.$path(input)).toBe('/search')
-  })
-
-  it('Should omit the query delimiter when a custom serializer returns no values', async () => {
-    let requestedUrl = ''
-    const client = hc<typeof app>('http://localhost', {
-      buildSearchParams: () => new URLSearchParams(),
-      fetch: (input: RequestInfo | URL) => {
-        requestedUrl = input.toString()
-        return Promise.resolve(new Response('{}'))
-      },
-    })
-    const customInput = { query: { q: 'ignored' } }
-
-    await client.search.$get(customInput)
-
-    expect(requestedUrl).toBe('http://localhost/search')
-    expect(client.search.$url(customInput).href).toBe('http://localhost/search')
-    expect(client.search.$path(customInput)).toBe('/search')
-  })
-
-  it('Should preserve empty-string query values', async () => {
-    let requestedUrl = ''
-    const client = hc<typeof app>('http://localhost', {
-      fetch: (input: RequestInfo | URL) => {
-        requestedUrl = input.toString()
-        return Promise.resolve(new Response('{}'))
-      },
-    })
-    const emptyStringInput = { query: { q: '' } }
-
-    await client.search.$get(emptyStringInput)
-
-    expect(requestedUrl).toBe('http://localhost/search?q=')
-    expect(client.search.$url(emptyStringInput).href).toBe('http://localhost/search?q=')
-    expect(client.search.$path(emptyStringInput)).toBe('/search?q=')
-  })
-})
-
-describe('Custom buildSearchParams', () => {
-  const app = new Acryl()
-  const route = app.get(
-    '/search',
-    validator('query', () => {
-      return {} as { q: string; tags: string[] }
-    }),
-    (c) => {
-      return c.json({
-        message: 'success',
-        queryString: '',
-      })
-    }
-  )
-
-  type AppType = typeof route
-
-  const server = setupServer(
-    http.get('http://localhost/search', ({ request }) => {
-      const url = new URL(request.url)
-      return HttpResponse.json({
-        message: 'success',
-        queryString: url.search,
-      })
-    })
-  )
-
-  beforeAll(() => server.listen())
-  afterEach(() => server.resetHandlers())
-  afterAll(() => server.close())
-
-  // Custom buildSearchParams that uses bracket notation for arrays (key[]=value)
-  const customBuildSearchParams = (query: Record<string, string | string[]>) => {
-    const searchParams = new URLSearchParams()
-    for (const [k, v] of Object.entries(query)) {
-      if (v === undefined) {
-        continue
-      }
-      if (Array.isArray(v)) {
-        v.forEach((item) => searchParams.append(`${k}[]`, item))
-      } else {
-        searchParams.set(k, v)
-      }
-    }
-    return searchParams
-  }
-
-  it('Should use custom buildSearchParams for query serialization', async () => {
-    const client = hc<AppType>('http://localhost', { buildSearchParams: customBuildSearchParams })
-    const res = await client.search.$get({ query: { q: 'test', tags: ['tag1', 'tag2', 'tag3'] } })
-    const data = await res.json()
-
-    expect(res.status).toBe(200)
-    expect(data.queryString).toBe('?q=test&tags%5B%5D=tag1&tags%5B%5D=tag2&tags%5B%5D=tag3')
-  })
-
-  it('Should use default buildSearchParams when custom one is not provided', async () => {
-    const client = hc<AppType>('http://localhost')
-    const res = await client.search.$get({ query: { q: 'test', tags: ['tag1', 'tag2'] } })
-    const data = await res.json()
-
-    expect(res.status).toBe(200)
-    expect(data.queryString).toBe('?q=test&tags=tag1&tags=tag2')
-  })
-
-  it('Should use custom buildSearchParams in $url() method', () => {
-    const client = hc<AppType>('http://localhost', { buildSearchParams: customBuildSearchParams })
-    const url = client.search.$url({ query: { q: 'test', tags: ['tag1', 'tag2'] } })
-
-    expect(url.href).toBe('http://localhost/search?q=test&tags%5B%5D=tag1&tags%5B%5D=tag2')
-  })
-
-  it('Should use default buildSearchParams in $url() when custom one is not provided', () => {
-    const client = hc<AppType>('http://localhost')
-    const url = client.search.$url({ query: { q: 'test', tags: ['tag1', 'tag2'] } })
-
-    expect(url.href).toBe('http://localhost/search?q=test&tags=tag1&tags=tag2')
-  })
-
-  it('Should use custom buildSearchParams in $ws() method', () => {
-    const webSocketMock = vi.fn()
-    const client = hc<AppType>('http://localhost', {
-      buildSearchParams: customBuildSearchParams,
-      webSocket(url, options) {
-        return webSocketMock(url, options)
-      },
-    })
-    // @ts-expect-error search route does not explicitly define $ws in mock AppType
-    client.search.$ws({ query: { q: 'test', tags: ['tag1', 'tag2'] } })
-
-    expect(webSocketMock).toHaveBeenCalledWith(
-      'ws://localhost/search?q=test&tags%5B%5D=tag1&tags%5B%5D=tag2',
-      undefined
-    )
-  })
-
-  it('Should filter out undefined query parameters in $ws()', () => {
-    const webSocketMock = vi.fn()
-    const client = hc<AppType>('http://localhost', {
-      webSocket(url, options) {
-        return webSocketMock(url, options)
-      },
-    })
-    // @ts-expect-error search route does not explicitly define $ws in mock AppType
-    client.search.$ws({ query: { q: 'test', tags: undefined as any } })
-
-    expect(webSocketMock).toHaveBeenCalledWith('ws://localhost/search?q=test', undefined)
-  })
-})
-
-describe('ApplyGlobalResponse Type Helper', () => {
-  const server = setupServer(
-    http.get('http://localhost/api/users', () => {
-      return HttpResponse.json({ users: ['alice', 'bob'] })
-    }),
-    http.get('http://localhost/api/error', () => {
-      return HttpResponse.json(
-        { error: 'Internal Server Error', message: 'Something went wrong' },
-        { status: 500 }
-      )
-    }),
-    http.get('http://localhost/api/unauthorized', () => {
-      return HttpResponse.json({ error: 'Unauthorized', message: 'Please login' }, { status: 401 })
-    })
-  )
-
-  beforeAll(() => server.listen())
-  afterEach(() => server.resetHandlers())
-  afterAll(() => server.close())
-
-  it('Should add global error response types to all routes', () => {
-    // Use explicit status codes for proper type narrowing
-    const app = new Acryl().get('/api/users', (c) => c.json({ users: ['alice', 'bob'] }, 200))
-
-    // Apply global error responses with new object syntax
-    type AppWithGlobalErrors = ApplyGlobalResponse<
-      typeof app,
-      {
-        401: { json: { error: string; message: string } }
-        500: { json: { error: string; message: string } }
-      }
-    >
-
-    const client = hc<AppWithGlobalErrors>('http://localhost')
-    const req = client.api.users.$get
-
-    // Type should be a union of normal response and global errors
-    type ResponseType = InferResponseType<typeof req>
-    type Expected = { users: string[] } | { error: string; message: string }
-
-    type verify = Expect<Equal<ResponseType, Expected>>
-  })
-
-  it('Should support multiple global error status codes', async () => {
-    const app = new Acryl()
-      .get('/api/users', (c) => c.json({ users: ['alice', 'bob'] }, 200))
-      .get('/api/unauthorized', (c) =>
-        c.json({ error: 'Unauthorized', message: 'Please login' }, 401)
-      )
-      .get('/api/error', (c) =>
-        c.json({ error: 'Internal Server Error', message: 'Something went wrong' }, 500)
-      )
-
-    // Apply multiple global error types in one definition
-    type AppWithGlobalErrors = ApplyGlobalResponse<
-      typeof app,
-      {
-        401: { json: { error: string; message: string } }
-        500: { json: { error: string; message: string } }
-      }
-    >
-
-    const client = hc<AppWithGlobalErrors>('http://localhost')
-
-    // Verify runtime behavior for different status codes
-    const usersRes = await client.api.users.$get()
-    expect(usersRes.status).toBe(200)
-
-    const unauthorizedRes = await client.api.unauthorized.$get()
-    expect(unauthorizedRes.status).toBe(401)
-    expect(await unauthorizedRes.json()).toEqual({ error: 'Unauthorized', message: 'Please login' })
-
-    const errorRes = await client.api.error.$get()
-    expect(errorRes.status).toBe(500)
-    expect(await errorRes.json()).toEqual({
-      error: 'Internal Server Error',
-      message: 'Something went wrong',
-    })
-  })
-
-  it('Should work with onError handler pattern', () => {
-    // Simulating typical Acryl app with onError handler
-    // Use explicit status code for proper type narrowing
-    const app = new Acryl().get('/api/users', (c) => c.json({ users: ['alice', 'bob'] }, 200))
-
-    // In real app: app.onError((err, c) => c.json({ error: err.message }, 500))
-    type AppWithOnError = ApplyGlobalResponse<
-      typeof app,
-      {
-        500: { json: { error: string } }
-      }
-    >
-
-    const client = hc<AppWithOnError>('http://localhost')
-    const req = client.api.users.$get
-
-    // RPC client should know about the error format
-    type ResponseType = InferResponseType<typeof req>
-    type Expected = { users: string[] } | { error: string }
-
-    type verify = Expect<Equal<ResponseType, Expected>>
-  })
-
-  it('Should keep route() paths when global responses are applied', () => {
-    const users = new Acryl().get('/users', (c) => c.json({ users: ['alice', 'bob'] }, 200))
-    const app = new Acryl().route('/api', users)
-
-    type AppWithGlobalErrors = ApplyGlobalResponse<
-      typeof app,
-      {
-        500: { json: { error: string } }
-      }
-    >
-
-    const client = hc<AppWithGlobalErrors>('http://localhost')
-    const req = client.api.users.$get
-
-    type ResponseType = InferResponseType<typeof req>
-    type Expected = { users: string[] } | { error: string }
-
-    type verify = Expect<Equal<ResponseType, Expected>>
-  })
-})
-
-describe('PickResponseByStatusCode Type Helper', () => {
-  it('Should keep only specified status code responses', () => {
-    const app = new Acryl().get('/api/users', (c) => {
-      try {
-        return c.json({ users: ['alice', 'bob'] }, 200)
-      } catch {
-        return c.json({ error: 'Internal Server Error' }, 500)
-      }
-    })
-
-    type AppSuccessOnly = PickResponseByStatusCode<typeof app, 200>
-
-    const client = hc<AppSuccessOnly>('http://localhost')
-    const req = client.api.users.$get
-
-    type ResponseType = InferResponseType<typeof req>
-    type Expected = { users: string[] }
-    type verify = Expect<Equal<ResponseType, Expected>>
-
-    type Res = Awaited<ReturnType<typeof req>>
-    type verifyOk = Expect<Equal<Res['ok'], true>>
-    type verifyStatus = Expect<Equal<Res['status'], 200>>
-  })
-
-  it('Should work with ApplyGlobalResponse', () => {
-    const app = new Acryl().get('/api/users', (c) => {
-      try {
-        return c.json({ users: ['alice', 'bob'] }, 200)
-      } catch {
-        return c.json({ error: 'Not Found' }, 404)
-      }
-    })
-
-    type AppWithGlobalErrors = ApplyGlobalResponse<
-      typeof app,
-      {
-        401: { json: { error: string; message: string } }
-        500: { json: { error: string; message: string } }
-      }
-    >
-
-    type AppSuccessOnly = PickResponseByStatusCode<AppWithGlobalErrors, 200>
-
-    const client = hc<AppSuccessOnly>('http://localhost')
-    const req = client.api.users.$get
-
-    type ResponseType = InferResponseType<typeof req>
-    type Expected = { users: string[] }
-    type verify = Expect<Equal<ResponseType, Expected>>
-  })
-
-  it('Should work with route() paths', () => {
-    const users = new Acryl().get('/users', (c) => {
-      try {
-        return c.json({ users: ['alice', 'bob'] }, 200)
-      } catch {
-        return c.json({ error: 'error' }, 500)
-      }
-    })
-    const app = new Acryl().route('/api', users)
-
-    type AppSuccessOnly = PickResponseByStatusCode<typeof app, 200>
-
-    const client = hc<AppSuccessOnly>('http://localhost')
-    const req = client.api.users.$get
-
-    type ResponseType = InferResponseType<typeof req>
-    type Expected = { users: string[] }
-    type verify = Expect<Equal<ResponseType, Expected>>
-  })
-
-  it('Should pick multiple status codes', () => {
-    const app = new Acryl().get('/api/users', (c) => {
-      try {
-        return c.json({ users: ['alice', 'bob'] }, 200)
-      } catch {
-        return c.json({ error: 'Bad Request' }, 400)
-      }
-    })
-
-    type AppWithGlobalErrors = ApplyGlobalResponse<
-      typeof app,
-      {
-        500: { json: { error: string } }
-      }
-    >
-
-    type AppFiltered = PickResponseByStatusCode<AppWithGlobalErrors, 200 | 400>
-
-    const client = hc<AppFiltered>('http://localhost')
-    const req = client.api.users.$get
-
-    type ResponseType = InferResponseType<typeof req>
-    type Expected = { users: string[] } | { error: string }
-    type verify = Expect<Equal<ResponseType, Expected>>
-  })
-})