テストは失敗ではなく、する必要があります - モカとCasperJS

は私がmocha-casperjs テストは失敗ではなく、する必要があります - モカとCasperJS

私のテストはここに私の偽陽性を与えている理由はありませんアイデアを使用しています。 htmlページはaaaaaをレンダリングしますが、そのdivが "No Companies Listed"というテキストをまだレンダリングしているかどうかを確認しようとしています。なぜですか？

"use strict"; 

var page = null, 
    $ = require('jquery'); 


describe('Feature: View List of Companies', function() { 
    before(function(done) { 
     casper.start('http://localhost:3000'); 
     casper.on("remote.message", function(msg){ 
      this.echo("remote.msg: " + msg); 
     }); 
     casper.on("page.error", function(pageErr){ 
      this.echo("page.err: " + JSON.stringify(pageErr)); 
     }); 

     casper.then(function(){ 
      this.page.injectJs('../../../public/js/jquery-2.2.3.min.js'); 
     }) 

     done(); 
    }); 

    it('When I go to the main landing page', function() { 
     casper.then(function() { 
      expect(this.page).to.be.a('object'); 
     }); 
    }); 

    describe('Scenario 1: No Companies are Listed', function() { 
     it('should see that no companies are listed', function() { 
      var companyList = null; 
      casper.waitForSelector('#companyList', function() { 
       this.evaluate(function() { 
        companyList = $('#companyList').value; 
        console.log("list: " + companyList); 
       }); 
       expect(companyList.to.equal('No Companies Found')); 
      }); 
     }); 
    }); 

    casper.run(function() { 
     exitPhantomJS(); 
    }); 
}); 


function exitPhantomJS(){ 
    this.exit(); 
}

そして、ここでレンダリングされているもののビューのソースです：

<!DOCTYPE html> 
<html lang="en"> 
    <head> 
     <meta charset="utf-8"> 

     <!-- load Ink's CSS --> 
     <link rel="stylesheet" type="text/css" href="public/libs/ink-3.1.10/css/ink-flex.min.css"> 
     <link rel="stylesheet" type="text/css" href="public/libs/ink-3.1.10/css/font-awesome.min.css"> 

     <style> 
      body { 
       background: #ededed; 
      } 
     </style> 
    </head> 
    <body> 
     <div class="ink-grid vertical-space"> 
      <div id="content"> 
       <div class="panel vertical-space"> 
        <div id="companyList">aaaaa</div> 
        <!--<div id="app"/>--> 
       </div> 
      </div> 
     </div> 
     <script type="text/javascript" src="build/app/js/bundle.js"></script> 
    </body> 
</html>

結果

Feature: View List of Companies 
    ✓ When I go to the main landing page 
    Scenario 1: No Companies are Listed 
     ✓ should see that no companies are listed 


    2 passing (12ms)

出典

2016-04-13 PositiveGuy

''私がメインのランディングページに行くときに ''あなたは約束を返すことができます（ 'return casper.then ...'） – MarcoL

あなたはまだ生きていますか？あなたはフィードバックをしてはいけませんか？ –

あなたのコードに問題があります。最も注目に値するのは、

が実際にはexpect(null.to.equal('No Companies Found'));であり、結果としてTypeErrorになることです。

おそらくexpect(companyList).to.equal('No Companies Found');を使用したかったのですが、これはTypeErrorにならないため、テストに失敗します。

テストが失敗する理由は、casper.evaluate()がDOMへのサンドボックスアクセスを提供するためです。あなたは外に定義されている変数を参照することはできません、あなたはそれからデータを取得したい場合は、明示的にそれを渡す必要があります。

var companyList = null; 
casper.waitForSelector('#companyList', function() { 
    companyList = this.evaluate(function() { 
     return $('#companyList')[0].innerHTML.trim();; 
    }); 
    expect(companyList).to.equal('No Companies Found'); 
});

div要素が値を持っていないとjQueryのコレクションはvalueを持っていませんプロパティ。 textContentまたはinnerHTMLを使用します。

別の問題：exitPhantomJSを直接呼び出すため、thisはcasperを参照していないため、別のTypeErrorが発生します。 casper.run(exitPhantomJS);またはcasper.run();を使用してください。

出典

2016-04-13 09:29:34

テストは失敗ではなく、する必要があります - モカとCasperJS

答えて

関連する問題