2016-05-04 11 views
-1

mochaとchaiで値を出力する関数をテストする方法を理解していますが、このシステムを使って本格的なWebアプリケーションをテストする方法はわかりません。ボタンをクリックすると、すでにHTMLに存在する<div>が公開されていることをどのようにテストできますか?MochaとChaiでWebアプリケーションをテストする

私はこのtutorialに従いましたが、これは既に存在するアプリケーションには当てはまりません。私が新しいtest.htmlを作成することを望みますが、私のアプリが既存のHTMLに依存しているかどうかはわかりません。また、new Fooを作成し、Fooのようなテストを実行して、デフォルトのnameパラメータを持つことができると期待しています。しかし、私のアプリケーションではすでにdocument readyFooが作成されています。

多分私はポイントを逃しています。

答えて

2

アプリケーションをテストするときは、アプリケーション全体をテストするのではなく、アプリケーションが構成する個々のコンポーネントをテストする必要があります。これらのコンポーネントは、個別に、単独でテストします。

したがって、コンポーネントをテストするために必要な要素だけを組み込んだ「test.html」(例を挙げて)があります。あなたの最初の記述が与えられれば、 'test.html'はボタンと隠れたdivだけで構成されます。テストでは、ボタンのクリックをエミュレートして、divが非表示になっていないことを確認します。

これにより、コードを大規模なWebアプリケーションに統合する前に、コードの動作が正確になるようにすることができます。

ドキュメントの準備ができたらアプリケーションはFooを既に作成しているかもしれませんが、その特定のコードはFoo自身の単体テストには含まれません。

あなたがアプリケーションフレームワークを使用していないように思えますが、これは私が推奨するものです。これらは、Webアプリケーションのための十分に研究された構造を提供し、通常それらを使って構築されたアプリケーションのテストに関する豊富なドキュメントを持っています。 AngularJS(https://angularjs.org/)またはReact(https://facebook.github.io/react/)をお勧めしますが、多くの選択肢があります。

+0

このアプリは開発期間が10年以上あり、残念ながらReactやAngularに切り替える機会はありません。ブートストラップを取得するには、奇跡そのものがありました。あなたの答えは私には意味があります - 実際にページ全体をテストするためにテストフレームワークを使用することはできないと思いました。 – BarryBones41

+1

ああ、大丈夫です。従来のコードベースを使って作業していたら、コードのセクションを一度に少しずつテストすることになりました。しかし、残念ながら痛みを伴うでしょうが、赤ちゃんの繁栄と進歩が起こります。他のフレームワークのドキュメントは、現代のフレームワークがテストに役立つように構造化されている様子を見るのにも役立ちます。 – nfactorial

+0

Webアプリケーションまたはアプリケーション全体をテストする際に問題はありません。これは一般に「受入れテスト」と呼ばれ、単体テストとは異なり、アプリケーションが実世界で動作することを確認するために、すべての可動部品が連携してアプリケーションをエンドツーエンドでテストしたいと考えています。私。あなたのアプリは完璧だが、あなたのホスティング会社が信頼できないのであれば、それは受け入れテストに現れるかもしれないし、修正する必要があるだろう。 –

関連する問題