diff --git a/packages/axues/src/create.ts b/packages/axues/src/create.ts index c733409..287c167 100644 --- a/packages/axues/src/create.ts +++ b/packages/axues/src/create.ts @@ -29,7 +29,7 @@ function throwErr (err: string | Error) { } export function createAxues (axiosInstance: AxiosInstance, createOptions?: CreateAxuesOptions) { - const { requestConfig, responseHandle, errorHandle, cacheInstance, errorReport, loadingDelay = 300, overlayImplement: baseOverlayImplement } = createOptions || {} + const { requestConfig, transformUseOptions, responseHandle, errorHandle, cacheInstance, errorReport, loadingDelay = 300, overlayImplement: baseOverlayImplement } = createOptions || {} // @ts-expect-error const request: Axues = config => { const baseConfig = requestConfig?.() || {} @@ -44,7 +44,7 @@ export function createAxues (axiosInstance: AxiosInstance, createOptions?: Creat return new Promise((resolve, reject) => { axiosInstance(axiosConfig).then( response => { - const res = responseHandle?.(response) || response.data + const res = responseHandle?.(response, axiosConfig) || response.data if (res instanceof Error) { reject(res) } else { @@ -52,7 +52,7 @@ export function createAxues (axiosInstance: AxiosInstance, createOptions?: Creat } }, err => { - const handledErr = errorHandle?.(err) || err + const handledErr = errorHandle?.(err, axiosConfig) || err reject(handledErr) } ) @@ -99,6 +99,9 @@ export function createAxues (axiosInstance: AxiosInstance, createOptions?: Creat const useFn = (options: UseAxuesOptions): UseAxuesOutput => { if (!options) throw new Error('options is required') + if (transformUseOptions) { + options = transformUseOptions(options) + } const { promise, immediate = false, @@ -214,6 +217,7 @@ export function createAxues (axiosInstance: AxiosInstance, createOptions?: Creat if (promise) { requestApi = promise(actionPayload, ac?.signal) } else { + // call transformUseOptions let requestOptions = resolveRequestOptions(options, actionPayload) if (ac) { requestOptions = { diff --git a/packages/axues/src/types.ts b/packages/axues/src/types.ts index 9d99ead..d8d104a 100644 --- a/packages/axues/src/types.ts +++ b/packages/axues/src/types.ts @@ -55,8 +55,9 @@ export interface Axues { } export interface CreateAxuesOptions { requestConfig?: () => AxiosRequestConfig - responseHandle?: (response: AxiosResponse) => unknown - errorHandle?: (err: AxiosError) => Error + transformUseOptions?: (options: UseAxuesOptions) => UseAxuesOptions + responseHandle?: (response: AxiosResponse, requestConfig: AxuesRequestConfig) => unknown + errorHandle?: (err: AxiosError, requestConfig: AxuesRequestConfig) => Error cacheInstance?: CacheInstance errorReport?: (err: Error) => void loadingDelay?: number @@ -75,6 +76,8 @@ export interface AxuesRequestConfig extends Omit contentType?: MaybeComputedOrActionRef headers?: MaybeComputedOrActionRef + responseHandlingStrategy?: any + errorHandlingStrategy?: any } export type DebounceMode = 'firstPass' | 'lastPass' | 'none' diff --git a/packages/axues/test/handleStrategy.test.ts b/packages/axues/test/handleStrategy.test.ts new file mode 100644 index 0000000..8ebe857 --- /dev/null +++ b/packages/axues/test/handleStrategy.test.ts @@ -0,0 +1,103 @@ +import { describe, test, expect } from 'vitest' +import { createAxues, useAxues } from '../src' +import axios from 'axios' +import { defineComponent } from 'vue' +import { mount, flushPromises } from '@vue/test-utils' +// @vitest-environment happy-dom +let resStrategy = 0 +let errStrategy = 0 +let errStrategyInRes = 0 +const instance = axios.create({ baseURL: 'https://axues.io' }) +const axues = createAxues(instance, { + transformUseOptions: options => { + if (options.errorOverlay) { + options.errorHandlingStrategy = 2 + } + if (options.method === 'post') { + options.responseHandlingStrategy = 1 + } + return options + }, + responseHandle: (response, { responseHandlingStrategy, errorHandlingStrategy }) => { + resStrategy = responseHandlingStrategy || 0 + errStrategyInRes = errorHandlingStrategy || 0 + return response.data + }, + errorHandle: (err, { errorHandlingStrategy }) => { + console.log('111111111111', errorHandlingStrategy) + errStrategy = errorHandlingStrategy || 0 + return err + } +}) + +function getWrap (component: any) { + return mount(component, { + global: { + plugins: [axues] + } + }) +} + +describe('handlingStrategy', () => { + test('errorHandlingStrategy in resHandle', async () => { + const TestComponent = defineComponent({ + setup () { + const { action } = useAxues({ + url: '/get', + immediate: true, + errorOverlay: 'foo' + }) + return { action } + }, + template: '' + }) + getWrap(TestComponent) + expect(errStrategyInRes).toBe(0) + expect(errStrategy).toBe(0) + expect(resStrategy).toBe(0) + + await flushPromises() + expect(resStrategy).toBe(0) + expect(errStrategyInRes).toBe(2) + expect(errStrategy).toBe(0) + }) + + test('errorHandlingStrategy with error', async () => { + const TestComponent = defineComponent({ + setup () { + const { action } = useAxues({ + url: '/getError', + immediate: true, + errorOverlay: 'foo' + }) + return { action } + }, + template: '' + }) + getWrap(TestComponent) + expect(errStrategy).toBe(0) + + await flushPromises() + expect(errStrategy).toBe(2) + }) + + test('responseHandlingStrategy', async () => { + const TestComponent = defineComponent({ + setup () { + const { action } = useAxues({ + url: '/postWithJsonData', + method: 'post', + immediate: true, + errorOverlay: 'foo' + }) + return { action } + }, + template: '' + }) + getWrap(TestComponent) + expect(resStrategy).toBe(0) + + await flushPromises() + expect(resStrategy).toBe(1) + }) +})