Question

因此，我正在尝试使用针对离子应用程序的量角器e2e测试来测试我的登录页面。这是我第一次使用量角器，我无法理解出现的错误。

错误：-失败：没有此类元素：无法找到元素：{“ method”：“ css选择器”，“ selector”：“ * [id =” user1“]”}

我被困住了，我只需要指导。这是我的第一次测试。

app.e2e-spec.ts：

describe('Login tests', () => {

browser.driver.get('http://url.path/login');


it('login page works', function() {
  // Checking the current url
  var currentUrl = browser.driver.getCurrentUrl();
  expect(currentUrl).toMatch('/login');
});

it('should sign in', function() {


// Find page elements
 var userNameField = browser.driver.findElement(by.id('username'));

 var userPassField = browser.driver.findElement(by.id('password'));
//  var userLoginBtn  = browser.driver.findElement(By.id('loginbtn'));

// Fill input fields
userNameField.sendKeys('nick@email.com');
userPassField.sendKeys('123456');

// Ensure fields contain what we've entered
// expect(userNameField.getAttribute('value')).toEqual('nick@email.com');
// expect(userPassField.getAttribute('value')).toEqual('123456');

// Click to sign in - waiting for Angular as it is manually bootstrapped.
// userLoginBtn.click();

return browser.driver.wait(function() {
      return browser.driver.getCurrentUrl().then(function(url) {
          return /success/.test(url);
      });
}, 10000);
});
});

Login.html：

<!--
  Generated template for the LoginPage page.

  See http://ionicframework.com/docs/components/#navigation for more info on
  Ionic pages and navigation.
-->
<link href="https://fonts.googleapis.com/css?family=Sacramento" type="text/css" rel="stylesheet">

<ion-header>

    <ion-navbar transparent>
      <!--ion-title>Login</ion-title-->
    </ion-navbar>

  </ion-header>


  <ion-content padding>

    <div class="align">
        <h1>Atelier</h1>
    </div>

      <ion-card>
          <ion-card-header>
           Login
          </ion-card-header>
          <ion-card-content>
             <ion-list >
               <ion-item>  
                   <ion-input id="username" type="email"      placeholder="Email" [(ngModel)]="user.email"></ion-input>
               </ion-item>
               <ion-item>  
                   <ion-input id ="password" type="password" placeholder="Password" [(ngModel)]="user.password"></ion-input>
               </ion-item>
              <button  ion-button full clear color="light" (click)="login(user)">Login</button>
              <button ion-button block round outline color="light" (click)="register()">Register</button>
             </ion-list>    
          </ion-card-content>
        </ion-card>

  </ion-content>

    <style>
      h1{
        font-size: 3em;
        text-align: center;
        font-family: Sacramento;
        font-style: cursive;
        color: white;
        text-shadow: 4px 4px 4px rgba(0,0,0,0.1); 
      }
  </style>

app.po.ts：

import { browser, by, element } from 'protractor';

export class LoginPage {
 navigateTo(){
  return browser.get('/login');
 }
 get usernameLabel() {
  return element(by.css('.login-field:nth-child(1) label'));
  }

 getEmailTextbox() {
  return element(by.id('username'));
 }
 get passwordLabel() {
  return element(by.css('.login-field:nth-child(2) label'));
  }
getPasswordTextbox() {
 return element(by.id('password'));
  }
  }

   export class Page {

   navigateTo(){
    return browser.get('/login');
      }

    getTitle() {
   return browser.getTitle();
    }

   getPageOneTitleText() {
   return element(by.tagName('page-page1')).element(by.tagName('ion-  title')).element(by.css('.toolbar-title')).getText();
     }

  goToLoginPage(): any{
   let LoginPage = require("../src/pages/login/login").default;
   return new LoginPage();
  }

 getUser(){
   return element(by.id('username'))
 }

  getPass(){
   return element(by.id('password'))
   }

 }

Answer 1

如果您因量角器而出现此错误

错误：-失败：没有这样的元素：无法找到元素： {“ method”：“ css选择器”，“ selector”：“ * [id =” user1“]”}

并且您正在使用此定位器，这是不可能的，因为您正在使用id= username并且量角器返回“ selector”：“ * [id =” user1“]” 真是难以置信。

 var userNameField = browser.driver.findElement(by.id('username'));

 var userPassField = browser.driver.findElement(by.id('password'));

您正在使用量角器，那么您必须使用量角器定位器量角器提供了很棒的定位器类，然后您必须使用量角器定位器。

您可以使用最适合您的测试的element(by.model('user.email'))。

量角器E2E测试：LoginPage

1 个答案: