diff --git a/components/Form/index.js b/components/Form/index.js index 41abe7fc..8b2406b8 100644 --- a/components/Form/index.js +++ b/components/Form/index.js @@ -31,6 +31,7 @@ export default class Form extends Component { key={index} ref={(c) => { this[input.get('name')] = c; }} className='loginInput' + data-testid={input.get('data-testid')} hidden={input.get('hidden')} disabled={input.get('disabled')} type={input.get('type')} diff --git a/components/FormInput/index.js b/components/FormInput/index.js index 837af2c9..f5d2b914 100644 --- a/components/FormInput/index.js +++ b/components/FormInput/index.js @@ -15,7 +15,7 @@ export default class FormInput extends Component { } render() { - const { type, label, name, value, placeholder, disabled, className, error, tabIndex, hidden, acceptType } = this.props; + const { type, label, name, 'data-testid': dataTestId, value, placeholder, disabled, className, error, tabIndex, hidden, acceptType } = this.props; const { onBlur, onChange } = this.props; const inputClassName = className + (disabled ? ' disabled' : '') + (value ? ' hasValue' : '') + (error ? ' hasError' : '') + (hidden ? ' hidden' : ''); @@ -25,6 +25,7 @@ export default class FormInput extends Component { disabled={disabled} name={name} type={type} + data-testid={dataTestId} data-hidden={!!hidden} placeholder={placeholder} accept={acceptType} @@ -49,6 +50,7 @@ FormInput.propTypes = { value: PropTypes.string, name: PropTypes.string, label: PropTypes.string, + id: PropTypes.string, disabled: PropTypes.bool, hidden: PropTypes.bool, placeholder: PropTypes.string, diff --git a/components/StandardButton/index.js b/components/StandardButton/index.js index a800bc6b..740f6d29 100644 --- a/components/StandardButton/index.js +++ b/components/StandardButton/index.js @@ -13,6 +13,7 @@ const getClassInternal = (className) => { const Button = ({ type, label, + 'data-testid': dataTestId, icon, onClick, className, @@ -36,7 +37,7 @@ const Button = ({ disabledClass = Array.isArray(disabledClassName) ? disabledClassName.map(getClassInternal) : getClassInternal(disabledClassName); } const button = ( - diff --git a/containers/LoginForm/config.js b/containers/LoginForm/config.js index d257a5f4..84020a7d 100644 --- a/containers/LoginForm/config.js +++ b/containers/LoginForm/config.js @@ -3,6 +3,7 @@ export const inputs = { name: 'username', type: 'text', label: 'Username', + 'data-testid': 'ut-login-username', value: '', error: '', validateOrder: ['isRequired', 'minLength', 'maxLength'], @@ -16,6 +17,7 @@ export const inputs = { name: 'password', type: 'password', label: 'Password', + 'data-testid': 'ut-login-password', value: '', error: '', validateOrder: ['isRequired'], diff --git a/containers/LoginForm/index.js b/containers/LoginForm/index.js index 0ae9f780..0cfdd1e3 100644 --- a/containers/LoginForm/index.js +++ b/containers/LoginForm/index.js @@ -121,7 +121,7 @@ class LoginForm extends Component { className='loginForm' inputs={inputs} title={{className: 'loginTitle' + (error ? ' error' : ''), text: title}} - buttons={[{label: buttonLabel, className: 'standardBtn loginBtn', type: 'submit'}]} + buttons={[{'data-testid': 'ut-login-submit-button', label: buttonLabel, className: 'standardBtn loginBtn', type: 'submit'}]} onChange={this.onChange} onSubmit={this.validateForm} error={error}