html

Question

我当前正在运行一个量角器e2e并遇到类似于https://github.com/ionic-team/ionic/issues/15956的情况：尝试简单地将诸如element(by.name('username')).sendKeys(this.username);的键发送到ion-input会得到- Failed: element not interactable (Session info: chrome=75.0.3770.80)。

我的设置使用最新版本的ionic，我的详细信息是：

Ionic:

   ionic (Ionic CLI)             : 4.12.0
   Ionic Framework               : @ionic/angular 4.6.2
   @angular-devkit/build-angular : 0.12.4
   @angular-devkit/schematics    : 7.1.4
   @angular/cli                  : 7.1.4
   @ionic/angular-toolkit        : 1.5.1

Cordova:

   cordova (Cordova CLI) : 9.0.0 (cordova-lib@9.0.1)
   Cordova Platforms     : android 8.0.0
   Cordova Plugins       : cordova-plugin-ionic-keyboard 2.1.3, cordova-plugin-ionic-webview 4.0.1, (and 15 other plugins)

System:

   Android SDK Tools : 26.1.1 (/home/***/Android/Sdk)
   NodeJS            : v10.15.3 (/home/***/nodejs/node-v10.15.3-linux-x64/bin/node)
   npm               : 6.9.0
   OS                : Linux 4.18

这是e2e测试：

        page.navigateTo();
        await page.fillCredentialsWrong();
        expect(page.getParagraphText()).toContain('LOGIN');
    });

使用方法

 async fillCredentialsWrong() {
        await element(by.css('ion-input[formControlName="email"]')).sendKeys(this.validUsername);
        await element(by.css('ion-input[formControlName="password"]')).sendKeys(this.validPassword + 1);
        await element(by.css('.login-btn')).click();
    }

html

 <form *ngIf="loginSelector === true" [formGroup]="loginFormGroup">
            <!--email-->
            <ion-item>
                <ion-label position="stacked">Email</ion-label>
                <ion-input name="username" type="email" formControlName="email" required></ion-input>

          <!--password-->
            <ion-item>
                <ion-label position="stacked">Password</ion-label>
                <ion-input name="password" type="password" formControlName="password" required></ion-input>
            </ion-item>
            </ion-item>
</form>

我什至尝试在所有sendkey操作中都没有使用ngIf和使用await

ion-text应该被填充，但是失败：

Failed: element not interactable
       (Session info: chrome=75.0.3770.80)
       (Driver info: chromedriver=2.46.628388 (4a34a70827ac54148e092aafb70504c4ea7ae926),platform=Linux 4.18.0-1015-gcp x86_64)
       (Session info: chrome=75.0.3770.80)
       (Driver info: chromedriver=2.46.628388 (4a34a70827ac54148e092aafb70504c4ea7ae926),platform=Linux 4.18.0-1015-gcp x86_64)
         at Object.checkLegacyResponse (/home/dev/workspace/autoreport/node_modules/selenium-webdriver/lib/error.js:546:15)
         at parseHttpResponse (/home/dev/workspace/autoreport/node_modules/selenium-webdriver/lib/http.js:509:13)
         at doSend.then.response (/home/dev/workspace/autoreport/node_modules/selenium-webdriver/lib/http.js:441:30)
         at process._tickCallback (internal/process/next_tick.js:68:7)

Answer 1

当ion-input在其中创建输入时，您需要一种将输入元素引用到sendKeys的方法。

您可以通过以下方式实现：

await element(by.css('ion-input[formControlName="email"] input')).sendKeys(this.validUsername);

获取可与之交互的离子输入的输入。

Answer 2

@Ben 是对的，因为 ion-input 在内部创建了一个输入。我发现使用此 //ion-input[@id='my-id']/input XPath 进行搜索更容易：在 java 中：

    @FindBy(xpath = "//ion-input[@id='my-id']/input")
    private WebElement myInput;

您所要做的就是将 id 分配给 ion-input。

离子输入端到端测试结果表明元素不可交互

html

2 个答案: