コンポーネント。 テストコンソール

コンポーネントノートの先頭

現在のバージョンと v1

通常のnode.js



モジュールのように、コンポーネントはコンソールでテストできます。 残念ながら、この場合の現在のバージョンでは、たとえばDOMに関連付けられている依存関係の使用に問題があります。 つまり、ノードnode mocha ...



実行して、コンソールに対してコンポーネントをテストする場合、DOMに関連付けられている別のコンポーネントを単にrequire



ことはできません。 いずれの場合でも、 require



コンソールはコンポーネントではなくnode.jsモジュールを選択します。 また、domify node.jsモジュールにはドキュメントオブジェクトがありません。 コンポーネントビルダーの将来のバージョンでは、状況が変わります。 https://github.com/component/component/issues/41を参照してください 。 これまでのところ、コンソールでこれらのコンポーネントをテストするためにファントムを使用できます。







現在のバージョンでは、次のようなものを使用する必要があります（さらに、コンポーネント本体ではテスト目的のみ）：

 try { var Route = require('route-component'); } catch (err) { var Route = require('route'); }
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

これにこだわるつもりはありません。v1を待ちます。 この投稿では、まず、低レベルのコンポーネントの単体テストがどのように配置されているかを見ていきます。 手動で、このプロセスの自動化について書きます。 js-applicationsの統合テストについて多くのことが書かれていますが、これについても詳しく説明しません。



たとえば、 component/indexof



、 component/each



など、パラレルノードモジュールと違いのない単純なコンポーネント（ラッパーを除く）は、現在依存関係として使用でき、コンソールのmochaテストは機能します。



サンプルコードはhttps://github.com/mbykov/component-testing-exampleで入手できます 。 クローンを作成して表示します。

ユニット対 統合テスト

統合テストとは何なのかは明らかです-アプリケーション自体を戦闘位置でテストしています（スタブとモックを無視する場合）。 Cucumber、Selenium、Capybaraを使用して、アプリケーション全体の応答が期待どおりであることを確認します。 単体テストは、コンポーネント内の個々のメソッドのテストです。 このメソッドのみが呼び出され、他の何かが影響を受ける場合、これは悪いです。 これが自家製の定義です。 ただし、コンポーネントはそのように設計されています。 外部からアクセスできない内部機能があり、当然テストには使用できません。 そして、どこからでも呼び出すことができるエクスポートされたメソッド。

test / test.js

コンソールテスト用の最も単純なコンポーネントを作成しましょう。 次の手紙を知る必要があります。



または



後に続くものを忘れてしまいました。 または、 ξ



- η



またはλ



後？ （この「おもちゃ」メソッドは、アクセントのない文字にのみ適しています）。



コンポーネントには、文字を翻訳するためのsym



とword



を表す単語の2つのメソッドがあるとします。 その中で、便利なように準備ができたコンポーネントcomponent/map



を使用します。



コンポーネントは

 var map = require('map-component'); module.exports = nextSym; function nextSym() { if (!(this instanceof nextSym)) return new nextSym(); return this; }
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

および2つの方法

 nextSym.prototype.sym = function(sym){ return String.fromCharCode(sym.charCodeAt(0)+1); } nextSym.prototype.word = function(word){ var self = this; var arr = word.split(''); var res = map(arr, function(sym) { return self.sym(sym); }) return res.join(''); }
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

if（！（このinstanceofの例））return new example（）の行は魔法の呪文です。これは、コンポーネントが呼び出されたときにnew演算子を書く必要がないことを意味します。

 $ make
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

package.json、mochaおよびshould

同じ著者であるTJ HolowaychukとShould Assertion Libraryのmochaフレームワーク（mocha）を使用します。



実際、コンポーネントではなくnode.jsを使用しているので、 package.json



ファイルを作成しましょう

 $ npm init
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

package.json



ファイルで、必要な依存関係を指定します

  "version": "0.0.1", "dependencies": { "map-component": "*" }, "devDependencies": { "mocha": "*", "should": "*" },
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

map-componentは、コンポーネントが動作するための依存関係の例として必要であり、mochaはテストに必要です。

 $ npm install
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

makefileとtest.js

コンソールでテストを手動で呼び出さないようにするには、Makefileファイルにテスト項目を記述します。

 test: @./node_modules/.bin/mocha \ --require should \ --reporter spec
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

mochaはデフォルトで、テストディレクトリ内のテストを検索します。 ファイルtest.jsを作成します

 var nextSym = require('..')(); describe('component console example', function(){ describe('symbol', function() { it(' before ', function() { var next = nextSym.sym(''); next.should.be.equal(''); }) }) describe('word', function() { it('shifted qwerty is rxfsuz', function() { var shifted= nextSym.word('qwerty'); shifted.should.be.equal('rxfsuz'); }) }) })
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

テストを実行する

  component console example symbol ✓  before  word ✓ shifted qwerty is rxfsuz 2 passing (19ms)
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

ただし、コンポーネントはブラウザで動作するように設計されています。 そのため、コンソールでのテストは例外である可能性が高くなります。 テストはブラウザで行う必要があり、便利です。 次をご覧ください セクション。



継続する