簡単！ JavaScriptで自動UIテスト (NodeJS, Selenium Webdriver, WebdriverIO, mocha, gulp) - QiitaDeleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?
jest で Node.js の テストするなら testEnvironment: "node" を使う - Qiita
jest はデフォルトコンテキストが browser になる。 そのため axios とかだと内部に使われるhttp requestライブラリがデフォルトで XHR になる。 XHR になると、Nodeのhttpモジュールとは違い、CORSの制約などの細々した制約を受けてしまう。 受けた結果、 jestでだけNetwork Error になる、CORSのエラーとしてわかりやすいエラーが出てくれたら良いが、 Network Error とだけ返ってくる事になり、意味不明の状態で半日デバッグしていたら、jsdom/xmlhttprequest で変な問題を見つけた。 どうも origin が "null" (string の null) のときと access-control-allow-origin のヘッダに何も指定しないと null (普通のnull) になり、同一性チェックに失敗するよ
ついに jest の軍門に降った - Qiita
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? もう駄目だ。ついに React 以外のプロジェクトでも Jest 一択になってしまった。 もともと自分の選択するテストツールは、むかしは jasmine、いまは mocha + chai（ときどき power-assert） をベースに周辺ツールと連携させていて、React を使うようになってしばらくして Jest を入れるようになった。ここ5年くらいのフロントエンド界隈では標準の一種だと思う。 それがどうしてこんなに Jest びいきになったのか。 その1. 楽 とにかく楽だからだ。 Jest の売りはオール・イン・ワンとゼロ・コンフ
ついに jest の軍門に降った - Qiita
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? もう駄目だ。ついに React 以外のプロジェクトでも Jest 一択になってしまった。 もともと自分の選択するテストツールは、むかしは jasmine、いまは mocha + chai（ときどき power-assert） をベースに周辺ツールと連携させていて、React を使うようになってしばらくして Jest を入れるようになった。ここ5年くらいのフロントエンド界隈では標準の一種だと思う。 それがどうしてこんなに Jest びいきになったのか。 その1. 楽 とにかく楽だからだ。 Jest の売りはオール・イン・ワンとゼロ・コンフ
jasmineとselenium-webdriverでシンプルにE2Eテストする - Qiita
用意するもの 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
Angular4(Angular2~)のユニットテスト【Angularのユニットテストの基本とComponentの簡単なテスト編】 - Qiita
import {ComponentFixture, TestBed, async, ComponentFixtureAutoDetect,} from '@angular/core/testing'; import {By} from '@angular/platform-browser'; import {DebugElement} from '@angular/core'; import {AppComponent} from './app.component'; // describeでテストSuiteを作成 describe('AppComponentのテスト', () => { // テストの中のAppComponent let comp: AppComponent; // ComponentFixtureは、 componentのインスタンスそのものとcomponentのDOM
ヘッドレスChromeをもっとも簡単に操作できると思われるNightmareJS風ライブラリ - Qiita
Chrome59(2017/05/27現在はベータ)から--headlessオプションを使うことでChromeをヘッドレスブラウザとして使えます。これをNodeJSから操作するにはchrome-remote-interfaceというNPMパッケージを使うのですが、そのままですとなかなか面倒です。そこで、NightmareJS風にヘッドレスChromeを操作することができるライブラリをご紹介します。 GitHub: https://github.com/OnetapInc/chromy 基本的な使い方 このようにNightmareJS風のメソッドチェーンで操作することができます。visibleオプションを指定すればヘッドレスモードではなく通常モードでChromeを起動することもできます。 Chrome本体は標準的なインストールをしていれば自動的に最も新しいChromeを探してそれを起動します
Facebook製のJavaScriptテストツール「Jest」の逆引き使用例 - Qiita
はじめに みなさん、日頃JavaScriptのテストはどのように行っていますか？ 昨今ではAngularJSやReactJSを始め、JavaScriptのフレームワークやライブラリを使用してのフロントエンドの開発が当たり前のようになってきております。 ではそのフロントエンド、JavaScriptのテストはどんなツールを使っていますか？ mochaやpower-assert、chai、Karma、Jasmine等を組み合わせて使用してテストしているでしょうか。 前置きが少し長くなりましたが、Facebookが開発したオールインワンな「Jest」というツールのReactでのHowto的な使い方から実際のテストでの使用例を交えて紹介したいと思います。 ちなみにこのJest、最近リリースされて話題になったパッケージ管理のYarnでも使われています。 対象バージョン Jest:22.0.4 Reac
Protractor ＋ mocha ＋ power-assert ＋ TypeScriptを用いてOnsenUIで作成したサイトのE2Eテスト - Qiita
{ "ambientDependencies": { "angular": "github:DefinitelyTyped/DefinitelyTyped/angularjs/angular.d.ts#17ef40452039d19e06dc2a3815ea898c505860fa", "angular-protractor": "github:DefinitelyTyped/DefinitelyTyped/angular-protractor/angular-protractor.d.ts#17fa1e5f269189f7f8e0f53f8c443e6c2eac562c", "empower": "github:DefinitelyTyped/DefinitelyTyped/empower/empower.d.ts#aeb7701fbef3b7fc7261d67c025c823666ab
AngularJS + CoffeeScript + Protractor + GruntでE2Eテスト環境構築 - Qiita
前提 Yeoman + AngularJS Generatorを使って構築し、Gruntfile.jsをGruntfile.coffeeへ書き換えた環境を前提としています。 Gruntfile.coffeeに関してはこちらをどうぞ http://qiita.com/rneuo/items/c7d449a7361fe9cea236#2-3 概要 インストールモジュール説明 AngularJS + CoffeeScript + Protractor + Gruntでテスト環境を構築するにあたって、下記のnodeモジュールを使って構築してみたいと思います。 Protractor本体 https://github.com/angular/protractor CoffeeScriptでspecを記述するProtractorプラグイン https://github.com/lebek/protrac
Protractor の Angular 同期と Angular アプリでないページのテストについて - Qiita
こわくない Protractor という記事で書けなかった Angular 同期関連についてです。 Angular との同期 Protractor は Angular プロジェクトの一部として開発されているだけあり、Angular に特化した機能があります。その一つが Angular と同期してくれるというもの。 ここで言う同期というのは、具体的には $digest loop, $timeout や $http による AJAX リクエストが完了するまで待ってくれるということです。これにより、他の E2E テストフレームワークのように sleep したり、期待する値が取得できるまでポーリングするタイプの wait をする必要がなくなります。より速く不確実さを排除したテストを書けるわけです。 直接実行するには browser.waitForAngular() を呼びます。これはざっくりいうと
Protractorを利用してAngularJS appsをテストする - Qiita
http://qiita.com/drafts/b60766d9017a1eaeada0/edit （Testing AngularJS apps with Protractor の訳） もし、AngularJSアプリケーションを開発するならば、テストにはProtractorを使いなさい！なぜかって？ ProtractorはAngularJSアプリケーションのためのend-to-endテストフレームワークで、強力なツールや技術（NodeJSやSeleniumやwebDriverやJasmineやCucumberそしてMochaなど)を結合するような ソリューションの結合に作用する。 AngularJSアプリケーションのテストをより簡単に作るためにSeleniumからのたくさんのカスタマイズをProtractorは持つ。 また、Protractorは、テストにたくさんの"sleeps"や"w
AngularJSのテスト(Unit Test/end-to-end test)って何が良いの？ - Qiita
AngularJSを利用したのなら、絶対にKarmaとか Protractorを活用すべきです。ちゅうか、活用しなさい。と言いたいです。システムを保守フェーズに安定的にメンテナンスするならそう考えるのがふつうになるべき。 （※Protractorについては、こちらの記事がとても参考になります） 例によって「Mastering web application development with AngularJS」を読んで書かれていたポイントを読んだ感想をこちらにまとめてますが、 2章のテスト解説部分に下記の文章があります。 There is a quote saying that writing code without a Version Control system (VCS) is like skydiving without a parachute. Today one would
Protractor × CoffeeScript × AngularJS （導入編） - Qiita
npm install --save-dev coffee-script npm install --save-dev protractor npm install --save-dev grunt-protractor-runner npm install --save-dev protractor-coffee-preprocessor npm install --save-dev grunt-exec coffee-script CoffeeScript のコンパイラ はじめ -g で入れていたのだがプロジェクトの中に入れないと使えなかった protractor angularJS 御用達の E2E テストフレームワーク selenium を angularJS プロジェクトで使えるようによしなにカスタマイズしている grunt-protractor-runner protracto
AngularJS用テストフレームワーク「Protractor」チュートリアル日本語訳 - Qiita
Protractorとは、AngularJSアプリケーションのためのエンド・トゥー・エンド（E2E）テスト・フレームワークです。これはProtractor Tutorialの日本語訳です。 チュートリアル これはシンプルなチュートリアルです。内容は、Protractorをセットアップし、テストを走らせ始める方法です。（訳注：protractorは分度器のことです） 訳注：本チュートリアルのサンプル・リポジトリを作りました。参考になれば幸いです。 準備 ProtractorはNode.jsのプログラムです。動かすには、Node.jsをインストールしておかなければなりません。ProtractorはNode.jsについてくるnpmを使ってダウンロードすることができます。node --versionと打って、Node.jsのバージョンをチェックして下さい。v0.10.0以降でなければなりません。
Protractorの小ネタ - Qiita
AngularJSリファレンスの落ち穂拾いその3ということで、今回はProtractorの小ネタを紹介したいと思います。 手前味噌ですが、Protractorの説明についてはこちらをごらんください。 Protractor: AngularJSの次世代E2Eテストフレームワーク AngularJSの処理の完了を待たない Protractorには、browser.waitForAngularというAPIが用意されています。 このAPIを呼び出すと、AngularJSの描画処理や、$httpによる通信処理、$timeoutによるタイムアウト待ち処理などが完了するまで待つことができます。 Protractorは、要所要所で内部的にこのbrowser.waitForAngularを呼び出しています。 これによりテストを書く人は、AngularJSの処理が完了するまで待つという処理を書く必要がなくなる
こわくない Protractor - Qiita
Angular Advent Calendar 2014 の 17 日目の記事です。Angular そのものではなく、AngularJS 用の E2E テストツールである Protactor について書きます。（日付越えてしまいました。すみません・・・。） Angular チームが作っているという Protractor。Angular アプリの E2E テストをするならこれに違いないと思いつつも、使い始める前はいろいろこわい点がありました。 コードがどこで動いているかわからなくてこわい。 処理がどういう順序で実行されるかわからなくてこわい。 この記事ではこれらの点について説明し、Protractor を自信を持って使えるようになることを目的としています。 読者としては以下のような方を想定します（主に先日の自分）。 Protractor のインストールをして動かしてみた。 日頃から Prom
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Jest と ReactTestUtils で React Component のユニットテストを書く - Qiita
End to End Test with Headless browser - Qiita
gulpとprotractorでAngularJSを自動テストする - Qiita
