liwenyun
/
vue3-realworld-example-app
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

chore: fix break changes after upgrade msw

This commit is contained in:
mutoe 2023-11-25 11:26:07 +08:00
parent a38d4681e1
commit d83176b371
No known key found for this signature in database
GPG Key ID: 7197231B847AE2EE
1 changed files with 24 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

49
src/utils/test/test.utils.ts
View File

@ -3,8 +3,7 @@ import type { RouteLocationRaw, Router } from 'vue-router'
import { createMemoryHistory, createRouter } from 'vue-router' import { createMemoryHistory, createRouter } from 'vue-router'
import { createTestingPinia } from '@pinia/testing' import { createTestingPinia } from '@pinia/testing'
import type { RenderOptions } from '@testing-library/vue' import type { RenderOptions } from '@testing-library/vue'
import type { DefaultBodyType, MockedRequest } from 'msw' import { HttpResponse, http, matchRequestUrl } from 'msw'
import { matchRequestUrl, rest } from 'msw'
import type { SetupServer } from 'msw/node' import type { SetupServer } from 'msw/node'
import { setupServer } from 'msw/node' import { setupServer } from 'msw/node'
import { afterAll, afterEach, beforeAll } from 'vitest' import { afterAll, afterEach, beforeAll } from 'vitest'
@ -84,26 +83,26 @@ export function asyncWrapper (component: ReturnType<typeof defineComponent>, pro
}) })
} }
async function waitForServerRequest (server: SetupServer, method: string, url: string, flush = true) { async function waitForServerRequest (server: SetupServer, method: string, url: string, flush = true): Promise<Request> {
let requestId = '' let expectedRequestId = ''
let request: MockedRequest let expectedRequest: Request
const result = await new Promise<MockedRequest>((resolve, reject) => { const result = await new Promise<Request>((resolve, reject) => {
server.events.on('request:start', (req) => { server.events.on('request:match', ({ request, requestId }) => {
const matchesMethod = req.method.toLowerCase() === method.toLowerCase() const matchesMethod = request.method.toLowerCase() === method.toLowerCase()
const matchesUrl = matchRequestUrl(req.url, url).matches const matchesUrl = matchRequestUrl(new URL(request.url), url)
if (matchesMethod && matchesUrl) { if (matchesMethod && matchesUrl) {
requestId = req.id expectedRequestId = requestId
request = req expectedRequest = request
} }
}) })
server.events.on('response:mocked', (_res, reqId) => { server.events.on('response:mocked', ({ requestId: reqId }) => {
if (reqId === requestId) resolve(request) if (reqId === expectedRequestId) resolve(expectedRequest)
}) })
server.events.on('request:unhandled', (req) => { server.events.on('request:unhandled', ({ request: req, requestId: reqId }) => {
if (req.id === requestId) reject(new Error(`The ${req.method} ${req.url.href} request was unhandled.`)) if (reqId === expectedRequestId) reject(new Error(`The ${req.method} ${req.url} request was unhandled.`))
}) })
}) })
flush && await flushPromises() flush && await flushPromises()
@ -131,7 +130,7 @@ type Listener =
* ['GET', '/api/articles/markdown', { article }], * ['GET', '/api/articles/markdown', { article }],
* ['GET', '/api/articles/markdown', 200, { article }], * ['GET', '/api/articles/markdown', 200, { article }],
* ['DELETE', '/api/articles/comment'], * ['DELETE', '/api/articles/comment'],
* ['DELETE', '/api/articles/comment', 204], * ['DELETE', '/api/articles/comment', 204]
* ) * )
* *
* it('...', async () => { * it('...', async () => {
@ -159,8 +158,8 @@ export function setupMockServer (...listeners: Listener[]) {
...listeners.map((args) => { ...listeners.map((args) => {
let [method, path, status, response] = parseArgs(args) let [method, path, status, response] = parseArgs(args)
method = method.toLowerCase() method = method.toLowerCase()
return rest[method as 'all'](`${import.meta.env.VITE_API_HOST}${path}`, (_req, res, ctx) => { return http[method as 'all'](`${import.meta.env.VITE_API_HOST}${path}`, () => {
return res(ctx.status(status), ctx.json(response)) return HttpResponse.json(response, { status })
}) })
}), }),
) )
@ -169,11 +168,11 @@ export function setupMockServer (...listeners: Listener[]) {
afterEach(() => void server.resetHandlers()) afterEach(() => void server.resetHandlers())
afterAll(() => void server.close()) afterAll(() => void server.close())
async function waitForRequest (path: string): Promise<MockedRequest<DefaultBodyType>> async function waitForRequest (path: string): Promise<Request>
async function waitForRequest (path: string, flush: boolean): Promise<MockedRequest<DefaultBodyType>> async function waitForRequest (path: string, flush: boolean): Promise<Request>
async function waitForRequest (method: HttpMethod, path: string): Promise<MockedRequest<DefaultBodyType>> async function waitForRequest (method: HttpMethod, path: string): Promise<Request>
async function waitForRequest (method: HttpMethod, path: string, flush: boolean): Promise<MockedRequest<DefaultBodyType>> async function waitForRequest (method: HttpMethod, path: string, flush: boolean): Promise<Request>
async function waitForRequest (...args: [string] | [string, boolean] | [HttpMethod, string] | [HttpMethod, string, boolean]): Promise<MockedRequest<DefaultBodyType>> { async function waitForRequest (...args: [string] | [string, boolean] | [HttpMethod, string] | [HttpMethod, string, boolean]): Promise<Request> {
const [method, path, flush] = args.length === 1 const [method, path, flush] = args.length === 1
? ['all', args[0]] // ['all', path] ? ['all', args[0]] // ['all', path]
: args.length === 2 && typeof args[1] === 'boolean' : args.length === 2 && typeof args[1] === 'boolean'
@ -191,8 +190,8 @@ export function setupMockServer (...listeners: Listener[]) {
...listeners.map((args) => { ...listeners.map((args) => {
let [method, path, status, response] = parseArgs(args) let [method, path, status, response] = parseArgs(args)
method = method.toLowerCase() method = method.toLowerCase()
return rest[method as 'all'](`${import.meta.env.VITE_API_HOST}${path}`, (_req, res, ctx) => { return http[method as 'all'](`${import.meta.env.VITE_API_HOST}${path}`, () => {
return res(ctx.status(status), ctx.json(response)) return HttpResponse.json(response, { status })
}) })
}), }),
) )