2017年JavaScriptのテスト概論 | POSTD
本稿は、JavaScriptのテストについて最も重要な根拠、用語、ツール、アプローチなどの知識を身に着けることを目的とした簡略版ガイドブックです。本稿で検討する数々の側面に関する最新の秀逸な記事も紹介しつつ、私たちが経験的に得たことも多少付け加えたいと思います。 Facebookによるテスト用フレームワークであるJestのロゴをご覧ください。 見てお分かりのように、このフレームワークは「苦痛のない」JavaScriptのテストをスローガンに掲げています。しかし、 “次のように言う人” もいます。 苦痛のないテストなんてあり得ない。 実際、Facebookはこのスローガンを掲げるだけの素晴らしい理由があります。一般的にJSのデベロッパは Webサイトのテストにあまり満足していません 。JSのテストには制限があり、実装が難しく、低速である傾向があります。 一方、正しい戦略を立てて適切にツールを
大規模 Web サービスの ブラウザテスト自動化・高速化
https://atnd.org/events/66159 で実施したプレゼン資料
supertest+should+mochaでexpressのrouteをテスト
supertestモジュールを使うとexpressのrouteのテストがすごく楽にかけます。 実装サンプルを載せてみました。 環境 express4.2 supertest0.1.3 mocha 1.20.0 shoud 4.0.0 テスト用express作成 本編とは関係ないですが、テスト用にアプリを作ります。 $ npm install express-generator $ express hoge $ cd hoge $ npm install テストコード作成 ルートディレクトリにtestという名前でディレクトリを作り、そこにテストコードを置いていきます。 $ mkdir -p test/routes ジェネレータで自動生成されるroutes/users.jsをテストしてみます。 ※アプリの立ち上げは必要ありません。 $ vim test/routes/users.test.js
Test Utilities – React
import ReactTestUtils from 'react-dom/test-utils'; // ES6 var ReactTestUtils = require('react-dom/test-utils'); // ES5 with npm Overview ReactTestUtils makes it easy to test React components in the testing framework of your choice. At Facebook we use Jest for painless JavaScript testing. Learn how to get started with Jest through the Jest website’s React Tutorial. Note: We recommend using React Te
React.jsとテスト - Qiita
今回はReact.jsとテストについて書きたいと思います。 React.jsとテスト React.jsのテストということはComponentに対してテストをすることになるので、DOMが絡んで来て辛そうだなと思うかと思いますがReact.jsはAddonとしてReact.addons.TestUtilsに便利な関数を提供してくれているのでそれを使うとテストが書きやすくなります。 DOMは必要？ React.jsのテストを書くとき、server-sideでも動くのでnodeの環境でテストを実行したくなりますが、実際にonClickイベントに反応して〜などのテストを書こうとするとやはりDOMが必要になってきます。 ちなみに、Prop渡してrenderToStaticMarkupを使ってその結果のHTMLを確認するようなテストであればnodeの環境で実行することは出来ます。 イベントのシュミレート
JestでReact.jsアプリケーションのテスト - Qiita
JestでReact.jsアプリケーションのテスト Jestとは facebookがgithub.comに出している テスティングフレームワーク。 JestでReact.jsアプリケーションのテストを書く ...と書くとざっくりしているが、 Jestのサイトで、tutoria/reactに、React.jsアプリケーションでの Jestを使ったサンプルが載っていた。 コードもgithub.com上に上がっている。 githubリポジトリに、コードをそのまま載せてみた。 Jestを使うためのセットアップ 前提条件 node.jsのバージョンは2014年12月現在stableのv0.10.xxであること という条件がある。 React.addons.TestUtils Jest単体はReact.js向けのテストフレームワークとしては書かれておらず、 VirtualDOMを使ったり、clickイ
5分で分かる jasmine テストフレームワーク - モンモンブログ
JavaScript のテストフレームワーク jasmine がゴキゲンだぜ。書きやすいしテスト結果も見やすいしかわいいよちゅっちゅ。 そんな jasmine ちゃんをまだ触ったことない人のために、出来るだけ取っ付き易くなるように解説してみたいと思います。拙作の jQuery プラグイン jquery.narrows.js のテストでも使っておりますので、これをサンプルとして説明していきます。 使用するバージョンは jasmine 2.0.0 RC5 スタンドアローン版。2系はまだRC版ですが、使っていて特に不具合に出くわしたことはないです。2系になって大きく改善してる部分もあるので、アグレッシブに使っていきましょう。（Rubyフレームワーク用の gem 版（jasmine-gem）というのもありますがここでは触れません） まずは見てみよう とりあえず実際に動くものを見てみましょう。jqu
【JavaScript】JavaScriptのテストフレームワーク、「jasmine」の使い方メモ - B-Teck!
ネタ元 下記を参考に自分の必要な部分だけ抜粋しました Jasmine使い方メモ - Qiita jasmineでjavascriptユニットテスト 導入と基礎 jasmin概要 Suite は describe 関数を使い、 Spec は it 関数で宣言する。 this はspecごとに初期化される。spec内のテストでは使いまわす。 suite、specの一文字目にx をつけることで実行しないようにできる。 xdescribe('suite', function() { xit('spec', function() { console.log("suite spec"); }); }); テストメソッド 用途 方法 備考 テスト開始前に処理 beforeEach(); テスト終了後に処理 afterEach(); foo === 1 であるか expect(foo).toBe(1);
jsでTDD！MochaとChaiとsinon.js入門 - lxyuma BLOG
※この記事は社内勉強会向けの資料の下書きです。書きなぐりの下書きで見直すと最後の方の文書がヤバいので、いつか書き直します。読み辛い所は申し訳ないです。 概要 TDD テスト自動化とTDDを整理 TDDとBDDの違い Test Framework in javascript QUnit/jasmine/mochaについて、違いやメリデメを知る mocha 基本的な書き方 アサーションライブラリのメリデメを整理する chai 記述形式の違い整理 基本文法 sinonjs spy stubs mock TDD Test Driven Development テスト駆動開発 by ケントベック 特徴 xUnit系/BDD系のテストフレームワーク使う テストするコードも実装 テストファースト 実装の後にテストするのではなく、テストを先に書いて実装する サイクル Red(失敗) => Green(通過
MochaとChaiでやるJavaScriptテスト
2. Mochaとは JavaScript製のテストフレームワーク HTML内での実行とコマンド実行の両方をサポート 非同期処理を同期化して順番に実行出来る BDDスタイルとTDDスタイルの両方の記法をサポート Assertionライブラリは含まれていないので自分で選択 3. Assertionライブラリ？ Assert系、Should系、Expect系など複数の系統がある 書き方が違うだけでやっていることは同じ assert.equal(a, 5); a.should.equal(5);//ObjectのPrototypeを拡張している Expect(a).to.equal(5); Assertだけでもライブラリ毎に多彩な書き方がある assert.ok assert.isObject assert.match 5. インストール–HTML実行 mocha.
Chai
Chai is a BDD / TDD assertion library for node and the browser that can be delightfully paired with any javascript testing framework.
JavaScript Testing FrameworkのBusterJSを使う
NodeJS製のJavaScript Testing Framweork JsTestDriverによく似ている作り August Lilleaas と Christian Johansenが中心に作成(Githubで公開) Christian Johansen TDDJS(テスト駆動JavaScript)の著者、Sinon.js作者
buster.jsを導入＆オレオレ継続テスト的な何かをやってみる - blog::wnotes.net
TLでFrontrend vol.4行ってきたというエントリが流れてきてていいなー行きたかったなーなんて思いながら、その中でJSのテストツールについてのセッションがあり、あー自分もテストの環境をやらないとなーなんて思いつつ書きました。 Buster.jsを使ってみた JSのテストツールは色々あるようですね。 Jasmine（一番有名かな？） QUnit（ｊQueryが使ってるらしい） mocha（モカ、と読むらしい） で、どれ使うのよ？ってなった時に、「うーんできたらマイナーなのが面白いなー」という悪いクセが出まして、ちょこちょこ探してた所、Buster.jsを見つけました。（ただセッションで紹介されてなかっただけでそれほどマイナーでないかもしれないですね） Buster.js 現在0.6.3が最新版のようです。あと、すでに日本語ドキュメントを作られてる方が…！ いやーほんと頭が上がりませ
JsTestDriverで簡単テスト
最近、何かとJavascriptに触れる機会が多くなってきました。クライアント側としてHTML5が注目され、サーバ側としてNode.jsが発展してきたおかげですね。その一方で、Javascriptのテストほど面倒なものはありません。特に、ブラウザ上でのテストなど自動化することが時に難しかったりします。このブラウザ上でのテストを自動化できる仕組みがJsTestDriverです。今回はJsTestDriverの導入方法と簡単な使い方をご紹介します。 JsTestDriverとは JsTestDriverはGoogleが作ったテストフレームワークです。導入も使い方もとても簡単であり、様々なブラウザを使ったテストを自動化することが出来ます。Javascriptのテストフレームワークは多数ありますが、その中でもJsTestDriverは簡単かつ正確なツールです。 JsTestDriverの導入 導入
node.jsでこんなのもテストしたい!! という話 - Qiita
テストフレームワークは、busterJSが一番慣れてたんですが、 部署御推薦のmochaをいっちょやってみるかー、と思っているこのごろです。 そしてついでに、 「このへんは、node.jsの場合どうテストするのがかっこいいかしら!!」 と気になっていた部分について、いろいろ調べてみました。 mochaの細かい説明については、公式その他をみてください。 mochaっていうかほとんどshouldですよね。 普通のテスト(libraryやcontrollerのテスト) テストしたいmoduleをrequireして、 shouldもrequireして、テストを書く。これが基本ですね。 // テストしたいmoduleをrequire var hoge = require('../hoge'); // テスト用のライブラリをrequire (mochaの場合は、shouldがあればいいはず) var
should.jsが辛いのでやめたくなった - mizchi log
Rspec風に使える、という理由で使ったけど、もうなんというか気分的に辛い visionmedia/should.js https://github.com/visionmedia/should.js/ 問題1 nodeのassert依存 ブラウザ用に移植できない 問題2 undefined, null は prototypeを持たない 次のようなコードは getHogeがundefined返してしまうと hoge.shouldを触った時点で落ちる hoge = getHoge() hoge.should.equal 'hoge' アサーションにすらたどり着けず落ちるのはストレスたまる やっぱラップするタイプのexpectの方がよさそう 問題3 nodeのネイティブモジュールに依存したオブジェクトはprototypeを共有していない JSDOMで生成したオブジェクトのアサーションができない
Expect.jsのREADMEを和訳してみた - ギークに憧れて
2013-04-29 Expect.jsのREADMEを和訳してみた 最近趣味プロダクトでjsを書いていて､テストではmocha+expect.jsを使っている｡いたずらに高機能すぎないのとマルチブラウザへの対応度が高く､サバクラ両方で使えるのが良い｡ なのでexpect.jsのREADMEを和訳してみた｡ Expect.js should.jsをべースに開発されたミニマムなBDDアサーションライブラリ。 expect(window.r).to.be(undefined); expect({ a: 'b' }).to.eql({ a: 'b' }) expect(5).to.be.a('number'); expect([]).to.be.an('array'); expect(window).not.to.be.an(Image); 特徴 クロスブラウザ: IE6+, Firefox,
Jest
Jest is a delightful JavaScript Testing Framework with a focus on simplicity.
小さく始める JavaScript のテスト - Qiita
JavaScript のテスト 書かないと怒られるし、書きたいとは思っているが、書くまでの敷居がやたらと高くなってしまった気がしている人へ。 最小のテスト 本質的にテストを書くのにフレームワークはいらない。 assertion だけあればいい。 isomorphic にしたいなら、 node の assert モジュールすら使わず console.assert だけで書ける。 // assert function assert(actual, expected) { console.log('.'); console.assert(actual === expected, '\nact: ' + actual + '\nexp: ' + expected); } function TestSum() { assert(1+2, 3); } // exec TestSum(); あとは普通に
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
expect