Nightwatch supports creating custom commands that can simulating keystrokes, mouse clicks, and other inputs. A custom command can be chained with other Nightwatch commands, like so:
module.exports = {
"Login App" : function (client) {
client
.url("http://localhost:3000")
.login("[email protected]", "janedoe123")
.end();
}
};
To enable this, define a command in ./tests/nightwatch/commands/login
like so:
exports.command = function(username, password) {
this
.verify.elementPresent('#login')
// we clear the input in case there's any data remaining from previous visits
.clearValue("#emailInput")
.clearValue("#passwordInput")
// we simulate key presses
.setValue("#emailInput", username)
.setValue("#passwordInput", password)
// and we simulate a mouse click
.click("#signInToAppButton").pause(1000)
return this; // allows the command to be chained.
};
To make this all work, you will need to add id
attributes to your login page. At some level, it will need to roughly look something like the following:
<template name="login">
<div id="login">
<input id="emailInput" name="email" type="email" />
<input id="passwordInput" name="password" type="password" />
<button id="#signInToAppButton">Sign In</button>
</div>
</template>