所以在我的基本角度应用程序中,我有一个登录表单:
<form layout="column" class="form">
<md-input-container>
<label for="email" translate>login.email</label>
<input id="email" type="email" ng-model="login.user.email" />
<span ng-bind="login.user.email"></span>
</md-input-container>
<md-input-container>
<label for="password" translate>login.password</label>
<input id="password" type="password" ng-model="login.user.password" />
<span ng-bind="login.user.password"></span>
</md-input-container>
<md-button class="hbd-primary" ng-click="login.authenticate()" id="submit-button">
<span translate>login.connection</span>
</md-button>
</form>
我目前正在用量角器和茉莉花编写功能测试。这是我的登录测试:
it('should fail login with bogus credentials', function() {
page.emailInput.clear().then(function() {
page.emailInput.sendKeys('supermerchant@bogus.com');
});
expect(page.emailInput.getAttribute('value')).toBe('supermerchant@bogus.com');
page.passwordInput.clear().then(function() {
return page.passwordInput.sendKeys('boguspass');
})
.then(function() {
expect(page.passwordInput.getAttribute('value')).toBe('boguspass');
return page.submitButton.click();
})
.then(function() {
expect(page.alert.element(by.id("login-alert-text")).getText())
.toBe('Email ou mot de passe invalide');
});
});
我的问题是 sendKeys() 方法,即使它正确写入了电子邮件和密码(视觉上它在输入中),当它触发登录功能时,我注意到请求参数有些奇怪:我的对象的字段电子邮件和密码用户为空,例如“”。但是,当我检查输入的“值”属性时,它已正确填写,例如“supermerchant@bogus.com”和“boguspass”。
所以我搜索了很多,但到目前为止一无所获,我不知道问题可能出在哪里......
任何线索将不胜感激!
编辑:来自控制器和服务的附加代码。
登录控制器
var vm = this;
vm.errors = '';
vm.user = {email: 'a', password: 'a', remember: true};
/**
*
* Log the user in.
*
**/
function authenticate() {
vm.errors = '';
retrieveToken(vm.user);
};
/**
*
* Get the jwt token. Change state depending on status.
*
**/
function retrieveToken(user) {
authService.login(user)
.success(function(data, status, headers, config) {
saveToken(data.token);
$state.go('employee');
})
.error(function(data, status, headers, config) {
vm.errors = 'Email ou mot de passe invalide';
});
};
/**
*
* Store the authenticated user.
*
**/
function saveToken(dataToken) {
var token = jwtHelper.decodeToken(dataToken);
var user = {
id: token.id,
firstName: token.firstName,
lastName: token.lastName,
roles: token.roles,
token: dataToken
};
authService.setAuthentication(true, user);
};
身份验证服务
function auth($injector, constants) {
var _authenticated = false;
var _user = null;
var service = {
login: login,
isAuthenticated: isAuth,
setAuthentication: setAuth,
getToken: getToken
};
/**
*
* Get the user authentication jwt.
*
**/
function login(user) {
return $injector.get('$http')
.post(constants.baseApiUrl + 'authentication/login', user);
};
/**
*
* Return a boolean to check if user is connected to app.
*
**/
function isAuth() {
return _authenticated;
};
/**
*
* Set the current user authentication.
*
**/
function setAuth(auth, user) {
if (auth) {
_authenticated = true;
_user = user;
}
else if (auth === false) {
_authenticated = false;
_user = null;
}
};
编辑2:当我将字段电子邮件和密码设置为任何内容时,即使使用 clear 和 sendKeys,这些值在身份验证时也不会改变。但在视觉上,输入被正确清除和填充。所以我怀疑这个问题是数据绑定问题。也许双向绑定在某种程度上被破坏了。
EDIT3:好的,所以在每个输入下,我添加了一个带有 ng 绑定到电子邮件和密码模型的跨度。当使用 sendKeys 和 clear 时,spans 值不会改变(例如'a')。所以存在数据绑定问题!当我从输入中手动删除一个字符时,值会发生变化。