【プログラミング】msw-storybook
公開されている実践的な javascript プログラムです
https://github.com/mswjs/msw-storybook-addon/blob/main/packages/msw-addon/src/mswDecorator.ts
こちらを改行,space部分など整形したものです。
15分程度かかります。
こちらを改行,space部分など整形したものです。
15分程度かかります。
関連タイピング
-
Mrs.GREEN APPLEの青と夏です！
プレイ回数16万 歌詞1030打 -
Mrs.GREEN APPLEの恋と吟です！
プレイ回数1210 歌詞860打 -
ヨルシカさんのただ君に晴れです！
プレイ回数1262 歌詞かな879打 -
めっちゃいい曲....
プレイ回数3.4万 歌詞かな200打 -
テトリスサビ！！！！！！！！！！！！！！！！！！
プレイ回数14万 歌詞かな167打 -
プレイ回数41 歌詞英字338打 -
M!LKのイイじゃん （フル）
プレイ回数5149 歌詞120秒 -
主人公ケイトによる物語です
プレイ回数3.7万 長文かな1417打
問題文
ふりがな非表示
ふりがな表示
(import { isNodeProcess } from 'is-node-process')
import { isNodeProcess } from 'is-node-process'
(import type { DecoratorFunction, StoryContext } from '@storybook/addons')
import type { DecoratorFunction, StoryContext } from '@storybook/addons'
(import type { SetupWorkerApi, RequestHandler } from 'msw')
import type { SetupWorkerApi, RequestHandler } from 'msw'
(import type { SetupServerApi } from 'msw/node')
import type { SetupServerApi } from 'msw/node'
(export type SetupApi = SetupWorkerApi | SetupServerApi)
export type SetupApi = SetupWorkerApi | SetupServerApi
(export type InitializeOptions =)
export type InitializeOptions =
(| Parameters<SetupWorkerApi['start']>[0])
| Parameters<SetupWorkerApi['start']>[0]
(| Parameters<SetupServerApi['listen']>[0])
| Parameters<SetupServerApi['listen']>[0]
(export type DecoratorParameters = {)
export type DecoratorParameters = {
(msw?:)
msw?:
(| RequestHandler[])
| RequestHandler[]
(| { handlers: RequestHandler[] | Record<string, RequestHandler> })
| { handlers: RequestHandler[] | Record<string, RequestHandler> }
(export interface DecoratorContext extends StoryContext {)
export interface DecoratorContext extends StoryContext {
(parameters: StoryContext['parameters'] & DecoratorParameters)
parameters: StoryContext['parameters'] & DecoratorParameters
(const IS_BROWSER = !isNodeProcess())
const IS_BROWSER = !isNodeProcess()
(let api: SetupApi)
let api: SetupApi
(export function initialize(options?: InitializeOptions): SetupApi {)
export function initialize(options?: InitializeOptions): SetupApi {
(if (IS_BROWSER) {)
if (IS_BROWSER) {
(const { setupWorker } = require('msw'))
const { setupWorker } = require('msw')
(const worker = setupWorker())
const worker = setupWorker()
など
(worker.start(options))
worker.start(options)
(api = worker)
api = worker
(} else {)
} else {
(/**)
/**
(* Webpack 5 does not provide node polyfills as it did before.)
* Webpack 5 does not provide node polyfills as it did before.
(* Also, it can't tell whether a code will be executed at runtime, so it has to process everything.)
* Also, it can't tell whether a code will be executed at runtime, so it has to process everything.
(* This branch of the conditional statement will NEVER run in the browser, but Webpack can't know so)
* This branch of the conditional statement will NEVER run in the browser, but Webpack can't know so
(* it breaks builds unless we start providing node polyfills.)
* it breaks builds unless we start providing node polyfills.
(*)
*
(* As a workaround, we use __non_webpack_require__ to tell Webpack to ignore this, and we define it)
* As a workaround, we use __non_webpack_require__ to tell Webpack to ignore this, and we define it
(* to globalThis so it works correctly when running in node.)
* to globalThis so it works correctly when running in node.
(* @see https://github.com/webpack/webpack/issues/8826#issuecomment-660594260)
* @see https://github.com/webpack/webpack/issues/8826#issuecomment-660594260
(*/)
*/
(const nodeVer = typeof process !== "undefined" && process.versions?.node;)
const nodeVer = typeof process !== "undefined" && process.versions?.node;
(const nodeRequire = nodeVer)
const nodeRequire = nodeVer
(? typeof __webpack_require__ === "function")
? typeof __webpack_require__ === "function"
(? __non_webpack_require__)
? __non_webpack_require__
(: require)
: require
(: undefined;)
: undefined;
(const { setupServer } = nodeRequire('msw/node'))
const { setupServer } = nodeRequire('msw/node')
(const server = setupServer())
const server = setupServer()
(server.listen(options))
server.listen(options)
(api = server)
api = server
(return api)
return api
(export function initializeWorker(options?: InitializeOptions): SetupApi {)
export function initializeWorker(options?: InitializeOptions): SetupApi {
(console.warn()
console.warn(
(`[MSW] "initializeWorker" is now deprecated, please use "initialize" instead.)
`[MSW] "initializeWorker" is now deprecated, please use "initialize" instead.
())
)
(return initialize(options))
return initialize(options)
(export function getWorker(): SetupApi {)
export function getWorker(): SetupApi {
(if (api === undefined) {)
if (api === undefined) {
(throw new Error()
throw new Error(
(`[MSW] Failed to retrieve the worker: no active worker found. Did you forget to call "initialize"?`)
`[MSW] Failed to retrieve the worker: no active worker found. Did you forget to call "initialize"?`
())
)
(return api)
return api
(export const mswDecorator: DecoratorFunction = ()
export const mswDecorator: DecoratorFunction = (
(storyFn,)
storyFn,
(context: DecoratorContext)
context: DecoratorContext
() => {)
) => {
(const {)
const {
(parameters: { msw }, = context)
parameters: { msw }, = context
(if (api) {)
if (api) {
(api.resetHandlers())
api.resetHandlers()
(if (msw) {)
if (msw) {
(if (Array.isArray(msw) && msw.length > 0) {)
if (Array.isArray(msw) && msw.length > 0) {
(// Support an Array of request handlers (backwards compatability).)
// Support an Array of request handlers (backwards compatability).
(api.use(...msw) else if ('handlers' in msw && msw.handlers) {)
api.use(...msw) else if ('handlers' in msw && msw.handlers) {
(// Support an Array named request handlers handlers)
// Support an Array named request handlers handlers
(// or an Object of named request handlers with named arrays of handlers)
// or an Object of named request handlers with named arrays of handlers
(const handlers = Object.values(msw.handlers))
const handlers = Object.values(msw.handlers)
(.filter(Boolean))
.filter(Boolean)
(.reduce()
.reduce(
((handlers, handlersList) => handlers.concat(handlersList),)
(handlers, handlersList) => handlers.concat(handlersList),
([] as RequestHandler[])
[] as RequestHandler[]
())
)
(if (handlers.length > 0) {)
if (handlers.length > 0) {
(api.use(...handlers))
api.use(...handlers)
(return storyFn())
return storyFn()