この記事は タイムリープTypeScript 〜TypeScript始めたてのあの頃に知っておきたかったこと〜 5日目の記事です。 はじめに 自分がTypeScriptを書き始めた頃に苦労したのが、Jestでテストを書くときのモックの型をどう書けば良いか分からないことでした。 調べても型の指定方法が分からず、泣く泣く as any でコンパイラーを黙らせて、補完が効かなくなりモヤモヤしながらテストコードを書いていました。 TypeScriptで型を妥協してテストコードを書いていた時は次のような弊害もあったので、どう型安全にテストコードを書けば良いのか非常に知りたかったです。 補完が効かなくなるのでコーディングが面倒になる プロパティをタイポした事に気づかずに、テストが失敗しても失敗している原因に気付けず疲弊する もくじ モジュールモックの型指定 関数モックの型指定 スパイモックの型指定 モ
互換性 サポートされている Node のバージョンは、14.15、16.10、18.0 以上です。 スナップショットのフォーマット Jest 28 ブログ記事で発表されたとおり、Jest 29 には次のようなデフォルトのスナップショットのフォーマットの変更があります。 {escapeString: false, printBasicPrototype: false} 古い動作を維持したい場合は、snapshotFormat プロパティを次のように設定できます。
Jest + TypeScript + Vue 3環境で Vue Testing Library(@testing-library／vue) を動かす フロントエンド連載の1記事目です。 TIG DXユニットの中川旭です。新卒で2020年10月に入社しました。初記事です。 作業が詰まったときや実際に作業するのが面倒なときのために、この記事を最後まで作業をした後のコードを下のリポジトリに置きます。 https://github.com/modockey/Init-VueTestingLibrary Vue Testing LibraryのいいところVue Testing LibraryはVue.js公式のライブラリであるvue-test-utilをベースとする、DOM Testing LibraryのVue.js用拡張です。 Vue Testing Libraryを用いると、Vue.js公式
構成 node 16.12.0 Vite 3.0.7 Vue 3.2.37 TypeScript 4.6.4 やりたいこと JestとTesting Libraryを入れてVueとTypeScriptのテストコードを書きたい。 入れたもの Jest 28.1.3 Jest Emvironment JSDom 18.1.3 @type/jest 28.1.7 @vue/vue3-jest 28.1.0 ts-jest 28.0.8 作業手順 Vue3のドキュメント内のテストのところとViteで構築した開発中のVue3のプロジェクトにJestを導入するを参考にやっていく。 最初にJestをインストールして jest --init でセットアップはすぐに完了。 jest.config.mjsが作られる。 package.jsonのscriptにtest: "jest" を追加。 ただ npm r
前回 React の テスト方針を調べたでテスト環境について調べました。 今回は、Vite + React + TypeScript + EsLint + Prettier に テスト環境を Jest + Testting Library を ステップbyステップで作っていきます。 環境作成 まずは Viteを使って、React + TypeScript を作成し、EsLint + Prettier を導入した状態までのプロジェクトを用意します。 環境作成の詳細 Viteを使用したアプリの作成方法 → 参考 EsLint + Prettier の導入方法 → 参考1、参考2 環境作成用のコマンド Viteを使用してReact(TypeScript)アプリを、「testsample-app」というアプリ名で作成します。 npm init vite testsample-app -- --te
Viteで構築した、開発中のVue3プロジェクトに途中からJestを導入した際にすこし手こずったので、備忘録としてまとめます。 TypeScriptは使っていないです。 手順 1. Jest のセットアップ
Reactを学び始めてコードを書けるようになったので記述したコードのテストを実行してみたいという人を対象にReactでのテスト方法について説明を行っています。 Testing Libraryとは？Jestとは？ Reactでのテストを行う前にテストに利用するライブラリについて説明を行っておきます。 ReactアプリケーションのテストはTesting Library、Jestを利用して行うことができます。Testing LibararyもJestもReactに限定されたライブラリではありません。VueやSvelteを含めた他のフレームワークでも利用することができます。Testing LibararyではReact用のReact Testing Libraryが提供されておりcreate-react-appを利用してReactプロジェクトを作成すると自動でインストールされます。Tesing L
初めに 自分の趣味プロジェクトは、vue-test-utils + Jestの構成でテストを書いています。 そろそろJestのバージョンを上げようかなと思い、Jest v27にバージョンを上げてみたところ、mount / shallowMount で下記のエラーが出てテストが落ちるようになりました。 [vue-test-utils]: window is undefined, vue-test-utils needs to be run in a browser environment. You can run the tests in node using jsdom See https://vue-test-utils.vuejs.org/guides/#browser-environment for more details. vue-test-utils + Jestの構成にしてい
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
