はじめに フロントエンド開発において、効率的かつ一貫性のあるモック生成は非常に重要です。本記事では TypeSpec、Orval、Storybook の 3 つのツールを使用して自動生成でモックを実現する方法を紹介します。 TypeSpec は、大規模な API を提供するために Microsoft が開発し、使用している新しい API 記述言語です。 Orval は、OpenAPI 仕様から TypeScript のクライアントコードを生成するツールです。これにより、最新の API 仕様に基づいたクライアントコードを常に保持し、API との通信がスムーズに行えるようになります。 Storybook は、コンポーネントを独立して開発・テストするためのインタラクティブなツールです。コンポーネントの見た目や動作を個別に確認できるため、UI の一貫性を保ちながら効率的に開発を進めることができます

はじめに この記事は我が名は神龍……どんなテストもひとつだけ自動化してやろうの焼き直し……もとい、利用した技術のちゃんとした解説です。 決して元記事がバズったから二匹目のドジョウを狙っているわけではありません。本当です。 エピソード 突然ですが、あなたは非エンジニアです。 あなたの仕事はテスト手順書に従って、リリースの前に手動でテストをすることです。 Chromeで https://kids.yahoo.co.jp/ にアクセス 検索ワードに ねこ と入力して さがすをクリック 検索結果にネコ - Wikipediaが含まれていることを確認 検索結果に 買い方 を追加 さがすをクリック さがしているのは？と表示されることを確認 クリックすると猫の飼い方で再検索されることを確認 ある日、あなたの前にエンジニアがやって来て、こう言いました。 「テスト大変そうだったから自動化してみたよ！どう？」

Vue.jsのコンポーネント開発をTDDでやってみる ※ TDD (test-driven development): テスト駆動開発 ※ テスト駆動開発は文化です。チームの「状況」「納期」「スキルレベル」、その他いろんな要因が絡んできた結果、そのチームが導入するかどうか決めたらいいと思います。 ※ 例えがいいかはわかりませんが、私は「早起き」と「テスト」は同じようなものだと思っています。「早起き」は健康にいいよねって誰でも言うと思うけど、実際に万人がやっているかどうかは別じゃないですか。それと同じで「テストすること」も絶対いいことだと私は思っていますが、やるかどうかはチームの置かれている状況によって決まります。この記事は、その「テストを導入するかどうか」という意思決定の一助にでもなれればいいなと思います。 はじめに こんにちは。ぼくです。 今回はVue.jsでTODOアプリを作ってみよう

膨大なユニットテストを手動でやりたくないし、リグレッションテスト（回帰テスト）も面倒で、テストの自動化をしたい。 ということで、JavaScriptのテストフレームワーク「Jasmine」をつかったテスト駆動開発（ビヘイビア駆動開発）をやってみた。 開発環境と各種バージョンは、以下の通り。 Visual Studio Community 2013 TypeScript Jasmine 2.2（現時点での最新版） 追記：2015/06/07 bowerやtsdを使うともっと簡単にJasmineとその型定義ファイルをダウンロードすることができる。 詳しくは、以下のエントリで。 Jasmine の導入 Visual StudioのNuGetからもインストールできるけど、ディレクトリが変に作られてしまうので、GitHubからダウンロードする。 ※ 私の環境では、scriptフォルダ直下に"jasm

こんにちは丸山@h13i32maruです。 ES6でアプリコード、テストコードを書いてテストをするための環境を作ったので、そのメモです。 目標 ES6で書いたアプリコードとテストコードをnpm run testでテストする 最終的な環境 最終的にはこんな環境になった。リポジトリ ECMAScript6 Google Chrome Travis CI npm traceur-compiler mocha espower-cli karma karma-cli karma-mocha karma-chrome-launcher bower power-assert 今回はgrunt/gulpのようなビルドシステムは入れていない。npm runをタスク実行のフロントとすることでタスク自体はお手軽にshで書いた。shだとwindowsが厳しいけど、まあとりあえず自分の環境用だしいいかなと。 以降で