LoginForm.js
import React, { useState } from "react";
import useGlobal from "../../store";
function LoginForm() {
const [loginUser, setUser] = useState();
const [globalState, globalActions] = useGlobal();
const { status, errorMessage } = globalState;
const onChange = e => {
e.persist();
setUser({ ...loginUser, [e.target.name]: e.target.value });
};
const onLoginSubmit = e => {
e.preventDefault();
globalActions.login.userLogin(loginUser);
};
return (
<div className="container">
<form onSubmit={onLoginSubmit}>
<div className="form-group">
<label htmlFor="usernameInput">Username</label>
<input
name="username"
type="text"
className="form-control"
placeholder="Enter username"
onChange={onChange}
/>
</div>
<div className="form-group">
<label htmlFor="inputPassword">Password</label>
<input
name="password"
type="password"
className="form-control"
placeholder="Password"
onChange={onChange}
/>
</div>
<button type="submit" className="btn btn-primary">
Submit
</button>
</form>
{status === "LOADING" ? <div>Loading...</div> : null}
{status === "SUCCESS" ? (
<div>Successfull login</div>
) : (
<div>{errorMessage}</div>
)}
</div>
);
}
export default LoginForm;
LoginForm.test.js
import React from "react";
import { render, cleanup } from "@testing-library/react";
import "@testing-library/jest-dom/extend-expect";
import useGlobal from "../../../store";
import LoginForm from "../LoginForm";
afterEach(cleanup);
it("render component", () => {
const { container, getByText } = render(<Page />);
expect(getByText("Username")).toBeInTheDocument();
});
error:
FAIL src/components/login/__tests__/Form.test.js
● Test suite failed to run
Jest encountered an unexpected token
This usually means that you are trying to import a file which Jest cannot parse, e.g. it's not plain JavaScript.
By default, if Jest sees a Babel config, it will use that to transform your files, ignoring "node_modules".
Here's what you can do:
• To have some of your "node_modules" files transformed, you can specify a custom "transformIgnorePatterns" in your config.
• If you need a custom transformation specify a "transform" option in your config.
• If you simply want to mock your non-JS modules (e.g. binary assets) you can stub them out with the "moduleNameMapper" config option.
You'll find more details and examples of these config options in the docs:
https://jestjs.io/docs/en/configuration.html
Details:
/Users/kuronaru/Projects/mansoler_workspace/erams-ts/node_modules/use-global-hook/index.js:63
export default useStore;
^^^^^^
SyntaxError: Unexpected token export
1 | import React from "react";
> 2 | import useGlobalHook from "use-global-hook";
| ^
3 |
4 | import * as actions from "../actions";
5 |
at ScriptTransformer._transformAndBuildScript (node_modules/@jest/transform/build/ScriptTransformer.js:537:17)
at ScriptTransformer.transform (node_modules/@jest/transform/build/ScriptTransformer.js:579:25)
at Object.<anonymous> (src/store/index.js:2:1)
@nmccready i did eject my project and this is what package.json looks like
i looked for the solution in stackoverflow but no luck.