テストがないJS環境にモダンなテスト環境を導入していく - Qiita
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
kintoneのJSユニットテスト最新事情 - Cybozu Inside Out | サイボウズエンジニアのブログ
こんにちは。kintone開発チームの天野 (@ama_ch) です。 最近はJavaScriptのテストツールが著しく進歩し、日々新しいツールが登場しています。kintoneの開発もこれらのツールによって支えられています。 kintone開発チームでは、昨年末頃からテスト環境の改善に取り組み、モダンなツールセットに乗り換えました。今回は、現在のkintoneのJSユニットテスト環境について紹介します。 kintoneとJSユニットテスト 数年前からユニットテストと自動化の仕組みはあったのですが、ごく一部のユーティリティ関数に書かれているのみで、普段の開発には活用されていませんでした。 ここ1,2年ほどで テストスケルトンを生成するジェネレータスクリプトを作る テストの書き方をまとめたドキュメントを用意する MTGで「ユニットテストを書かなくていいのは小学生まで」などと煽る コードレビュー
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(通過
Karma, PhantomJS, JasmineでBDDなJavaScriptテスト環境をつくる - プログラマ憧れプログラマ日記
はじめに ひとむかし前のJavaScriptのユニットテストと言えばQUnit, JSTestDriverとかを組み合わせて実行することが多かったですが、最近はJasmineで書いてPhantomJSなどのヘッドレスブラウザをKarmaで実行するのがおしゃれな感じがしていいそうです。 UIなしでコマンドライン上で済ませられるとなると、CIにも乗せやすくなって何かと捗るのでこの辺りをちょっと試してみましょう。 もろもろインストール nodeとKarmaをインストールします。 Karmaは簡単にいうとテストランナーです。今回のようにPhantomJSみたいなヘッドレスなブラウザを使ってテストを実行することもできますし、一般的なブラウザを使ってテストを実施することもできます。 なおKarmaのインストール時に一緒にPhantomJSもインストールすることができるので、PhantomJS単体のイン
CROSS 2014のアウトラインメモ
Cross 2014 CROSS 2014 | エンジニアサポートCROSS2014 に参加してきたメモ アセンブラ短歌×バイナリかるた バイナリカルタで8枚とれた 実況解説つき！ペアプロでわかるJavaScriptテスト入門 ペアプロ + 解説実況 今あるDOMScriptingについてのテストを書いていく jQueryのコード テンプレート kyo-ago/cross2014 testem を使用 よくあるjQueryでクリックした何かするみたいなことに対してのテストを書いていく updateLabel という関数を呼び出されたかをテストする testem npm install -g testem mocha expect.js JavaScriptのテスト 少し前は書きにくいと言われてたけどツールが発達した jQueryでボタンを叩いたら updateLabel()が呼ばれる事をテ
JavaScriptフロントエンド開発の昨今
フロントエンドのパラダイムを参考にバックエンド開発を再考する / TypeScript による GraphQL バックエンド開発
BrowserStack を用いたクライアントサイドのテスト
YAPC::Asia 2013 発表資料です。 JavaScript テスト事情の整理と、BrowserStack を用いたテストの紹介
フロントエンドJavaScriptにおける設計とテスト
今日話さないこと JavaScriptの基礎知識、jQueryの導入 気持ちいいUIやUXがうんちゃら CanvasやWebGLを使ったリッチでイケてるゲームの作り方
require.js 環境で mocha + expect + testem を使った JavaScript テスト - naoyaのはてなダイアリー
先日書いた自分用アプリケーションのひな形 http://d.hatena.ne.jp/naoya/20130503/1367581629 http://d.hatena.ne.jp/naoya/20130504/1367640512 これに、JavaScript のテスト環境も追加したい。 結論からいくと、フレームワークには mocha + expect、ランナーは testem を使うことにした。ついでにテストダブルライブラリとして Sinon.js も有効にした。 ちなみに今回の文脈は End to End のテストではなくてユニットテスト周りのおはなしです。 mocha + expect JavaScript のこの辺のテスト周りは今もいろいろなツールの整備が進んでいて、今回採用した以外にも Jasmin や QUnit そのほか色んな物がある。昨今の状況に関しては 先日の HTML
SlimerJS
A scriptable browser for Web developers Download SlimerJS 1.0 All operating systems - Version 1.0.0 Compatible with CasperJS 1.1 Release notes Slimerjs is only compatible with Firefox 59. Higher version of Firefox will not be supported because developments on SlimerJS have ceased since 2018. See FAQ > Opening a webpage, > Clicking on links, > Modifying the content... SlimerJS is useful to do funct
YetiでJavaScriptのテストを動かす方法
Yeti はYahoo.comがメインで開発してるNode製のTest Runner的なCLIです。 Yeti自体はテストの構文とかは持っていなくて、Test Frameworksに書かれているようにQUnitやJasmine、MochaやYUI Testなどで書かれたテストを動かすツールになっています。 雰囲気的にはTestemに似ていて、上のTest Frameworksで書いたhtmlページを用意して、 キャプチャー用のURLを作って、そこにテストしたいブラウザをキャプチャーして、テストを書いたhtmlを指定して実行させるという感じです。 (意味的にあんまり変わらないですが、先にテスト用htmlを指定して、ブラウザにアクセスさせるという逆の手順もできます) Yeti自体は数年前からあって、Bunyipとかでもインスパイアされてたりします。 動かしてみる QUnitやJasmine、M
Ubuntu上でXvfbを使ってJavaScriptのユニットテストをChromeとFirefoxで実行する - Webtech Walker
JavaScriptのユニットテストをJenkinsとかでCIしたいとき、PhantomJSで実行するのもいいけどやっぱりChromeとかFirefoxみたいな実際のブラウザでテストしたい。でも環境作るのめんどくさいよなーと思ってたけどXvfbを使うとChromeとかFirefoxが動くのでLinux版のChromeとFirefoxだけだとわりと簡単に環境つくれた。 Xvfbというのは画面入出力をシミュレートするやつでデスクトップ環境を用意しなくてもChromeとかFirefoxとかが動かせるやつ。 OSはUbuntsの12.04（precise64）で試した。 まずXvfbを入れる。 $ sudo apt-get install xvfb 次にFirefoxを入れる。これもすぐ入る。 $ sudo apt-get install firefox Chromeは一手間必要だけどわりとすぐ入
Sinon.JS - Standalone test fakes, spies, stubs and mocks for JavaScript. Works with any unit testing framework.
Standalone test spies, stubs and mocks for JavaScript. Works with any unit testing framework. Get Started Star Sinon.JS on Github Get Started Install using npm To install the current release (v17.0.1) of Sinon: npm install sinon Setting up access Node and CommonJS build systems var sinon = require("sinon"); Direct browser use <script src="./node_modules/sinon/pkg/sinon.js"></script> <script> // Ac
testem + mocha on Travis-CI - ブラウザでのテストを自動化する - 四角革命前夜
Travis-CIでブラウザのテストできないのかなー、できないよなーと思いつつ、いろいろ探してみたら出来るような事を知り、今ホット（なのかな？）なtestemを使う事でmochaでのテストも実行できるらしい！という事を知ったので試してみました。 準備 package.jsonの記述を変更します。 package.json "scripts": { "pretest": "./node_modules/.bin/bower install", "test": "./node_modules/.bin/mocha && ./node_modules/.bin/testem ci" }, "devDependencies": { "bower": "~0.8", "chai": "~1.5", "mocha": "~1.8", "testem": "~0.2" } testemが必要なのでtes
Testing Private State and Mocking Dependencies - How To Node - NodeJS
HEADS UP! This article was written for an older version of node. More up-to-date information may be available elsewhere. During Christmas I've been working on Testacular and found some tricks how to make my testing life easier. It's nothing special at all, just a simple way how to access private state of a module and how to mock out some dependencies. I've found these two techniques pretty usefull
JSCover | JavaScript code coverage
JSCover: Javascript code coverage JSCover is a Javascript code coverage tool.
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Mock Service Worker で jest.mock を使わず非同期リクエストのテストを書く
Expect · Jest
GitHub - avajs/ava: Node.js test runner that lets you develop with confidence 🚀
