web-dev-qa-db-ja.com

Angular Fixture DebugElement Query by class By Elements Not Returning

Angular.io Framework Testingドキュメントで提案されているように、Angular Testbed + Karma test Runnerを使用してDebugElementクエリを利用しようとしています。クラスのli要素を生成するjqwidgets Treeコンポーネントを作成しました'.jqx-tree-item-li'。DOMテストでストレートJavaScriptを使用する次のテストは、合格[〜＃〜] green [〜＃〜]：

    it('Elements of class jqx-tree-item-li found using getElementsByClassName ', (done) => {

    this.fixture.whenStable().then(
      () => {
        var elementArray = document.getElementsByClassName('jqx-tree-item-li');
        expect(elementArray.length).toBeGreaterThan(0); //passes without issue :)
        done();
      }
    );
  });

しかし、このテストは[〜＃〜] same [〜＃〜]仕様（同一のテストベッドセットアップ）[〜＃〜] fails [〜＃〜] 0のため返される要素：

   it('Elements of class jqx-tree-item-li found using Angular DebugElement ', (done) => {

    this.fixture.whenStable().then(
      () => {
        var elementArray = this.fixture.debugElement.queryAll(By.css('.jqx-tree-item-li'));
        expect(elementArray.length).toBeGreaterThan(0); //fails! why? :(
        done();
      }
    );
  });

Angular DebugElementを使用して検出されたクラスjqx-tree-item-liのオブジェクトエクスプローラーコンポーネント要素0は0より大きいことが期待されています。

これを確認したのは初めてではなく、ルートコンポーネント要素が取得されることはわかりましたが、DebugElementクエリでコンポーネント内の要素を返すことができないようです。ドキュメンテーションは明示的に述べていますが、サブツリーを照会します。これまでのところ、回避策は、意図したとおりに機能する上記のようなJavaScriptクエリだけです。

ここで何か不足していますか？ DebugElement.queryを機能させる方法に関する提案はありますか？そうでない場合、誰かがDebugElementクエリの問題を発見しましたか？ありがとうございました。

javascriptangularunit-testingkarma-jasmine
5
user7611503

あなたはいくつかの間違いをしました

  • detectChangesがありません

  • documentを使用したクエリは正しくありませんが、fixture.debugElementを使用する必要があります

    it('Elements of class jqx-tree-item-li found using getElementsByClassName ', (done) => {

    this.fixture.whenStable().then(
        () => {
            fixture.detectChanges(); // missed
            var elementArray = fixture.debugElement.query(By.css('.jqx-tree-item-li')); // use fixture instance to 
            expect(elementArray.length).toBeGreaterThan(0); //passes without issue :)
            done();
        }
    );
});
7
Aravind