1年半前は 業務 とか 趣味 で TypeScript を使ってテストも書いてたんだけど、最近は iOS ばかりで忘れてしまっていた。 けどまた仕事で同じような環境を作ったので、テストを書くときにどういう Framework があって役割は何かをメモっておく。 テストフレームワーク テストを書くために必要なライブラリ。 iOS でいったら Quick や XCTest, Rails でいったら rspec とかが該当する。 Mocha - the fun, simple, flexible JavaScript test framework BDD フレームワークで、 assertion の機能は持っていない Jasmine Documentation Matcher というアサーションライブラリを内部で持っているようだ Jasmine使い方メモ - Qiita Jest · 🃏 Del
unit test best practices.md What to use Test runner: ava React components testing: enzyme Endpoint testing: express + supertest Mocking framework: sinon External dependencies mocking: proxyquire Test cases all the following examples are using ava syntax, but they may be easily adapted to mocha or tape as well react components import test from 'ava'; import React from 'react'; import {shallow} from
テストランナーとは、様々なブラウザでテストを実行し、その結果をまとめてレポートするためのツールを指します。Karma は Node.js 上で動作するテストランナーです。元々はTestacular という名称で Google が AngularJS の開発で使うために作ったものですが、2012 年にオープンソース化されたタイミングで業 ( カルマ ) を背負った名称に変わりました。 Karma - Spectacular Test Runner for Javascript 本記事では、Jasmine をベースにしてテストコード ( 実処理 ) を記述し、それらを Karma から実行してレポート ( テスト結果 ) を確認するという流れで進めていきたいと思います。 環境構築 前提条件 Mac OS X Yosemite node.js インストール済み (v5.4.0 ~) npm イン
はじめに みなさん、日頃JavaScriptのテストはどのように行っていますか? 昨今ではAngularJSやReactJSを始め、JavaScriptのフレームワークやライブラリを使用してのフロントエンドの開発が当たり前のようになってきております。 ではそのフロントエンド、JavaScriptのテストはどんなツールを使っていますか? mochaやpower-assert、chai、Karma、Jasmine等を組み合わせて使用してテストしているでしょうか。 前置きが少し長くなりましたが、Facebookが開発したオールインワンな「Jest」というツールのReactでのHowto的な使い方から実際のテストでの使用例を交えて紹介したいと思います。 ちなみにこのJest、最近リリースされて話題になったパッケージ管理のYarnでも使われています。 対象バージョン Jest:22.0.4 Reac
Karmaを使うことでフロントエンドの単体テストを楽しくかつ機能的に行うことができます。 ステップを通して少しづつ理解できるように執筆しました。 また、最後に重要だろうと思われる補足内容を記載しました。 Karmaの導入に一役買えれば幸いです。 テスト全体の流れについては以前書いた記事フロントエンドにテストを導入を参照してください。 Karmaとは ブラウザ上で 単体テストを実行するためのテストランナーです。 テストを実行するだけでなくファイルの変更監視や結果のレポートを出力してくれたりと単体テストに必要な機能が一通りそろっています。 特定のフレームワームに依存しておらず汎用的に使えるツールで、プラグインを使った機能の拡張が強力です。 前提 Nodejs,npm,chromeが導入済みであること 流れ Karmaは4つの大きな機能(プラグイン)が存在します。 Step 3 〜 Step 6
This article was peer reviewed by Mark Brown and MarcTowler. Thanks to all of SitePoint’s peer reviewers for making SitePoint content the best it can be! One of the biggest stumbling blocks when writing unit tests is what to do when you have code that’s non-trivial. In real life projects, code often does all kinds of things that make testing hard. Ajax requests, timers, dates, accessing other brow
3行まとめ espower-babelは役目を終えたので、Deprecated Babel + power-assertはbabel-preset-power-assertを使う コード上はrequire("power-assert")とrequire("assert") どちらでもpower-assert化できるようになった espower-babelは非推奨へ Babel + Mocha + power-assertの組み合わせを出来るだけ設定ファイルなどを作らずに使えるespower-babelというモジュールを書いていましたが、役目を終えたので非推奨(deprecated)にしました。 テストコードをES6+power-assertで書けるespower-babel 3.0.0リリース | Web Scratch 理由としては、Babel@6からは設定(ファイル)を必ず必要とするの
Promises are a great way of doing async programming. But testing with promises can be a bit cumbersome, even with the use of the arrow functions syntax. Recently I've found a small and nice package to help to stub tests using Sinon, and the library is sinon-stub-promise. function fetchMovieData() { return fetch("/movies") .then(res => { return res.json(); }) .then(movies => { return movies; }); }
Qiita:Teamに投げた社内ドキュメントだったけど、特に問題ないのでQiitaにも投げる。 前提として browserify-rails とbabelify が導入されている状況を想定してる。 基本方針 新規コードはES2015で書く 本番はbrowserify(-rails)でコンパイルする。 単体テストは node 環境下で走らせる テスト環境下では jsdom で window, document をモックする 単体テストでは ブラウザ特有の挙動はテストしない 裏側の環境(browserifyやspec-helper)は難しくして良いが、利用者からみえる範囲は複雑にしない(npm install; npm testで走る) Universal JavaScript に寄せることでコードのポータビリティを上げる 事前準備 browserify-railsを導入する。 .babelr
Eureka EngineeringLearn about Eureka’s engineering efforts, product developments and more.
2015-03-30 JavaScriptのテスト環境の参考URLメモ(2015-03時点) JavaScript TDD JavaScriptのテスト環境、テストライブラリってどうなってるのか、参考URLをまとめてみました。 結論:ライブラリが数種類あり、それぞれがどこのレイヤーをカバーするのか異なる。そのため、組み合わせはもとより出力形式、CI環境との連携、なにをどこまでテストするのか、開発者のスキル、アプリケーションのライフサイクルなど多数のパラメータのバランシングが必要となる。ライフサイクルの短い使い捨てなら、バランシングのためのコストも無視して「えいやっ」で決めても良いが、そもそもテスト環境の整備が必要なプロジェクトであれば、ライフサイクルもそれなりの規模が想定される。技術者の自己満足や、流行り廃りに焦って拙速な判断を下さないよう厳重な注意が必要とされるだろう。数年後、流行り廃り
Alpacaで主にフロントエンドを担当している北山(@gamella, blog)です。 フロントエンドを開発していると、「ログインして、これをクリックしたら、この表示が行われていること」みたいなUIテストを環境非依存で簡単に行いたいと思うことがありますよね?僕はあります。 Alpacaでは開発にDockerを全面採用しているということもあり、最近ちょくちょく目にするNightmareJSをDocker上で動かして簡単にUIテストを導入できたので、その知見を共有したいとおもいます。 Nightmare まず、どうしてDockerを利用したいかということですがAlpacaでは、すべての機能をDocker上で動作させているため、それに倣っているいうこともありますがUIテストをローカルでもCircleCIでも、Dockerが動作する環境であればどこでもコードの改変なしで実施できるというのは大きな
これまで VanillaJS / jQuery で頑張ってたプロジェクトに React 入れて、Reactは最高!などと言っていたのだけど、E2Eテストが落ちている事に気づいた。 落ちたテストで画面キャプチャしたりして調べた結果、Reactコンポーネントを描画するところで落ちていた。 どうやらPhantomJS1系で見られる現象のようだった。 e2e - CasperJS で Reactjs のサイトをテスト - Qiita E2EテストにはCasperJSを使っていた。 Casper の dependencies は "phantomjs": ">=1.8.2" となっている。 PhantomJS の謎な挙動にはユニットテストでも散々苦しめられていた。 既に polyfill 幾つか入れて対処していたのだけど、良い機会なので別の道を模索してみよう、という話になった。 頑張ってPhanto
Version 1.1.2 - January 27, 2016 This minor release addresses a bug and a new configuration option: A default timeout of 5 seconds was added to check_url task. This should prevent workers from hanging #26. You can now specify a cookie store via an environment variable 'phantomjs_cookies' which will be used by PhantomJS. This env variable simply needs to be a string of key/value cookie pairs. Versi
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く