stub frontend requests to auth endpoints
This commit is contained in:
parent
02d408adba
commit
fea8c9035f
14 changed files with 464 additions and 178 deletions
|
@ -7,18 +7,23 @@
|
||||||
.*/server/test/.*
|
.*/server/test/.*
|
||||||
.*/server/knexfile\.js
|
.*/server/knexfile\.js
|
||||||
.*/public/.*
|
.*/public/.*
|
||||||
|
.*\.scss
|
||||||
|
.*\.css
|
||||||
|
.+\.s?css
|
||||||
|
|
||||||
[include]
|
[include]
|
||||||
|
.*/src/components/
|
||||||
|
.*/src/pages/.*
|
||||||
|
.*/src/reducers/.*
|
||||||
|
.*/src/utils/.*
|
||||||
|
.*/App.js
|
||||||
|
|
||||||
[libs]
|
[libs]
|
||||||
|
|
||||||
[lints]
|
[lints]
|
||||||
|
|
||||||
[options]
|
[options]
|
||||||
; all=true
|
|
||||||
|
|
||||||
[strict]
|
[strict]
|
||||||
|
|
||||||
[untyped]
|
[untyped]
|
||||||
.*\.scss
|
|
||||||
.*\.css
|
|
433
packages/server/play-node-go/package-lock.json
generated
433
packages/server/play-node-go/package-lock.json
generated
File diff suppressed because it is too large
Load diff
|
@ -5,6 +5,7 @@
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@mars/heroku-js-runtime-env": "^3.0.2",
|
"@mars/heroku-js-runtime-env": "^3.0.2",
|
||||||
"@testing-library/user-event": "^7.1.2",
|
"@testing-library/user-event": "^7.1.2",
|
||||||
|
"axios": "^0.19.1",
|
||||||
"flow-bin": "^0.114.0",
|
"flow-bin": "^0.114.0",
|
||||||
"node-sass": "^4.13.0",
|
"node-sass": "^4.13.0",
|
||||||
"react": "^16.12.0",
|
"react": "^16.12.0",
|
||||||
|
@ -18,7 +19,7 @@
|
||||||
"build": "react-scripts build",
|
"build": "react-scripts build",
|
||||||
"test": "react-scripts test",
|
"test": "react-scripts test",
|
||||||
"eject": "react-scripts eject",
|
"eject": "react-scripts eject",
|
||||||
"flow": "./node_modules/.bin/flow flow",
|
"flow": "./node_modules/.bin/flow",
|
||||||
"predeploy": "REACT_APP_ENVIRONMENT=production npm run build",
|
"predeploy": "REACT_APP_ENVIRONMENT=production npm run build",
|
||||||
"postinstall": "react-scripts build"
|
"postinstall": "react-scripts build"
|
||||||
},
|
},
|
||||||
|
|
|
@ -1,8 +1,8 @@
|
||||||
import React, {useState} from 'react';
|
import React, {useState, useEffect, useReducer} from 'react';
|
||||||
import './App.scss';
|
import './App.scss';
|
||||||
import config from './config';
|
import config from './config';
|
||||||
|
|
||||||
import { Switch, Route } from 'react-router-dom';
|
import { Switch, Route, BrowserRouter as Router } from 'react-router-dom';
|
||||||
|
|
||||||
import socketIOClient from 'socket.io-client';
|
import socketIOClient from 'socket.io-client';
|
||||||
|
|
||||||
|
@ -17,39 +17,56 @@ export const socket = socketIOClient(config.apiAddress);
|
||||||
function App() {
|
function App() {
|
||||||
const [fetchData, setFetchData] = useState();
|
const [fetchData, setFetchData] = useState();
|
||||||
const [socketData, setSocketData] = useState();
|
const [socketData, setSocketData] = useState();
|
||||||
fetch(config.apiAddress).then(res => res.text()).then(data => setFetchData(data));
|
const [error, setError] = useState([]);
|
||||||
socket.emit('connect');
|
|
||||||
socket.on('connected', data => setSocketData(data.message));
|
useEffect(() => {
|
||||||
|
fetch(config.apiAddress)
|
||||||
|
.then(res => res.text())
|
||||||
|
.catch(err => setError([...error, err]))
|
||||||
|
.then(data => setFetchData(data))
|
||||||
|
})
|
||||||
|
useEffect(() => {
|
||||||
|
|
||||||
|
socket.emit('connect');
|
||||||
|
socket.on('connect', data => setSocketData('socket connected'));
|
||||||
|
socket.on('connect_error', err => setError([...error, err]));
|
||||||
|
socket.on('error', err => setError([...error, err]))
|
||||||
|
})
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="App">
|
<Router>
|
||||||
<h1>React Boilerplate</h1>
|
|
||||||
{fetchData ? <p>{fetchData}</p> : <></>}
|
|
||||||
{socketData ? <p>{socketData}</p> : <></>}
|
|
||||||
<Switch>
|
|
||||||
|
|
||||||
<Route path="/account">
|
<div data-testid="App" className="App">
|
||||||
<Account />
|
<h1>React Boilerplate</h1>
|
||||||
</Route>
|
{fetchData ? <p>{fetchData}</p> : <></>}
|
||||||
|
{socketData ? <p>{socketData}</p> : <></>}
|
||||||
|
{error ? error.map(err => <p>{err}</p>): <></>}
|
||||||
|
<Switch>
|
||||||
|
|
||||||
<Route path="/rooms">
|
<Route path="/account">
|
||||||
<Room />
|
<Account />
|
||||||
</Route>
|
</Route>
|
||||||
|
|
||||||
<Route path="/games">
|
<Route path="/rooms">
|
||||||
<Game />
|
<Room />
|
||||||
</Route>
|
</Route>
|
||||||
|
|
||||||
<Route path="/news">
|
<Route path="/games">
|
||||||
<News />
|
<Game />
|
||||||
</Route>
|
</Route>
|
||||||
|
|
||||||
<Route path="/">
|
<Route path="/news">
|
||||||
{/* Add ternary for login */}
|
<News />
|
||||||
<Home />
|
</Route>
|
||||||
</Route>
|
|
||||||
|
|
||||||
</Switch>
|
<Route path="/">
|
||||||
</div>
|
{/* Add ternary for login */}
|
||||||
|
<Home />
|
||||||
|
</Route>
|
||||||
|
|
||||||
|
</Switch>
|
||||||
|
</div>
|
||||||
|
</Router>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -2,8 +2,8 @@ import React from 'react';
|
||||||
import { render } from '@testing-library/react';
|
import { render } from '@testing-library/react';
|
||||||
import App from './App';
|
import App from './App';
|
||||||
|
|
||||||
test('renders learn react link', () => {
|
test('renders app without crashing', () => {
|
||||||
const { getByText } = render(<App />);
|
const { getByTestId } = render(<App />);
|
||||||
const linkElement = getByText(/learn react/i);
|
const AppDiv = getByTestId('App');
|
||||||
expect(linkElement).toBeInTheDocument();
|
expect(AppDiv).toBeInTheDocument();
|
||||||
});
|
});
|
||||||
|
|
15
packages/server/play-node-go/src/components/Login/Login.js
Normal file
15
packages/server/play-node-go/src/components/Login/Login.js
Normal file
|
@ -0,0 +1,15 @@
|
||||||
|
import React, { useState } from 'react';
|
||||||
|
import './Login.scss';
|
||||||
|
|
||||||
|
const Login = () => {
|
||||||
|
const [username, setUsername] = useState('');
|
||||||
|
const [password, setPassword] = useState('');
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className="Login" data-testid="Login">
|
||||||
|
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default Login;
|
|
@ -0,0 +1,9 @@
|
||||||
|
import React from 'react';
|
||||||
|
import { render } from '@testing-library/react';
|
||||||
|
import Login from './Login';
|
||||||
|
|
||||||
|
test('renders app without crashing', () => {
|
||||||
|
const { getByTestId } = render(<Login />);
|
||||||
|
const LoginDiv = getByTestId('Login');
|
||||||
|
expect(LoginDiv).toBeInTheDocument();
|
||||||
|
});
|
16
packages/server/play-node-go/src/components/Signup/Signup.js
Normal file
16
packages/server/play-node-go/src/components/Signup/Signup.js
Normal file
|
@ -0,0 +1,16 @@
|
||||||
|
import React, { useState } from 'react';
|
||||||
|
import './Signup.scss';
|
||||||
|
|
||||||
|
const Signup = () => {
|
||||||
|
const [username, setUsername] = useState('');
|
||||||
|
const [password, setPassword] = useState('');
|
||||||
|
const [passwordConfirm, setPasswordConfirm] = useState('');
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className="Signup" data-testid="Signup">
|
||||||
|
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default Signup;
|
|
@ -0,0 +1,9 @@
|
||||||
|
import React from 'react';
|
||||||
|
import { render } from '@testing-library/react';
|
||||||
|
import Signup from './Signup';
|
||||||
|
|
||||||
|
test('renders app without crashing', () => {
|
||||||
|
const { getByTestId } = render(<Signup />);
|
||||||
|
const SignupDiv = getByTestId('Signup');
|
||||||
|
expect(SignupDiv).toBeInTheDocument();
|
||||||
|
});
|
|
@ -3,12 +3,9 @@ import ReactDOM from 'react-dom';
|
||||||
import './index.scss';
|
import './index.scss';
|
||||||
import App from './App';
|
import App from './App';
|
||||||
import * as serviceWorker from './serviceWorker';
|
import * as serviceWorker from './serviceWorker';
|
||||||
import { BrowserRouter as Router } from 'react-router-dom';
|
|
||||||
|
|
||||||
ReactDOM.render(
|
ReactDOM.render(
|
||||||
<Router>
|
<App />
|
||||||
<App />
|
|
||||||
</Router>
|
|
||||||
, document.getElementById('root')
|
, document.getElementById('root')
|
||||||
);
|
);
|
||||||
|
|
||||||
|
|
27
packages/server/play-node-go/src/services/authServices.js
Normal file
27
packages/server/play-node-go/src/services/authServices.js
Normal file
|
@ -0,0 +1,27 @@
|
||||||
|
import config from '../config';
|
||||||
|
import Axios from 'axios';
|
||||||
|
|
||||||
|
const authEndpoint = `${config.apiAddress}/auth`;
|
||||||
|
const signupEndpoint = `${authEndpoint}/signup`
|
||||||
|
const loginEndpoint = `${authEndpoint}/login`
|
||||||
|
|
||||||
|
const loginService = () => {
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
const signupService = async (formData) => {
|
||||||
|
const response = await Axios.post(signupEndpoint, {
|
||||||
|
...formData
|
||||||
|
}).then(res => {
|
||||||
|
return res;
|
||||||
|
}).catch(err => {
|
||||||
|
return err;
|
||||||
|
});
|
||||||
|
console.log(response)
|
||||||
|
return response;
|
||||||
|
}
|
||||||
|
|
||||||
|
module.exports = {
|
||||||
|
loginService,
|
||||||
|
signupService
|
||||||
|
}
|
|
@ -0,0 +1,25 @@
|
||||||
|
import authServices from './authServices';
|
||||||
|
|
||||||
|
const signupService = authServices.signupService;
|
||||||
|
const loginService = authServices.loginService;
|
||||||
|
|
||||||
|
const newUserFormData = {
|
||||||
|
username:'newUser',
|
||||||
|
password:'password',
|
||||||
|
passwordConfirm:'password',
|
||||||
|
email:'user@example.com'
|
||||||
|
}
|
||||||
|
|
||||||
|
describe('signupService', () => {
|
||||||
|
it('signup returns 200', async () => {
|
||||||
|
const response = await signupService(newUserFormData);
|
||||||
|
console.log(response)
|
||||||
|
expect(response.status).equal('200');
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
describe('loginService', () => {
|
||||||
|
it('', () => {
|
||||||
|
|
||||||
|
});
|
||||||
|
});
|
Loading…
Reference in a new issue