在量角器中填写表格的更有效方法？

Question

我有一个 e2e 测试，它在我的应用程序的表单中填写数据。我想让代码更高效，并想知道它是否值得。基本上，我目前的代码将键发送到所有必填字段，然后单击保存按钮。从那里我检查数据是否正确显示以及是否显示成功消息。保存表单后的测试不是我需要提高效率的。这是填写表格的过程。所以我很好奇是否有人可以提供任何有关这样做的更实用方法的见解。我有点困惑，因为量角器使用承诺，所以为我的表单做一个循环不会真正起作用，因为元素不可见。此外，我有一个电子邮件验证和下拉菜单，因此循环执行并不能很好地工作，因为有些字段需要特定格式。我正在考虑创建一个填写整个表单的函数，然后在我的测试中调用该函数，以便我的测试更有效率。我只是不确定这样做是否值得。任何建议都会很棒。我应该保留代码原样吗？这是我填写表单的代码示例。谢谢！

  page.getNameInput().sendKeys('test');
  browser.sleep(1000);
  page.getLastNameField().sendKeys('testLast');
  browser.sleep(1000);
  page.getEmailField().sendKeys('test@test')

  //these are drop down menus
  page.getProgramField().sendKeys(Key.RETURN);
  page.getProgramField().sendKeys(Key.RETURN);
//2nd drop down
  page.getFileField().sendKeys(Key.RETURN);
  page.getFileField().sendKeys(Key.RETURN);
})

Answer 1

所以总的来说，使用起来非常糟糕，browser.sleep()因为您实际上无法知道操作完成的确切时间。这就是为什么他们发明了承诺。

在您的特定情况下，一种选择是创建一个名为async fillInput(element, text). 此函数负责将数据填充到ElementFinder使用element(by.css('SOME_CSS_RULE')).

export async function fillInput(el, text) {
  await el.click()
  await el.clear();
  await el.sendKeys(text);
}

在函数中你可以看到await. 它实际上等待解决承诺并解开它的价值。这消除了无休止的嵌套的痛苦promises。await在每个异步函数中都可用。一个函数是异步的，因为你async在它前面放了一个词。在这种情况下，fillInput()返回一个Promise<void>对象，因为每个async函数都返回一个Promise.

结合给定的函数，await您可以在测试中执行以下操作：

// ...
var page;

t.beforeAll(function() {
  page = getMyPage();
});

t.it('should be able to fill out form' , async function() {
  await fillInput(page.getNameInput(),  'foo');
  await fillInput(page.getLastNameField(), 'bar');
  // ...
});