並び順

ブックマーク数

期間指定

  • から
  • まで

1 - 34 件 / 34件

新着順 人気順

mswの検索結果1 - 34 件 / 34件

タグ検索の該当結果が少ないため、タイトル検索結果を表示しています。

mswに関するエントリは34件あります。 testjavascriptAPI などが関連タグです。 人気エントリには 『若い患者さんが「お金がないので抗がん剤を止める」って言ってきたのでMSWに生活保護などの手続きなどをしてもらったら「再開できます」との連絡がきた』などがあります。
  • 若い患者さんが「お金がないので抗がん剤を止める」って言ってきたのでMSWに生活保護などの手続きなどをしてもらったら「再開できます」との連絡がきた

    ちばにゃん@社会復帰リハビリ中 @cmy_rl 若い患者さんが、抗がん剤止める、って言ってきて、よくよく話を聞いたら、本当はやりたいけど治療費が払えないらしく。そこからMSW入れて福祉事務所に連絡取って、医療費部分だけでも生活保護取れないかと手続きしてもらって、昨日、「治療再開できます」と連絡きた。良かったね!と声出た。 2024-04-23 08:00:27

      若い患者さんが「お金がないので抗がん剤を止める」って言ってきたのでMSWに生活保護などの手続きなどをしてもらったら「再開できます」との連絡がきた
    • フロントエンドのテストのモックには msw を使うのが最近の流行りらしい

      皆様フロントエンドのテストを書いていらっしゃいますでしょうか? フロントエンドのテストを書くときには API コールする処理を全てモックする必要があります。外部の API をコールする処理をテストに含めると API サーバーが落ちているなどの外部の要因によってテストが失敗してしまう可能性がありますし、テストを実行するたびに実際に API をコールしてしまうとサーバーに負荷がかかってしまうなど外部に対しても悪影響を与えてしまいます。 さて、従来のモックする手段としては Jest のモックを利用して axios や fetch などのモジュールをモック化する手法がよく使われていたかと思います。 最近のテスト手法として API コールをモックする際に Jest ではなく Mock Service Worker (以下 msw )を使用する手法が注目されています。実施にどのように使用されているのか

        フロントエンドのテストのモックには msw を使うのが最近の流行りらしい
      • Next.js と MSW 高階関数

        本稿では Next.js アプリ設計と同時に検討しておきたい、API Mocking の設計(MSW の活用テクニック)を紹介していきます。※ 解説のなかで jest を使いますが、ここは特別こだわりがあるわけではありません。 MSW で表現する API 群 MSW は Next.js アプリのローカル開発に役立ちます。任意の API を任意のレイヤーで、個別にインターセプト可能です。 「ブラウザー → API Routes」間でインターセプト 「API Routes → API 群」間でインターセプト 「getServerSideProps → API 群」間でインターセプト また、自動テストに利用でき、フロントエンドの単体・結合テストが書きやすくなります。同一プロセスでサーバーレスポンスをモックするため、外部プロセスに依存しない、高速な自動テストを回すことができます。 MSW 高階関数

          Next.js と MSW 高階関数
        • OpenAPI × Orval × MSW × Next.jsでのスキーマ駆動開発実践 #techtekt Advent Calendar 2022 - techtekt

          この記事は techtekt アドベントカレンダー2022 の15日目の記事です🔥 その他にも記事が掲載されていますので、興味がある方は#techtekt Advent Calendar 2022で検索してみてください! はじめに はじめまして。パーソルキャリア株式会社のサービス開発部でエンジニアをしている西澤と申します。 HR forecasterという採用支援サービスのフロントエンドエンジニアを担当しています。今回はそのプロジェクト内で新たに組み上げた開発体制で導入したスキーマ駆動開発の流れについて紹介したいと思います🙋‍♂️ 目次 開発環境 導入背景 スキーマ駆動開発って何? OASのディレクトリ構成 OASを利用した型の生成・モックコードの生成 Next.jsでMSWを動かす おわりに 開発環境 Next.js 12.3.4 React 18.2.0 TypeScript 4.

            OpenAPI × Orval × MSW × Next.jsでのスキーマ駆動開発実践 #techtekt Advent Calendar 2022 - techtekt
          • Next.jsにnext/testmodeという概念が出現しMSW x Playwrightのテストがやりやすくなりそう

            2023年8月15日にリリースされた Next.js v13.4.16から next/experimental/playwright next/experimental/playwright/msw が登場してテストがしやすくなりそう。というお話です! 前提条件 今回お話するのは、Next.js の開発サーバーに対してMSWによりAPI通信をモックしてPlaywrightで行うブラウザテストのことをお話します これまでは? Page RouterかつCSRに関して言えば、MSWでモックすることは可能でした。exampleとしてすでに公式が提供しているので、これをベースにセットアップすれば可能です 現状の課題 Page Router CSRの場合はブラウザ上のservice worker経由でmswが実行されています。なのでmswのserver.useを使うにはそこそこ工夫が必要です。 有志

              Next.jsにnext/testmodeという概念が出現しMSW x Playwrightのテストがやりやすくなりそう
            • MSW を活用した WebAPI リグレッションテスト

              MSW はネットワークレベルでリクエストをインターセプトする、自動テストで便利なモックサーバーです。過去記事でも紹介したとおり、スパイ(モック関数)をネットワークレベルに忍ばせることが可能です。実際に WebAPI が呼ばれた時の Payload の検証は、Jest 組み込みのモック機能では実現できない領域です。本稿は「WebAPI リグレッションテスト」を実施するための、MSW 活用方法を解説します。記事で使用しているサンプルコードはこちら。 課題の概要 Web アプリケーションページのほとんどは「1.UI を表示し/2.入力操作し/3.WebAPI 通信し/4.通信後処理を行う」という一連処理が責務です。このようなページに書かれるテストは、WebAPI 通信前後に集中しがちです。MSW を使用すると、以下の図の様に「送信後処理」まで到達可能なため、例えば「WebAPI レスポンスが返っ

                MSW を活用した WebAPI リグレッションテスト
              • MSW で加速するフロントエンド開発

                みなさん、フロントエンド開発時のモックサーバーは何を使っていますか?モックサーバーといっても様々なアプローチがあると思いますが、最近活用している MSW が便利だったので紹介します。MSW(Mock Service Worker)はブラウザリクエストを Service Worker がインターセプトし、任意のレスポンスを返すことが出来るライブラリです。 次の様な Express 風ハンドラーで、モックレスポンスを表現することができます。なんとこのコードがブラウザで動いてしまいます。 import { setupWorker, rest } from "msw"; const worker = setupWorker( rest.get("https://myapi.dev/csr", (req, res, ctx) => { return res( ctx.json({ title: "C

                  MSW で加速するフロントエンド開発
                • [msw, Jest, Node.js] mswを利用してHTTP境界のテストを書く

                  JestでHTTPリクエストをインターセプトしてモックを返すのに利用したMock Service Worker(msw)の紹介をしたいと思います。環境はNodeです。 テスト対象の実装 http://example.com/examples からデータを取得する、という想定の実装です。 import fetch from 'isomorphic-unfetch'; export class GetExampleError extends Error {} export async function getExamples(): Promise<string> { const result = await fetch('http://example.com/examples'); if (!result.ok) { throw new GetExampleError('Received ge

                    [msw, Jest, Node.js] mswを利用してHTTP境界のテストを書く
                  • jest における MSW の活用事例

                    MSW を使った jest のテストについて、引数などの検査が面倒という記事を拝見したので、もし同様にアプローチを模索されている方がいらっしゃれば参考に、と思い記事にしました。筆者は普段以下の様に、server.use内にjest.fnを仕込みテストしています。例えば API が2回呼ばれたことを検証する場合、次の様になります。 const server = setupMockServer(...handlers); describe("API call の検証", () => { const mockFn = jest.fn(); beforeEach(() => { server.use( rest.get("/path/to/api", async (req, res, ctx) => { mockFn(); // <- here return res(ctx.json({}));

                      jest における MSW の活用事例
                    • GitHub - mswjs/msw: Seamless REST/GraphQL API mocking library for browser and Node.js.

                      You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert

                        GitHub - mswjs/msw: Seamless REST/GraphQL API mocking library for browser and Node.js.
                      • tRPC と MSW の統合

                        tRPC は Next.js プロジェクトの生産性を向上させるライブラリです。サーバー側定義の型推論が API Client にダイレクトに伝搬するだけでなく、Zod スキーマによる入力値制約が施せます。そのため、Client ⇄ API Routes 間の疎通がEnd-to-end typesafeになる、便利なライブラリです。 tRPC と MSW の統合要点 筆者はテスト・Storybook をコミットする際に MSW をよく利用しています。次の様に任意の URL リクエストをインターセプトして、スタブを返却できます。 import { rest } from 'msw' export const handlers = [ rest.get('https://api.github.com/user/:login', (req, res, ctx) => { return res(ct

                          tRPC と MSW の統合
                        • OpenAPI定義をmswに活用してお手軽モック

                          Leaner 開発チームの黒曜(@kokuyouwind)です。 RubyKaigi Takeout 2021真っ只中ですね。自分も視聴して実況ツイートを垂れ流しています。 でも今回はフロントエンドの話です。 TL;DR OpenAPI 定義を JSON で記述しておくと、 import schema from 'schema.json' で読み込んで Component などの定義を参照できます。 これを使って msw の Handler を定義すると、簡単に API をモックしてテストできるので便利です。 異常系のハンドラーも同じところで定義しておくと、テスト時のレスポンス差し替えもシンプルになって読みやすくなります。 OpenAPI 定義を msw に使いたい 以前書いたとおり、現在自分が担当しているプロダクトでは OpenAPI を使って API スキーマを定義しています。 このス

                            OpenAPI定義をmswに活用してお手軽モック
                          • Storybook × MSW × Chromaticを使ったUIの影響範囲を自動検知するための取り組み - ZOZO TECH BLOG

                            こんにちは、FAANS部の田中です。普段は、WebのフロントエンドエンジニアとしてFAANSの開発を行なっています。 FAANSの由来は「Fashion Advisors are Neighbors」で、「ショップスタッフの効率的な販売をサポートするショップスタッフ専用ツール」です。現在正式リリースに向けて、WEARと連携したコーディネート投稿機能やその成果を確認できる機能など開発中です。プラットフォームとしてはWeb、iOS、Androidが存在し、今回取り上げるWebはショップ店長をはじめとした管理者向けツールという立ち位置です。 本記事では、FAANSのWebにおけるStorybook × MSW × Chromaticを使ったUIの影響範囲を自動検知するための取り組みを紹介します。 はじめに FAANSのWebはReact、TypeScriptで構成されています。設計に関しては、ロ

                              Storybook × MSW × Chromaticを使ったUIの影響範囲を自動検知するための取り組み - ZOZO TECH BLOG
                            • 病院で相談したい悩み…医療ソーシャルワーカー(MSW)に相談した体験談

                              の問題の解決、調整を援助し、社会復帰の手助けをする人です。 (ソーシャルワークとは社会福祉のことです) ソーシャルワーカーはどこで活躍しているかで呼び名が分類されます。 ここでは医療機関で働いている医療ソーシャルワーカー(MSW:メディカル・ソーシャルワーカー)の紹介です。 医療ソーシャルワーカーという資格は存在しませんが、一般的に「社会福祉士」や「精神保健福祉士」を保有していることがほとんどです。 具体的な相談内容とは? 厚生労働省の業務指針より引用します。 療養中の心理的・社会的問題の解決、調整援助 退院援助 社会復帰援助 受診・受療援助 経済的問題の解決、調整援助 地域活動 出典:厚生労働省 医療ソーシャルワーカー(MSW)の業務指針(抜粋)

                                病院で相談したい悩み…医療ソーシャルワーカー(MSW)に相談した体験談
                              • mswとgraphql codegenでGraphQLをモックし、効果的で効率的なReactのテストを書く

                                はじめに:テスト戦略の話 そもそもフロントエンドのテストって何をどんな粒度で書けばいいの?という疑問はよくあると思います。これについては以前Qiitaの記事: フロントエンドでTDDを実践する(理論編)で書いているので詳細は省きますが、Testing Trophyの戦略に則り、integration testを中心とし、unitテストは本当に有効なものに絞って書くというのがフロントエンドにおいては有効です。 APIモック フロントエンドのintegration testにおいて課題になるのがAPIのモックです。urqlやapollo clientのようなGraphql Clientでもqueryをモックする仕組みはありますが、どちらもclient自体をモックするような書き方になります。一見問題ないようですが、client側でキャッシュの挙動を制御したりできることもあり、本番コードと異なるコ

                                  mswとgraphql codegenでGraphQLをモックし、効果的で効率的なReactのテストを書く
                                • PlaywrightとmswでスマートなE2Eテストを実現 - MONEX ENGINEER BLOG │マネックス エンジニアブログ

                                  こんにちは。システム開発一部の吉田です。 最近初めてパーマをかけてみたら元々の天パと掛け合わさって髪がモジャモジャになりました。気に入ってはいますけど取れるのがいつになるのか心配です。 絶賛開発中のフロントエンド領域でPlaywrightとmswを用いたE2Eテスト(End to End Test)の導入をしました。これらのツールの導入に至った経緯と簡単な使い方をご紹介します。 以前書いたモックサーバーの記事の内容も含んでいるので、ご覧になっていない方は以下を参照してみてください。 blog.tech-monex.com E2Eテストのスコープ E2Eテストの概要はCircleCIの記事を見るとなんとなくわかった気になれます。 circleci.com 一言で言うと、E2Eテストとはユーザーが実際に操作する状況をシミュレートし、アプリケーション全体の動作を検証するテスト手法のことです。 ア

                                    PlaywrightとmswでスマートなE2Eテストを実現 - MONEX ENGINEER BLOG │マネックス エンジニアブログ
                                  • 2023-10-31のJS: Next.js 14、MSW 2、Node.js 21.1.0

                                    JSer.info #667 - Next.js 14がリリースされました。 Next.js 14 | Next.js Release v14.0.0 · vercel/next.js Node.js 16のサポート終了、next exportコマンドを非推奨化、next/imageのdomainsオプションを非推奨化などの変更が含まれています。 また、Server ActionsのStable化、Metadata APIの改善が含まれています。 実験的な機能として<Suspense>を使ったPartial Prerenderingのサポートが追加されています。 今回のリリースに合わせて、Next.jsのチュートリアルも新しいものが公開されています。 Next.js by Vercel - The React Framework | Next.js by Vercel - The Reac

                                      2023-10-31のJS: Next.js 14、MSW 2、Node.js 21.1.0
                                    • Introducing MSW 2.0

                                      This November marks five years since Mock Service Worker has been first added to a package.json. Over that time, I have learned a lot about building libraries, designing APIs, and cultivating communities, which makes today’s announcement all the more special. Version 2.0 marks a monumental chapter for MSW. A year in development, dozens of contributors, and thousands of lines changed, this update b

                                        Introducing MSW 2.0
                                      • OpenAPIとMSWを使用しAPIレスポンスに対するStorybookを作成する

                                        ファンタラクティブのエンジニアの 太田 です。 OpenAPIスキーマで定義したレスポンスに対するexampleをmswとstorybookでも使用してAPIスキーマで想定したレスポンスをStorybookで確認できるようにする試みについて紹介します。 やりたいこと OpenAPIスキーマで定義したexamplesを参照してmswでAPIモックを定義、定義したAPIモックをstorybookで使用 嬉しいこと APIで想定したレスポンスに対してフロントの挙動をStorybook上で確認できるのでAPIとフロントの認識のずれが改善されます。 エラーの表示や、権限によるUIの出し分けなど大変な確認を、APIスキーマで定義した内容を網羅する形でStorybook上で確認できます。 逆にAPIスキーマに定義されていないものはStoryを作らないので、確認するべきものはすべてAPIスキーマで定義しま

                                          OpenAPIとMSWを使用しAPIレスポンスに対するStorybookを作成する
                                        • Node.js18の環境でmswを使ったらハマった話 | みどりのさるのエンジニア

                                          この記事は YAMAP エンジニア Advent Calendar 2022 7日目の記事です。 mswとは? ネットワークレベルでAPIリクエストをモックできるAPIモックライブラリです。 MSW – Seamless API mocking library for browser and Node | Mock Service Worker Node.js18とグローバルfetch() 今まではfetch()を利用したフロントエンドのコードをNode.js環境でユニットテストを実行するには、グローバルスコープにfetch()が存在しないので、モックをしたりテスト実行時にnode-fetchをPolyfillとして適用してグローバルスコープにfetch()を生やすなどの対応をしていました。 Node.js18から新たにグローバルスコープのfetch APIがデフォルトで利用可能になり、モ

                                            Node.js18の環境でmswを使ったらハマった話 | みどりのさるのエンジニア
                                          • MSW 2.0やYarn 4.0のリリースなど : Cybozu Frontend Weekly (2023-10-24号)

                                            MSW 2.0やYarn 4.0のリリースなど : Cybozu Frontend Weekly (2023-10-24号) はじめに こんにちは!サイボウズ株式会社フロントエンドエキスパートチームの@nakajmg です。 サイボウズでは毎週火曜日にFrontend Weeklyという「一週間の間にあったフロントエンドニュースを共有する会」を社内で開催しています。 今回は2023年10月24日のFrontend Weeklyで取り上げた記事や話題を紹介します。 Introduction to web sustainability | MDN Blog webの持続可能性についての概要。フォントの最適化や画像サイズの縮小、JavaScriptの使用量を減らすことなどが挙げられています。 ガイドラインの作成も進められています。 How we optimized package imports

                                              MSW 2.0やYarn 4.0のリリースなど : Cybozu Frontend Weekly (2023-10-24号)
                                            • msw が Service Worker に依存する時代が終わっていた話 - とろろこんぶろぐ

                                              概要 msw はいつの間にかモックツールとしてデファクトスタンダードになりました。 github.com Mock Service Worker という名の通り、Service Worker を利用して、アプリが API サーバーとやりとりするリクエスト/レスポンスをモックすることができるツールです。 ただ、ふと気がついたら Service Worker なしでモックできるようになっていたので、その小ネタを書きます。 この記事は Recruit Engineers Advent Calendar 2022 の9日目の記事です。 adventar.org Node でも使える msw ご存じの方も多いと思いますが、 msw は Node.js でも利用できます。 Node - Getting Started - Mock Service Worker Docs Node.js で利用できるの

                                                msw が Service Worker に依存する時代が終わっていた話 - とろろこんぶろぐ
                                              • Vue, Vitest, Testing Library, MSWを使ってテスト駆動開発するチュートリアル - Qiita

                                                Vue, Vitest, Testing Library, MSWを使ってテスト駆動開発するチュートリアルテストVue.jsテスト駆動開発TestingLibraryVitest 今回は以下のライブラリを中心にVueにおけるテスト駆動開発(TDD)の進め方を説明します。 Vue3 Vitest Testing Library Mock Service Worker Options APIで書きますが、テストコードはComposition APIでも動くので、 Composition APIの実装に多少慣れてる人はぜひとも挑戦してください。 今回の記事の中で作ったコードは以下のリポジトリに収めました。 テスト駆動開発(TDD)ってなに? TDDとはTest Driven Development(テスト駆動開発)の略であり、その文字通り、 テストを先に書いてその後にそのテストを満たすコードを書

                                                  Vue, Vitest, Testing Library, MSWを使ってテスト駆動開発するチュートリアル - Qiita
                                                • Release v2.0.0 · mswjs/msw

                                                  Important This release is a BREAKING CHANGE. Please follow the Migration guidelines to upgrade. This release took a lot of effort to make, and I expect a bit of that effort on your part while upgrading. Most of the changes are mechanical, and a simple Find/Replace All will get you a long way. For the rest of it, you will learn how to handle requests and responses using the standard JavaScript API.

                                                    Release v2.0.0 · mswjs/msw
                                                  • OpenAPIとMSWを組み合わせてAPIモックしている話|食べログ フロントエンドエンジニアブログ

                                                    この記事は食べログアドベントカレンダー2021の10日目の記事です。 こんにちは。食べログ フロントエンドチームの原田です。 現在食べログでは、jQuery+Railsで実装されているフロントエンドをReact/TypeScriptベースに置き換えるリプレースプロジェクトを進めています。 食べログでは、リプレース戦略としてRails上に部分的にReactを導入する戦略をとっており、 以前の記事で部分導入するにあたってRailsに依存しないコンポーネント結合環境を用意していることを紹介しました。 Railsに依存しないコンポーネント結合環境を構築するにあたって必要となるAPIモックについて、 いままでPrismを利用してきましたが、今期に入ってからMock Service Worker(以後、「MSW」と表記)も利用して開発を行っています。 API定義は以前よりOpenAPI(Swagger

                                                      OpenAPIとMSWを組み合わせてAPIモックしている話|食べログ フロントエンドエンジニアブログ
                                                    • Next で MSW (Mock Service Worker) を使うのメモ - かもメモ

                                                      バックエンドの API がまだできてないプロジェクトで Next のフロントを作成することになり開発中の API との通信に噂の MSW を使ってみることにしました。 Next.js 特有の問題でちょいハマりしたので導入完了したところまでのメモ。 MSW (Mock Service Worker) MSW(Mock Service Worker)はブラウザリクエストを Service Worker がインターセプトし、任意のレスポンスを返すことが出来るライブラリです。 cf. MSW で加速するフロントエンド開発 プロダクションのコードのまま API への通信だけを Service Worker がインターセプトしてモックのレスポンスを返すことができるので、バックエンドと切り離してフロントだけを開発することができます!すごい〜 MSW の導入 $ npm i -D msw 開発時だけ使うの

                                                        Next で MSW (Mock Service Worker) を使うのメモ - かもメモ
                                                      • ジョインしたのと同時期に導入されて感動した MSW とその周辺パッケージ についてのお話 - KAKEHASHI Tech Blog

                                                        こちらの記事はカケハシ Advent Calendar 2022 の 13 日目の記事になります。 https://adventar.org/calendars/7444 こんにちは。Musubi AI 在庫管理のフロントエンド開発を担当している鳥海です。 上記プロダクトのフロントエンドチームでは、私がチームにジョインした時(2022/9/1)と同時期から MSW が導入され、開発で用いるようになりました。 今回は、この MSW (とその周辺パッケージ)がすごく便利で感激したので、簡単にご紹介したいと思います。 この記事で紹介するもの この記事では、下記項目についての説明をしていきたいと思います。 基本的に触りのみ紹介しますので、詳細についてはそれぞれのドキュメントをご確認いただけると幸いです。 MSW graphql-codegen-typescript-mock-data msw-st

                                                          ジョインしたのと同時期に導入されて感動した MSW とその周辺パッケージ についてのお話 - KAKEHASHI Tech Blog
                                                        • MSW 2.0 に更新した話 - Qiita

                                                          はじめに LITALICO プロダクトエンジニアリング(PE)部の片桐英人(かたぎり えいと)です。 最近、仕事ナビのフロントエンドのテストや Storybook で使用している Mock Service Worker(msw)を 1.x から 2.0 に更新しました。仕事ナビのメンバーにそのことを伝えるために書いています。 この記事を記載している時点で、最新は、2.0.11 になっていますね… Mock Service Worker (msw) とは? Mock Service Worker(msw)1 は、Service Worker 2 を使って、HTTP リクエストとそのレスポンスをモックするための JavaScript のライブラリ(npm パッケージ)です。 MSW 2.0 MSW 2.0 は、2023年10月末にリリースされました 3。このリリースで、モックの定義方法など多く

                                                            MSW 2.0 に更新した話 - Qiita
                                                          • Mock Service Worker (MSW) + Storybook の設定手順と使用例

                                                            Mock Service Worker (MSW) とは、Service Woker が API リクエストを受け取って、レスポンスを返すことができる API mock ライブラリです。 MSW を使えば、Storybook とテストで共通の API mock handler を使用することができて便利です。 Storybook で MSW を使用するにあたっていくつか設定が必要になります。 調べると 1 コンポーネントしかないような小さな example は出てくるのですが、コンポーネント毎に mock を分けられるような方法にしたかったので、今回はその手順を記録しておきます。

                                                              Mock Service Worker (MSW) + Storybook の設定手順と使用例
                                                            • Connect-WebをMSWでモックする方法|Webフロントエンド

                                                              Connect-WebはgRPCを使いたい人にとっては導入も簡単で使い勝手の良いブラウザ用APIライブラリです。 一方で新しい技術であることからも日本語ドキュメントが少ないという弱点もある。

                                                                Connect-WebをMSWでモックする方法|Webフロントエンド
                                                              • Aspida で型安全な MSW ハンドラーを書く

                                                                MSW のハンドラー型推論 テストや Storybook で利用事例が増えている MSW。GraphQL の場合、@graphql-codegen/typescript-mswというプラグインを使えば、良い感じの MSW ハンドラーを生成してくれます。これがあれば、MSW ハンドラー関数起因のミス削減が期待できます。 import { mockGetUserQuery } from "./generated"; const worker = setupWorker( mockGetUserQuery((req, res, ctx) => { // id の型推論が効いている const { id } = req.variables; return res( ctx.data({ // 型制約が効いており、スキーマに沿ったレスポンスしか返せない getUser: { name: "John

                                                                  Aspida で型安全な MSW ハンドラーを書く
                                                                • ぬん@潮みゅ/10/30【リリマジ/[なのは10]いもポインタ】 on Twitter: "グレープフルーツは沸騰したお湯にドボンと1分。お玉で取り出して水で冷やして、ヘタ側にキッチン鋏で指を引っかける穴を開けたらそこから黄色い皮も中の白い皮もテュルっと剥けるので、あとは薄皮をペラペラ剥いて実を取り出すとたらふく食べられ… https://t.co/NPx1mSW7KK"

                                                                  グレープフルーツは沸騰したお湯にドボンと1分。お玉で取り出して水で冷やして、ヘタ側にキッチン鋏で指を引っかける穴を開けたらそこから黄色い皮も中の白い皮もテュルっと剥けるので、あとは薄皮をペラペラ剥いて実を取り出すとたらふく食べられ… https://t.co/NPx1mSW7KK

                                                                    ぬん@潮みゅ/10/30【リリマジ/[なのは10]いもポインタ】 on Twitter: "グレープフルーツは沸騰したお湯にドボンと1分。お玉で取り出して水で冷やして、ヘタ側にキッチン鋏で指を引っかける穴を開けたらそこから黄色い皮も中の白い皮もテュルっと剥けるので、あとは薄皮をペラペラ剥いて実を取り出すとたらふく食べられ… https://t.co/NPx1mSW7KK"
                                                                  • mswを使ってgraphQLエンドポイントをモックした単体テストを書く | スマートショッピング

                                                                    はじめにこんにちは。フロントエンド/SETエンジニアの@1010realです。 子育て中は自分の事が全て後回しになりますね。。 # 今日の朝ごはんはカップ麺 今回は、新機能の開発において、mock service workerを使ってGraphQLエンドポイントをモックした単体テストを導入したので、それについてまとめてみました。 ちなみに導入に関しては、大部分を以下の記事を参考にさせて頂きました。とても勉強になりました。 mswとgraphql codegenでGraphQLをモックし、効果的で効率的なReactのテストを書く 本記事は上記の導入に際して、細部の環境の差異、実際につまづいた点および自分が調べた点を追加した内容になっております。 目次はじめにmswについて導入手順 Typed Document Nodeを生成するmswを設定するテスト用のRender関数を用意するテストを書く

                                                                      mswを使ってgraphQLエンドポイントをモックした単体テストを書く | スマートショッピング
                                                                    • Stop using Swagger-UI and MSW, but SDK instead

                                                                      Summary If you're a frontend developer, stop using swagger-ui and msw. Instead, you can build SDK (Software Development Kit) automatically. Which features SDK contain? Collection of fetch functions DTO structures written in TypeScript Mockup simulator for testing Github Repository: https://github.com/samchon/nestia Related Manual: https://nestia.io/docs/migrate With the SDK, you don't need to be s

                                                                        Stop using Swagger-UI and MSW, but SDK instead
                                                                      1

                                                                      新着記事