unit-testing - firebase を使用するポリマー Web コンポーネントの単体テスト

Question

Firebase 分散データベースの最新リリースを使用するポリマー Web コンポーネントのオフライン単体テストを構成しようとしています。私のテストのいくつかは合格していますが、合格したものとほぼ同じように見える他のテストは正しく実行されていません。

私の構成を示すプロジェクトを github にセットアップしました。以下にさらに解説を加えます。

サンプル: https://github.com/doctor-g/wct-firebase-demo

そのプロジェクトには、正常に動作する 2 つのテスト スイートがあります。最も単純なのはoffline-test、Web コンポーネントをまったく使用しない です。これは単に、firebase データベースのオフライン モードを使用して単体テストを実行できることを示しています。このトリックの核心は、以下に示すメソッドにあります。これは、 firebase-server に関する nfarina の作業suiteSetupから取り上げたトリックです。

suiteSetup(function() {
  app = firebase.initializeApp({
      apiKey: 'fake',
      authDomain: 'fake',
      databaseURL: 'https://fakeserver.firebaseio.com',
      storageBucket: 'fake'
  });
  db = app.database();

  db.goOffline();
});

すべてのテストにoffline-test合格しました。

次のスイートはwct-firebase-demo-app_test.html、同名の Web コンポーネントをテストする です。このスイートには、同様に設定されて合格する一連の単体テストが含まれていoffline-testます。依存性注入の考え方に従って、wct-firebase-demo-appコンポーネントにはdatabase、firebase データベース参照が渡される属性があり、これはすべての firebase 呼び出しを行うために使用されます。スイートの例を次に示します。

  test('offline set string from web component attribute', function(done) {
    element.database = db;
    element.database.ref('foo').set('bar');
    element.database.ref('foo').once('value', function(snapshot) {
      assert.equal(snapshot.val(), 'bar');
      done();
    });
  });

コンポーネントには非常に単純なメソッドもいくつかあります。これは、すぐに説明する壊れた部分に向かって三角測量を行う試みです。このテストに合格したと言えば十分です。

test('offline push string from web component function', function(done) {
    element.database = db;
    let resultRef = element.pushIt('foo', 'bar');
    element.database.ref('foo').once('value', function(snapshot) {
      assert.equal(snapshot.val()[resultRef.key], 'bar');
      done();
    });
  });

で、次の実装によってサポートされていますwct-firebase-demo-app。

  pushIt: function(at, value) {
    return this.database.ref(at).push(value);
  },

繰り返しますが、これらはすべてパスします。今、私たちは本当の困惑にたどり着きます。x-elementメソッドを持つ別の要素 の一連のテストがありますpushData。

  pushData: function(at, data) {
    this.database.ref(at).push(data);
  }

このメソッドのテストは、そのスイートで唯一のテストです。

  test('pushData has an effect', function(done) {
    element.database = db;
    element.pushData('foo', 'xyz');
    db.ref('foo').once('value', function(snapshot) {
      expect(snapshot.val()).not.to.be.empty;
      done();
    });
  });

このテストは合格しません。このテストの実行中に、コンソールに次のエラー メッセージが表示されます。

    Your API key is invalid, please check you have copied it correctly.

onceいくつかのブレークポイントを設定して実行をたどると、このエラーは呼び出しの後、コールバックがトリガーされる前に発生するように思えます。繰り返しますが、これは、上で説明した にある同じテスト構造では発生しないことに注意してくださいwct-firebase-demo-app。

それが私が立ち往生しているところです。offline-testおよびwct-firebase-demo-app_testスイートは正常に動作するのに、この API キー エラーが で表示されるのはなぜx-element_testですか? 私が持っている他の唯一の手がかりは、有効な API キーをinitializeApp構成にコピーすると、代わりにテストタイムアウトが発生することです。

アップデート：

これは、テストを実行したときのコンソール ログの (パッチを適用した) イメージです。

以下のtony19によって提起された問題を説明するために、pushData has an effectコメントアウトx-element_testされたコンソールログを次に示します。