E2E测试-单击特定按钮

Question

我有一个按钮，它看起来像HTML格式

<span class="v-btn__content">Create</span>

我的E2E测试，我正在尝试点击Create按钮

module.exports = {
    'My first test case'(browser) {
        browser

        .url('http://localhost:8080/#/')

        .waitForElementVisible('#app')
        .waitForElementVisible('#input-10')
        .waitForElementVisible('#input-13')
        .setValue('#input-10', 'jdoe@email.com')
        .setValue('#input-13', '**')
        .click('.v-btn__content')
        .assert.textContains('.v-toolbar__title','App')
        .waitForElementVisible('.v-data-footer__pagination')
        .waitForElementVisible('.v-btn__content')
        .assert.textContains('.v-btn__content','Create')
        .click('.v-btn__content','Create')  ❌
        
    }
}

我得到了

✖测试如果元素<.v-btn_✖>包含文本'Create‘在5000 if中-预期的“包含文本’Create‘但得到：”不包含'Create'“(5219 If)

Answer 1

我无法100%确认我的猜测是正确的，但据我所知，textContains将选择一个DOM元素，为其提供选择器，并与您提供的文本进行比较。尽管在您的示例中，选择器是一个类名，它可以归因于几个元素，特别是一个通用元素，如v-btn__content。

一个可能的解决办法是给HTML按钮一个id，例如：<span id="create-content" class="v-btn__content">Create</span>，然后用以下方式替换textContains选择器：

...
.assert.textContains('#create-content', 'Create')
...

现在再说一遍，如果这是错误，那么我很惊讶您没有在.assert.textContains('.v-toolbar__title','App')中得到一个错误，但是这可能是因为textContains足够聪明，如果您的页面中只有一个元素，这很可能就是这样。

如果这不能解决它，乐意帮助进一步如果你可以提供一个最低限度的代码框。