フロントエンドの負債と向き合う - mizchi's blog
某所で書いたものを公開用に書き直したもの 前提 フロントエンドでTDDは難しい、というかほぼ不可能である。なぜなら事前に副作用をデータとして表現できるか不明だからだ。たとえばあなたのプロダクトの画面の何処かにボタンを追加するために、その内部表現を事前に思い浮かべることが可能だろうか？ react-redux などのFluxフレームワークは如何に副作用をアクションとして表現することで、テスト・デバッグのための情報を残すか、という視点で発展してきた側面がある。あの冗長なアクション定義は、全てデバッグのために書いていると言っても、過言ではない。それすら「Textは文字がある」といったトートロジーなデータになりがち。 フロントエンドの現実的な単体テストは、他の開発者のために、自分が書いたコードの要求を満たしているか検知する手段として、防衛的にテストアフターしておく。これぐらいしか現実的な手法がない
idやclassを使ってテストを書くのは、もはやアンチパターンである - Qiita
いきなり結論を書くと、idやclassはスタイルのためのものなので、テストでそれを使うのはやめましょう。そして、カスタムデータ属性を使いましょう。(idやclassはスタイルのためだけではないという意見はごもっともです！しかし、主にとしてスタイルに使われるということでご了承頂いて以下の駄文に付き合って頂けると幸いです🙇) 先に断っておくと主にreactについての話で、JSXを前提とします。(手法はReactに限りませんが理由は後述) 2020/03/23 追記 この記事は1年以上前に書かれた記事なのでテストフレームワークとしてenzymeを使っていますが、現時点ではTesting Libraryの使用をオススメします。data-testid に対応するクエリを備えています。 React Testing Library · Testing Library はじめに ご存知の通り、ロジックと
2017年JavaScriptのテスト概論 | POSTD
本稿は、JavaScriptのテストについて最も重要な根拠、用語、ツール、アプローチなどの知識を身に着けることを目的とした簡略版ガイドブックです。本稿で検討する数々の側面に関する最新の秀逸な記事も紹介しつつ、私たちが経験的に得たことも多少付け加えたいと思います。 Facebookによるテスト用フレームワークであるJestのロゴをご覧ください。 見てお分かりのように、このフレームワークは「苦痛のない」JavaScriptのテストをスローガンに掲げています。しかし、 “次のように言う人” もいます。 苦痛のないテストなんてあり得ない。 実際、Facebookはこのスローガンを掲げるだけの素晴らしい理由があります。一般的にJSのデベロッパは Webサイトのテストにあまり満足していません 。JSのテストには制限があり、実装が難しく、低速である傾向があります。 一方、正しい戦略を立てて適切にツールを
なぜクライアントJavaScriptの単体テストを書くのが難しいか、考えてみた - mizchi's blog
ってsinonのスタブ漏れを探しながら何度目かわからない感じにキレてた。 とにかく仕事でJSのテスト書くのが辛いので考えてみる。比較的JSのテストに慣れてる自分ですら辛いのだから、世界はもっと辛いに間違いない。サーバーサイドのnode.jsの話ではない。 JavaScriptで完結しない 構造がHTMLの構造と密結合している。装飾や位置、表示/非表示はCSSによって制御されている。 クライアントJSはHTMLと密結合しており、CSSからビューは影響を受ける。それらがネットワークの結果を受け非同期に振る舞いを帰る。その最終的な値を取得するのが難しい。 もちろんサーバーサイドだってDBやネットワークという外部リソースを扱うが、モックの手法が確立しているし、局所的な複雑度は、JSの方がはるかに多い。 言語仕様が貧弱 mochaやjsmineはrspecを真似てるけど、本質的にJavaScript
Evergreen で Rails アプリの JavaScript を単体テストする - present
はじめに Rails アプリの JavaScript のテストは capybara(+capybara-webkit) を使えば一応できるけど、統合テストなのがね…。統合テストもちゃんと書くけど、やりたいのは JavaScript の単体テストなのに。 そこで Evergreen そんな中で最近知ったのが Evergreen っていう gem。 jnicklas/evergreen · GitHub こいつを簡単に説明すると、Rails に組み込める Jasmine テストランナー。Jasmine も同梱されてるので、インストールすればすぐに JavaScript のテストが書ける。 Evergreen のインストール Gemfile に group :test, :development do gem "evergreen", :require => "evergreen/rails"
準備が簡単。JavaScriptテストツール「Testacular」
各質問に答えていくと設定ファイルができあがります。 今回はテストフレームワークはjasmine、 ブラウザはChrome、Firefox、Safariとしています。 ※各質問の選択肢はタブで切り替えられます。 Which testing framework do you want to use ? Press tab to list possible options. Enter to move to the next question. > jasmine Do you want to capture a browser automatically ? Press tab to list possible options. Enter empty string to move to the next question. > Chrome > Firefox > Safari > Whic
JavaScriptのテストツール「testem」が素晴らしいぞ - Mach3.laBlog
この記事は賞味期限切れです。（更新から1年が経過しています） JavaScriptユニットテスト一年生の私が、Nettuts+ のチュートリアルで知ったテストツール 「testem」のお陰で大変捗ったので是非お勧めしたく、ここで紹介してみます。 testem ってなに testem via GitHub : airportyh/testem Unit testing in Javascript can be tedious and painful, but Testem makes it so easy that you will actually want to write tests. 要するに、面倒なJSのユニットテストをより快適にしてみんなでハッピーにテスト書こうよ！というツールです。 testem自体はnode.jsベースで動作し、Jasmine/QUnit/Mochaに対応して
Titaniumでユニットテスト - ひげろぐ
公式のドキュメントには何の記述もないが、ユニットテストには好きなJavaScriptのテスティングフレームワークを利用できる。 ただしブラウザに依存しないもので、ログの出力をフックできるものに限る。 要はTitaniumのコンソールにログを出力するためにTitanium.API.infoやTitanium.API.errorなどにテストの出力を渡せればよいわけです。 今回はxUnit系で一番勢いがありそうなQUnitとBDD系でよいと言われているJasmineで試してみた。 QUnitを使う Titanium用のアダプターがGitHubで公開されている。 lukaso/qunit – GitHub 自分のプロジェクトで利用する場合はResources以下に次のファイルを設置すればOK。 * runner.js * qunit/qunit.js * qunit/titanium_adapto
JSCoverage - code coverage for JavaScript
Note: Any future development of the JSCoverage code base will likely occur in the new JSCover project on GitHub, which reuses a substantial amount of JSCoverage code and aims for a high degree of backward compatibility with JSCoverage. JSCoverage itself is unlikely to have any further releases. JSCoverage is a tool that measures code coverage for JavaScript programs. Code coverage statistics show
Googleが開発、JavaScriptカバレッジツール登場 | エンタープライズ | マイコミジャーナル
SCRIPTCOVER is a Chrome extension for Javascript coverage analysis. Googleは10月26日(米国時間)、JavaScriptカバレッジツール「ScriptCover」をオープンソースソフトウェアとして公開した。ScriptCoverはChromeエクステンションとして実装されたJavaScriptカバレッジツール。Apacheライセンス2.0のもとで公開されている。 ScriptCoverを使うことで、リアルタイムにWebページを分析することが可能。JavaScript行単位での分析が可能となっている。複雑なコードの解析やデバッグ、試験の実施などに有効とされている。現在のところエクステンション単体では提供されておらず、使用するにはドキュメントに従って自らビルドして開発版を用意する必要がある。利用するツールなども含めてあ
多数のWebブラウザにおけるJavaScriptの動作確認をまとめて行う·Tutti MOONGIFT
Tuttiはnode.js製のソフトウェア。接続している全てのWebブラウザで入力したJavaScriptを実行し、その結果を受け取る。 Tuttiはnode.js/JavaScript製のオープンソース・ソフトウェア。かつてはNetscapeがWebブラウザ市場を圧倒しており、IEの無料戦略で一気に市場が荒れてしまった。その後、FirefoxやOpera、SafariさらにGoogle Chromeが登場し市場が賑わっている。 接続中 そんなWebブラウザが乱立しているせいで、JavaScriptの互換性を保つのが難しくなっている。多数のWebブラウザに対して同一のテストコードをインタラクティブに実行するのがTuttiだ。 Tuttiはnode.jsで作られており、各WebブラウザからTuttiへ接続する。そうするとTuttiにはどのWebブラウザが接続しているかという情報が表示される。
さいきんの JavaScript テスト / Test.js - Shibuya.js 発表資料 - 川o・-・）＜2nd life
本日行われた Shibuya.js の発表資料をアップしました。 さいきんの JavaScript テスト / Test.js - Shibuya.js 発表資料 View more presentations from hotchpotch JS のテスティングフレームワークのおおざっぱな説明や JavaScript テストにおける問題、それについての解決方法の一つ、CUI でのテスト、Envjs、エンドツーエンドテストにおける JS / Ajax のテスト、終わりにちらっと Phantomjs の話があります。 スライドの最後にあるように、やはりまだコレだ！という JS のテスティングフレームワークは存在しなく、今後 JS のテストは『僕らが書きたいテスト』をどれだけ簡単に書ける・書く手法が確立されるかによって流行廃りは決まってくるんじゃないかなぁ、と思ってます。そのうちの一つがスライ
複数の JavaScript テストが同時に出来る「Yeti」 - everything might happen tomorrow - yhassy - builder by ZDNet Japan
Yahoo! は YUI をはじめ、数年前から開発に役立つツールを開発していました。Yahoo Developer Netowrk では開発からテスティングまで様々な使えるツールと API を公開しています。言語は Ruby, PHP、Java, Python, .NET をサポートしているので、自分が慣れている開発環境に導入しやすいのも特徴です。開発者向けのりリソースと言えば Google というイメージがありますが、Yahoo! も貴重なリソースです。 その Yahoo! が先日 Yeti というターミナルで操作するプログラムをリリースしました。コードをコミットする前にテストをするためのツールで、複数の JavaScript の動作テストを同時に行うことが出来るのが特徴です。ここでいう『複数』とは、Yeti がインストールされているパソコン上で動作している複数のブラウザだけでなく、他の
【コラム】イマドキのIDE事情 (84) JavaScriptもユニットテスト! JsUnitを使ってみよう | エンタープライズ | マイコミジャーナル
JavaScriptのユニットテスト JavaではJUnitを使用してユニットテストを自動化することが可能だ。他の言語でもJUnitに似たテスティングフレームワークが整備されていることが多い。 それではJavaScriptの場合はどうだろうか? 近年Ajaxを活用したWebアプリケーションが増えていることもあり、JavaScriptコードの品質に関する要求も増している。今回はJavaScriptのユニットテストを行うためのツールとしてJsUnitを紹介する。 JsUnit JsUnitを使ってみよう JavaScriptのユニットテスト用フレームワークとして最も有名なものがJsUnitだろう。JsUnitはHTMLファイルに記述されたJavaScriptのテストケースをWebブラウザ上で実行するというものだ。 以下にJsUnitのテストケースの例を示す。app/jsUnitCore.jsを
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
JS開発におけるTDDと自動テストツール利用の勘所
アプリ開発を効率化する 方法あれこれ
My Blog – My WordPress Blog
GitHub - itay/node-cover: Native JavaScript Code Coverage
http://typedjs.com/
GitHub - maccman/ichabod: Headless JavaScript testing with WebKit
