Refactor login page to get rid of warning on test (#6083)

This commit is contained in:
Kaan Kabalak 2018-06-28 10:30:57 -07:00 committed by kannappanr
parent 25de775560
commit 8bd7a19d50
3 changed files with 66 additions and 35 deletions

View File

@ -25,14 +25,35 @@ import web from "../web"
import { Redirect } from "react-router-dom"
export class Login extends React.Component {
constructor(props) {
super(props)
this.state = {
accessKey: "",
secretKey: ""
}
}
// Handle field changes
accessKeyChange(e) {
this.setState({
accessKey: e.target.value
})
}
secretKeyChange(e) {
this.setState({
secretKey: e.target.value
})
}
handleSubmit(event) {
event.preventDefault()
const { showAlert, history } = this.props
let message = ""
if (!document.getElementById("accessKey").value) {
if (this.state.accessKey === "") {
message = "Access Key cannot be empty"
}
if (!document.getElementById("secretKey").value) {
if (this.state.secretKey === "") {
message = "Secret Key cannot be empty"
}
if (message) {
@ -41,8 +62,8 @@ export class Login extends React.Component {
}
web
.Login({
username: document.getElementById("accessKey").value,
password: document.getElementById("secretKey").value
username: this.state.accessKey,
password: this.state.secretKey
})
.then(res => {
history.push("/")
@ -77,6 +98,8 @@ export class Login extends React.Component {
<div className="l-wrap">
<form onSubmit={this.handleSubmit.bind(this)}>
<InputGroup
value={this.state.accessKey}
onChange={this.accessKeyChange.bind(this)}
className="ig-dark"
label="Access Key"
id="accessKey"
@ -87,6 +110,8 @@ export class Login extends React.Component {
autoComplete="username"
/>
<InputGroup
value={this.state.secretKey}
onChange={this.secretKeyChange.bind(this)}
className="ig-dark"
label="Secret Key"
id="secretKey"

View File

@ -60,20 +60,25 @@ describe("Login", () => {
alert={{ show: false, type: "danger"}}
showAlert={showAlertMock}
clearAlert={clearAlertMock}
/>,
{ attachTo: document.body }
/>
)
// case where both keys are empty - displays the second warning
wrapper.find("form").simulate("submit")
expect(showAlertMock).toHaveBeenCalledWith("danger", "Secret Key cannot be empty")
// case where access key is empty
document.getElementById("secretKey").value = "secretKey"
wrapper.setState({
accessKey: "",
secretKey: "secretKey"
})
wrapper.find("form").simulate("submit")
expect(showAlertMock).toHaveBeenCalledWith("danger", "Access Key cannot be empty")
// case where secret key is empty
document.getElementById("accessKey").value = "accessKey"
wrapper.setState({
accessKey: "accessKey",
secretKey: ""
})
wrapper.find("form").simulate("submit")
expect(showAlertMock).toHaveBeenCalledWith("danger", "Secret Key cannot be empty")
})
@ -85,11 +90,12 @@ describe("Login", () => {
alert={{ show: false, type: "danger"}}
showAlert={showAlertMock}
clearAlert={clearAlertMock}
/>,
{ attachTo: document.body }
/>
)
document.getElementById("accessKey").value = "accessKey"
document.getElementById("secretKey").value = "secretKey"
wrapper.setState({
accessKey: "accessKey",
secretKey: "secretKey"
})
wrapper.find("form").simulate("submit")
expect(web.Login).toHaveBeenCalledWith({
"username": "accessKey",

File diff suppressed because one or more lines are too long