Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?

Javascriptのロジックテストが必要になったのですが、大仰な環境を作るコストも時間もなく、要件的に他のライブラリを組み込む事も難しかったので、普通のChromeのみで出来るテスト環境を構築してみました。 1. 前提条件 Javascriptのみのロジックテスト(画面操作等は行わない) 他ライブラリは使わない インストールは行わない(テスト用の環境構築不要) WindowsとMacで動く事 ブラウザはChrome テストデータと回答はCSVで用意する 2. 選定 上記条件を満たせそうなものとして、JasmineとQUnitが候補にあがりました。 Jasmine vs QUnit detailed comparison as of 2017 - Slant Qunitの方が学習コストが少なそうでしたが、今後の拡張性を考えてJasmineを選択しました。 3. Jasminの導入 Jasm
package.jsonを上記のように更新したら、一度Atomを終了して再度Dev modeで開きなおしてください。 一度終了させるのは、atom-jasmine2-test-runnerのドキュメントにもあるようにpackage.jsonの内容がキャッシュされていて反映されない場合があるからです。 また、Dev modeで開くのは"devDependencies"を更新するためです。 Dev modeで開きなおしたらCommand PaletteからUpdate Package Dependencies: Updateを実行し、外部依存関係を更新します。 これでjasmine2が動くようになります。 動作テスト 動作テストとして、specフォルダに以下のようなファイルを作ってやります。 (jasmineのintroduction.jsから取ってきましたが、ちょっと実行時間が長いです) 作
用意するもの npm で以下のモジュールをインストールする jasmine selenium-webdriver どうにかしてchromedriverを入手する(Chromeで試したい場合) chromedriverという名前で(windowsだとchromedriver.exeかな?)カレントフォルダに置いておく(ほかにいい感じに管理する方法があれば教えてください・・・!) こう書く シンプルに書いています。(ほんとはasync/awaitで書きたいけど) var wd = require("selenium-webdriver"); describe("e2e test", function() { var driver; beforeAll(function () { // デフォルトだと、5秒しか待ってくれないので、20秒くらい待たせる jasmine.DEFAULT_TIMEOU
はじめに Angularでユニットテストを作成したときに使用したjasmineの使い方をメモしていきます。 alertが表示されることをテスト beforeEach(() => { // アラートの監視 spyOn(window, 'alert'); }); it('〇〇な場合、対応するアラートを表示するべきである', () => { // テストを実行 component.testSample(); // テスト結果検証 expect(window.alert).toHaveBeenCalledWith('エラー'); }); it('〇〇な場合、アラートを表示するべきでない', () => { // テストを実行 component.testSample(); // テスト結果検証 expect(window.alert).not.toHaveBeenCalled(); }); let
ng test はとても便利ですが、「今はこのテストケースだけ実行したいのに!」ということや、逆に、「このテストケースはうまく動かないけどしばらく無視しておきたいのに!」ということがあります。 その辺の機能が用意されています! まぁAngularというかJasmineの機能なんですけど…。 このテストだけ実行 describe そして it の代わりに fdescribe そして fit を使います。 "f" は "focused" の意味です。 focused_specs.js コード例 fdescribe(() => { // このテストスイートだけを実行 fit(() => { // このテストケースだけを実行 }); it(() => { // このテストケースは(特記ないので)スキップ }); }); このテストだだけは実行しない describe そして it の代わりに xd
ラクス Advent Calendar 2017の17日目です。 昨日は @Black-Spider さんの「Spring Batch + MyBatisでテーブルパーティション毎に並列処理を行う方法」でした。 こんにちは。@morihirokです。HR事業部でビアバッシュの幹事をするなどしています。 仲良くしてください! JavaScriptのテスト概論 まずはじめにこちらの記事をご覧ください。 2017年JavaScriptのテスト概論 お時間の無い方向けに上記記事を一部引用いたします。 テストツールの種類 テストツールは次の2つの機能に分けられます。単一の機能を提供するツールもあれば、複数の機能の組み合わせを提供するツールもあります。 理論的には単一のツールで同じ成果を出せるとしても、よりニーズに合った機能を入手するために、複数のツールを組み合わせて使用するのが一般的です。 テストの
it("The 'toThrowError' matcher is for testing a specific thrown exception", function() { var foo = function() { throw new TypeError("foo bar baz"); }; expect(foo).toThrowError("foo bar baz"); expect(foo).toThrowError(/bar/); expect(foo).toThrowError(TypeError); expect(foo).toThrowError(TypeError, "foo bar baz"); });
概要 ServiceNowのAutomated Test FrameworkでRun Server Side Scriptのテストを作成すると、作成したテスト設定のTest Script欄にコメントで詳細なテスト方法が記述されている、その内容を読み解きながら実際に試してみる。 本題 Jasmineとの住み分け // You can use this step to execute a variety of server-side javascript tests including // jasmine tests and custom assertions jasmineとServiceNowの独自のテストフレームワークの2種類を使用する事が出来る。 ServiceNowのテスト機能を最大限に活用するには、ServiceNow のテスト機能を使うのが良いだろう。 戻り値について // P
はじめに TypeScript + RxJS で WebSocket 接続をして切断時に自動で再接続をする方法を記載する RxJS 6 の場合 retry を使って WebsocketSubject のエラーをハンドリングするだけでできるらしい。 https://stackoverflow.com/questions/44060315/reconnecting-a-websocket-in-angular-and-rxjs RxJS 5.5 の場合 Subject を拡張して自動再接続する WebSocket 接続を提供する Subject を作成する 参考サイト: https://gearheart.io/blog/auto-websocket-reconnection-with-rxjs-with-example/ import { Subject } from 'rxjs/Subje
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? 最新版=>フロントエンドのテストについて考える 背景 フロントエンドのテストは、テストランナー、フレームワーク、Node.js、ブラウザ、Selenium、WebDriverなど、登場人物が多い。また、UIと密接に絡むのも特徴である。 これまで社内では、テスト種別によって、それぞれ解決したい事柄が明示的に示されていなかった。それぞれのテスト種別にどんな意味があり、何を目的とするかを明確にすることで、機能に対して、どのようなテストを実装すればよいのか共通認識を持っておくために、この記事を作成した。 フロントエンドのテスト4象限 今回この記
Karma駆動開発? ng-japanでQuramyさんの発表にあったやつ Karma? JavaScriptのテストランナー ブラウザを起動してその上でJavaScriptのテストを実行する ブラウザが起動するので見た目も確認できる Developer Consoleでブレークポイント等の機能が使える angular-cliはユニットテスト環境としてKarmaを自動でセットアップする Karma駆動開発? KarmaでUIロジックのテストもしつつ、見た目もそこで試行錯誤すると楽 アプリ上で再現するのが面倒な状況もテストを書けば再現が楽 そういうエッジケースのテストにもなって一石二鳥 特定のテストケースだけ走らせることができるので繰り返しが早くできる あくまでテスト環境なので、あまり複雑なことはしないほうが良さそう デモ おわり
構成 こんな感じの環境を作っています。 TypeScript webpack Jasmine Karma あと karma-coverage とかものせてます。 設定ファイルもTSで書きたい 設定ファイルだけJavaScriptで書くのもなんとなく癪なので、TypeScriptで型チェックしていきます。 webpack.config.ts 公式で、ちゃんとできるよ!っていうガイドを用意してくれています。 Qiitaの記事を書いてる方もいました。 ということで割愛します。実際に行った作業は以下の3つです。 ts-nodeのインストール @types/webpackのインストール webpack.config.tsの作成 karma.conf.ts こちらも公式で触れられています。 https://karma-runner.github.io/1.0/config/configuration-
はじめに ※Angular 1xです。 通常のロジックのテストは問題なく書けるとして、UIのユニットテストを書くのは難しい。 とはいえ、後回しにしがちだが、AngularJSのモジュールのテストも書きたい。 ControllerやComponent, Service などのテストの書き方を記述していきます。 その他、以下のように若干わかりづらいテストの書き方も記述しています。 $httpのレスポンスをMockするテストの書き方も記述しています。 $timeoutを使っているメソッドのテスト $qを使っているメソッドのテスト 前提 Karma と Jasmine を使ったテストが実行できる環境であること。 今回は以下の GitHub に用意したプロジェクトで行います。 https://github.com/chibi929/angularjs-test-sample 実行環境 GitHub
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く