web-dev-qa-db-ja.com

TestCafe-リンクをクリックした後、ページが読み込まれるのを待ちます

現在のeコマースプロジェクトのe2eテストにtestcafeを使用しています。商品リストページで、セレクターを使用して商品タイルを選択し、クリックを実行します。この後、ページに製品詳細ページが読み込まれ、テストを続行できます。

問題は、ページがまだロードされていない間、製品詳細ページのアサートをすでに続行していることです。クリックアクションは、要素が表示されるのを待ち、ページが読み込まれるのを待ってから、アサートを続行すると想定しました。

テスト:

import HomePage from '../pages/HomePage/HomePage';
import ProductListerPage from '../pages/ProductListerPage/ProductListerPage';
import Browser from '../helpers/Browser';

fixture('test case').page('http://www.homepage.com');

test('test 1', async t => {
  const homePage = new HomePage();
  await homePage.header.search(t, 'foo bar');

  await t.expect(Browser.getCurrentLocation()).eql('http://www.product-lister/search?q=3301');
  const productListerPage = new ProductListerPage();
  await productListerPage.goToFirstProduct(); // <<< in here I click on the first product

  await t.expect(Browser.getCurrentLocation()).eql('http://www.product-detail/'); // << already executed on lister page instead of product page
});

ProductListerPage:

import AbstractPage from '../AbstractPage';
import {t, Selector} from "testcafe";

class ProductListerPage extends AbstractPage {

  constructor() {
    super();

    this._productTilesContainer = Selector('.productLister-productTeasersInner');
    this._productTiles = this._productTilesContainer.child('a.productListerTeaser');
  }

  async goToFirstProduct() {
    return await t.click(this._productTiles.nth(0));
  }
}

export default ProductListerPage;

スリープだけを使用する代わりに、ページの読み込みを待つ別の方法はありますか?または、最善の解決策は何ですか?

よろしく、コーネル

7
Cornel Janssen

タイムアウト値を指定して、ページがそのURLに表示されるまでexpectが一定の時間待機するようにすることができます。必要な時間に応じて、タイムアウトを低くしたり高くしたりできます。そうしないと、デフォルトのタイムアウトが使用されます。デフォルトが何であるか思い出せませんか?

詳細情報 セレクターオプション

await t.expect(Browser.getCurrentLocation()).eql('http://www.product-detail/', {timeout: 5000});

6
BarretV