【Vue.js】【TDD】ブラウザだけでVueテストを書きましょう - Qiita
基本的に大きなVue.jsアプリケーションを開発するとVue-cliで新しいプロジェクトを作成して、Babel、Jest、Webpackなどを入れます。複雑ですね。でもツールは全部JavaScriptなので、ブラウザだけでも使えます。 この記事で、Node.js、Webpackなどの複雑なツールなしでvue-test-utilsを使ってTDDで簡単なアプリケーションを作ります。ブラウザとスクリプトタグだけで書きます。 何を作る？ これは、MUST-DOアプリケーションです。TODOのようなアプリケーションですが、TODOを入れられないし、削除できないのでMUST-DOです。 ソースコードはここ。index.htmlだけです。 Vueとテストを書くには必要なものは： Vue Vue-test-utils テストランナー （Mocha.jsを使います） 始めます。 検証は？ 簡単なアプリケーシ
Node.jsでのテスト時にローカル関数をstubへのhookする方法 - Qiita
はじめに Node.jsでユニットテストをする場合に、どう設計するのが良いか？を言葉にしてみる。あくまで「私は、これが（今は）しっくりくる」という話。なおASTによるソース解析を含めたHook手法は、今回は行わないものとする。 こちらの記事「テストフレームワークを利用するときの、コード設計について」で書いた「テスト対象の関数から呼ばれる外部関数の全てをフック可能にしておく」と、結論としては同じ。 もう少しスッキリ書けるんじゃないかな？ってのがこの記事の目的。 あと「先にテストを書いてから実装」という話との関連も少し書く。 流れとしては、以下。 こんな風に書くと、テスト時のローカル関数のフックが楽にできる。 この書き方の元にテストを書くとこうなる（実装は無しでテストはFailする）。 実装するとこうなる。 【補足】 2018/07/10：サンプルコードへのリンク（GitHub）を追記しました
TypeScript + mocha + power-assert でプロジェクトルートに tsconfig.json を置いていない時のテスト方法 - Qiita
このコマンドで呼び出される、guess.js の処理はおおむね以下のように処理されています。 カレントディレクトリにある package.json の解析 テストディレクトリなどの設定取得 カレントディレクトリにある tsconfig.json の解析 TypeScript コンパイラオプションなどの設定取得 index.js にカレントディレクトリのパス、TypeScript コンパイラオプションの情報を渡し実行 テストを実行する際はほぼプロジェクトルートディレクトリで行われると思うので、カレントディレクトリはプロジェクトルートディレクトリに読み替えることが出来ます。 この時、手順 2においてプロジェクトルートディレクトリに tsconfig.json が存在しないため null が返ってきてしまいコンパイラオプションを取得できず、テスト実行に失敗してしまいます。 ローダの設定とテストの
mochaのhook関数が呼ばれる順番 - Qiita
mochaで、describeをネストして書くことが多いんですが、その時にhook関数がどういう順番で呼ばれるのか不安に駆られたので調べてみました。 テストコードはこんな感じです。行数削減のために詰めて書いているのでちょっと見難いですが、ご容赦ください。 const {expect} = require("chai"); before(function(){console.log("global before")}); beforeEach(function(){console.log("global beforeEach")}); after(function(){console.log("global after")}); afterEach(function(){console.log("global afterEach")}); describe("hook call order
JavaScriptのテスト環境構築(Mocha + power-assert + Karma + babel + webpack) - Qiita
この記事は、初めてJavaScriptのテスト環境を作ってみたおじさんによる、これからJavaScriptのテストを書いていきたいけど、登場人物が多すぎてなにやらめんどくさそうと思っている方に向けた記事兼備忘録です。 初めてのJavaScriptテスト環境構築で一応公式ドキュメントに目を通したけど英語の意味をちゃんと読み取れておらず、ツールやライブラリの理解や使い方が間違っている場合がありますのでアドバイスいただけると幸いです。 各テストツールやライブラリの紹介 JavaScriptのテスト環境を構築するときの一つ目の壁がツールやライブラリがたくさん出てきて、どれを使っていいかわからない/それぞれの役割がわからないことだと思う。 なので、まずはJavaScriptのテスト環境についてググったときに出てくる最近使われてそうな各ツールやライブラリの役割をすごく雑に紹介します。 テストフレームワ
power-assertの例外処理を見やすくする - Qiita
power-assert is fully compatible with assert. So functions below are also available though they are not enhanced (does not produce descriptive message). assert.fail(actual, expected, message, operator) assert.throws(block, [error], [message]) assert.doesNotThrow(block, [message]) assert.ifError(value) API - power-assert/v1.3.1/README.md とあるように、assert.throwsはテスト失敗時に整形されません。
jsdom + power-assert + eater で Invalid TypeError が出て失敗する時 - Qiita
なんかどうも jsdom + power-assert + 自作の eater を使ってテストをしていたら espower-loaderが中で使っている source-map-support のモジュールがエラーになる。 エラーの場所はココ で、source-map-support の中で何やってるかというと、 error.stack プロパティがあるかどうかを見てるが、 stack を触った瞬間に下記のエラーになり、巻き込んで別な例外が出て死ぬ TypeError: Invalid URL Error /Users/furukawa.yosuke/Program/xxxxxxxx/node_modules/espower-loader/node_modules/source-map-support/source-map-support.js:388 var hasStack = (arg
node-v0でassert.deepStrictEqualを使うと`undefined is not a function`になるので - Qiita
assert-polyfill - an exterminate "TypeError: undefined is not a function" you encounter in node-v0. polyfillを作成しました。mocha.optsに定義するか、power-assertのrequire前に実行することで、deepStrictEqualとnotDeepStrictEqualが未定義の時だけ、アサート関数を定義します。 require('assert-polyfill'); var assert = require('power-assert'); assert.deepStrictEqual(['foo'], ['foo']) // pass assert.notDeepStrictEqual(['foo'], ['bar']) // pass
TypeScript + Angular1系プロジェクトにユニットテストを書く - Qiita
Angular1系で書かれてるプロダクトにテストを用意するにあたって環境の構築、実際のテストコードの作成など、色々調べたのでまとめていこうと思います。 前提環境 TypeScript（v1.8, 含テストコード） AngularJS(v1.4) karma+mocha+power-assert コードはイマドキのrequireからの依存解決してbundleするスタイルではなく、TypeScriptのnamespaceでスコープを区切ってtsc --outFile dist/bundle.jsのようにconcatした単一ファイルを吐き出す形です。 環境を再現したリポジトリ：https://github.com/sisisin-sandbox/ngts/tree/master/namespace-style 最低限karmaを動かせるようにする 色々ハマりましたが、最終的にはこちらの記事を参考
TypeScript2.1+mocha+power-assertでテストしようとして苦戦した話 - Qiita
TypeScript初心者です。 Node.jsで開発して規模が大きくなってくると型が恋しくなってきますね。TypeScriptはVisual Studio Codeでの補完も効くし、コンパイラがくだらないミスを教えてくれるのでうっかりさんには嬉しいです。 しかし、素のNode.jsで使っていたツール達がそのまま使えないのがネックです。 Node.jsで使用していたmocha, power-assertをTypeScript@2.1.5で使うまでにえらく苦労したのでその軌跡です。 前提 JavaScriptはブラウザで動くフロントエンドの話と、サーバーサイドのNode.jsの話が混在していて情報が錯綜しやすいのですが、本稿はサーバーサイドのNode.jsに関する話です。 . ├── dist ├── node_modules ├── package.json ├── src │ └── i
フロントエンドのテストに真面目に向き合う - Qiita
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象限 今回この記
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
TypeScript + mocha + power-assert で詰まった話 - Qiita
karma(+webpack)+babel(es6)+power-assertで動かす - Qiita
typescript + karma + mocha + power-assert + browserify メモ - Qiita
mochaによるテスト、mongodb初期化 - Qiita
karma、mocha、power-assert、webpackで Node.js と Webブラウザ 兼用の TypeScript コードをテストする - Qiita
Node.jsでESLintとMochaとPower-Assertのセットアップ - Qiita
mochaで始めるNode.jsを使ったテスト駆動開発の環境構築 - Qiita
RSpec で PowerAssert を使うもっとも簡単な方法 - Qiita
Rails で rspec-power_assert を assert の名前で使う方法 - Qiita