SHARE
TWEET

Untitled

a guest Jun 18th, 2019 59 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. import logo from 'assets/img/logo/logo_200.png';
  2. import LoadingButton from 'components/LoadingButton';
  3. import ReduxFormInput from 'components/ReduxFormInput';
  4. import { password } from 'lib/normalize';
  5. import React from 'react';
  6. import { Form } from 'reactstrap';
  7. import { Field, reduxForm } from 'redux-form';
  8. import validate from './validate';
  9.  
  10. const SignInForm = (props: any) => {
  11.   const { handleSubmit, isLoading } = props;
  12.   return (
  13.     <Form onSubmit={handleSubmit}>
  14.       <div className="text-center pb-4">
  15.         <img src={logo} className="rounded" style={{ width: 60, height: 60 }} alt="logo" />
  16.       </div>
  17.       <Field
  18.         name="email"
  19.         component={ReduxFormInput}
  20.         placeHolder="your@email.com"
  21.         label="Email"
  22.         type="email"
  23.       />
  24.       <Field
  25.         name="password"
  26.         component={ReduxFormInput}
  27.         placeHolder="your password"
  28.         label="Password"
  29.         type="password"
  30.         normalize={password}
  31.       />
  32.       <hr />
  33.       <LoadingButton
  34.         text="Login"
  35.         loadingText="Logging in"
  36.         isLoading={isLoading}
  37.         size="lg"
  38.         block={true}
  39.       />
  40.     </Form>
  41.   );
  42. };
  43.  
  44. export default reduxForm({
  45.   form: 'signIn',
  46.   validate,
  47. })(SignInForm);
  48.      
  49. import React from 'react';
  50. import { FormGroup, Input, Label } from 'reactstrap';
  51. import 'styles/splash-scripts.css';
  52.  
  53. const ReduxFormInput: React.FC = (field: any) => (
  54.   <FormGroup>
  55.     <Label>{field.label}</Label>
  56.     <Input {...field.input} type={field.type} placeholder={field.placeHolder} />
  57.     {field.meta.touched && <p className="text-danger">{field.meta.error}</p>}
  58.   </FormGroup>
  59. );
  60.  
  61. export default ReduxFormInput;
  62.      
  63. import React from 'react';
  64. import { shallow, mount, render } from 'enzyme';
  65. import { Provider } from "react-redux";
  66. import renderer from 'react-test-renderer';
  67. import configureMockStore from "redux-mock-store";
  68.  
  69. import SignInForm from '../../src/pages/Public/SignIn/SignInForm';
  70.  
  71. const mockStore = configureMockStore();
  72. const store = mockStore({});
  73.  
  74.  
  75. const defaultProps = {
  76.   submitting: false,
  77.   handleSubmit: () => {},
  78.   invalid: false,
  79.   initialValues: {},
  80. };
  81. describe("Login Component", () => {
  82.  
  83.   it('should match the snapshot', () => {
  84.       const wrapper = renderer.create(
  85.         <Provider store={store}>
  86.             <SignInForm />
  87.         </Provider>
  88.     ).toJSON();
  89.       expect(wrapper).toMatchSnapshot();
  90.   });
  91.  
  92.   it('it renders a <form /> element', () => {
  93.     const wrapper = shallow(
  94.       <Provider store={store}>
  95.          <SignInForm {...defaultProps} />
  96.       </Provider>
  97.     ).dive();
  98.   });
  99. });
  100.      
  101. const emailState = wrapper.state().email;
  102.     const passwordState = wrapper.state().password;
  103.     expect(emailState).toEqual('');
  104.     expect(passwordState).toEqual('');
  105.      
  106. error: reactwrapper::state() can only be called on class components
RAW Paste Data
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy. OK, I Understand
 
Top