无法点击添加按钮

Question

<div class="MuiGrid-root jss48321 MuiGrid-item MuiGrid-grid-xs-12 MuiGrid-grid-sm-3 MuiGrid-grid-md-3 MuiGrid-grid-lg-3 MuiGrid-grid-xl-3">
<h4 class="MuiTypography-root jss48324 MuiTypography-h4">Decks</h4>
<button class="MuiButtonBase-root MuiFab-root jss48323 MuiFab-sizeSmall MuiFab-primary" tabindex="0" type="button" aria-label="add" title="Add">
<span class="MuiFab-label">
<svg class="MuiSvgIcon-root" focusable="false" viewBox="0 0 24 24" aria-hidden="true">
<path d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z"></path>
</svg>
</span>
<span class="MuiTouchRipple-root"></span>
</button></div>

由于是react js应用，所以加了

browser.waitForAngularEnabled(false);

这里我想点击添加图标（+）

我的测试脚本：

describe('IEC', function () {
it('Login', function () {
browser.waitForAngularEnabled(false);
browser.get('cannot provide the url since it requires VPN');
element(by.css('input[type="text"]')).sendKeys('12345');
element(by.css('input[type="password"]')).sendKeys('Pwd');
element(by.buttonText('Login')).click();
element(by.css('button[title="Add"]')).click();
});
});

输出：

Failed: No element found using locator: By(css selector, button[title="Add"])

如何解决这个问题？#

Answer 1

Protractor 内置了特定于 Angular 个页面的等待。您的页面正在响应，并且通过运行 browser.waitForAngularEnabled(false); 您禁用了等待

现在您的代码将按照您的指示执行操作：设置用户名和密码并单击提交。大概 5 毫秒后您尝试单击添加按钮？但它不存在。我很确定登录后至少需要 10 秒来加载应用程序。因此您需要添加该步骤。 browser.sleep(15000) 这是非常糟糕的做法，或者使用 browser.wait

添加显式等待条件

另外，你的每一行代码returns承诺，但你不去处理它。副作用是不能保证命令的顺序。我已经在之前的帖子中告诉过您，您需要使用 async/await。除非你这样做，否则你会遇到成千上万的问题，我保证

无法点击添加按钮

Not able to click on the Add button

jasmine

reactjs

protractor