Question

点击按钮时，我在测试装载机的外观时遇到了一些麻烦。

我有以下三个测试：

  it('#exigence1 - display a failing message on button fail ', () => {
    page.navigateTo();
    page.getButtonFail().click();
    expect(page.getErrorMessage()).toBeTruthy();
  });

  it('#exigence2 - display a loader on waiting list ', () => {
    page.navigateTo();
    page.getButtonLoad().click();
    expect(page.getLoader()).toBeTruthy();
  });

  it('#exigence3 - display a list of items on message ', () => {
    page.navigateTo();
    page.getButtonLoad().click();
    expect(page.getPokeList()).toBeTruthy();
  });

当我点击getButtonLoad时，我在远程提取期间显示一个加载器。我需要测试这个加载器是否出现在页面上，但我之前的第二个测试没有通过。

这是我的实施：

 buttonClick() {
    this.showError = false;
    this.displayLoader = true;
    this.http.get('http://pokeapi.co/api/v2/pokemon/')
      .map(res => res.json())
      .subscribe(res => {
        this.pokemons = res.results;
        this.displayLoader = false;
      });
  }

使用我的页面定义：

export class ProtractorDemonstrationPage {
  navigateTo() {
    return browser.get('/');
  }

  getPokeList() {
    return element(by.css('.poke-list')).getText();
  }

   getButtonLoad() {
    return element(by.css('.btn-primary'));
  }

   getButtonFail() {
    return element(by.css('.btn-warn'));
  }

   getErrorMessage() {
    return element(by.css('.panel-danger')).getText();
  }

    getLoader() {
    return element(by.css('.loader')).getText();
  }
}

我根本不知道如何进行验证此案例的测试。

编辑：我看到的是点击时点击，等待功能完成其中的内容，然后再进入下一条指令。这是我的问题。我需要点击，不要等待异步的东西，直接检查我的装载机是否存在。

编辑2：这是函数的代码：

 load() {
    this.showError = false;
    this.displayLoader = true;
    this.http.get('http://pokeapi.co/api/v2/pokemon/')
      .map(res => res.json())
      .subscribe(res => {
        this.pokemons = res.results;
        this.displayLoader = false;
      });
  }

Answer 1

问题在于page.getLoader（）和您的expect语句。使用page.getLoader（）调用，您将返回该元素的文本，但在您的expect语句中，您希望此函数返回一个布尔值。

您应该更改page.getLoader（）以返回：

return element(by.css('.loader')).isDisplayed();

或继续使用.getText（），但将expect语句更改为：

expect(page.getLoader()).toBe('This string');

量角器和装载机的点击项目

1 个答案: