From 92fc281e55c74f0aea3026ed754b5c0fa8b25c43 Mon Sep 17 00:00:00 2001
From: Albin Henriksson <albhe428@student.liu.se>
Date: Tue, 6 Apr 2021 08:42:30 +0200
Subject: [PATCH 1/3] Start testing adding competitions
---
client/package-lock.json | 22 ++++++++
client/package.json | 2 +
.../admin/components/AddCompetition.test.tsx | 51 +++++++++++++++++++
3 files changed, 75 insertions(+)
create mode 100644 client/src/pages/admin/components/AddCompetition.test.tsx
diff --git a/client/package-lock.json b/client/package-lock.json
index e38069bc..133d1ca2 100644
--- a/client/package-lock.json
+++ b/client/package-lock.json
@@ -2518,6 +2518,15 @@
"@types/react": "*"
}
},
+ "@types/redux-mock-store": {
+ "version": "1.0.2",
+ "resolved": "https://registry.npmjs.org/@types/redux-mock-store/-/redux-mock-store-1.0.2.tgz",
+ "integrity": "sha512-6LBtAQBN34i7SI5X+Qs4zpTEZO1tTDZ6sZ9fzFjYwTl3nLQXaBtwYdoV44CzNnyKu438xJ1lSIYyw0YMvunESw==",
+ "dev": true,
+ "requires": {
+ "redux": "^4.0.5"
+ }
+ },
"@types/resolve": {
"version": "0.0.8",
"resolved": "https://registry.npmjs.org/@types/resolve/-/resolve-0.0.8.tgz",
@@ -10723,6 +10732,11 @@
"integrity": "sha1-QVxEePK8wwEgwizhDtMib30+GOA=",
"dev": true
},
+ "lodash.isplainobject": {
+ "version": "4.0.6",
+ "resolved": "https://registry.npmjs.org/lodash.isplainobject/-/lodash.isplainobject-4.0.6.tgz",
+ "integrity": "sha1-fFJqUtibRcRcxpC4gWO+BJf1UMs="
+ },
"lodash.memoize": {
"version": "4.1.2",
"resolved": "https://registry.npmjs.org/lodash.memoize/-/lodash.memoize-4.1.2.tgz",
@@ -13903,6 +13917,14 @@
"resolved": "https://registry.npmjs.org/redux-devtools-extension/-/redux-devtools-extension-2.13.8.tgz",
"integrity": "sha512-8qlpooP2QqPtZHQZRhx3x3OP5skEV1py/zUdMY28WNAocbafxdG2tRD1MWE7sp8obGMNYuLWanhhQ7EQvT1FBg=="
},
+ "redux-mock-store": {
+ "version": "1.5.4",
+ "resolved": "https://registry.npmjs.org/redux-mock-store/-/redux-mock-store-1.5.4.tgz",
+ "integrity": "sha512-xmcA0O/tjCLXhh9Fuiq6pMrJCwFRaouA8436zcikdIpYWWCjU76CRk+i2bHx8EeiSiMGnB85/lZdU3wIJVXHTA==",
+ "requires": {
+ "lodash.isplainobject": "^4.0.6"
+ }
+ },
"redux-thunk": {
"version": "2.3.0",
"resolved": "https://registry.npmjs.org/redux-thunk/-/redux-thunk-2.3.0.tgz",
diff --git a/client/package.json b/client/package.json
index 39af2db1..6e4d3573 100644
--- a/client/package.json
+++ b/client/package.json
@@ -25,6 +25,7 @@
"react-scripts": "4.0.2",
"redux": "^4.0.5",
"redux-devtools-extension": "^2.13.8",
+ "redux-mock-store": "^1.5.4",
"redux-thunk": "^2.3.0",
"styled-components": "^5.2.1",
"typescript": "^4.1.3",
@@ -35,6 +36,7 @@
"@types/enzyme": "^3.10.8",
"@types/react-redux": "^7.1.16",
"@types/react-router-dom": "^5.1.7",
+ "@types/redux-mock-store": "^1.0.2",
"@types/styled-components": "^5.1.9",
"@typescript-eslint/eslint-plugin": "4.2.0",
"@typescript-eslint/parser": "4.2.0",
diff --git a/client/src/pages/admin/components/AddCompetition.test.tsx b/client/src/pages/admin/components/AddCompetition.test.tsx
new file mode 100644
index 00000000..4a32971d
--- /dev/null
+++ b/client/src/pages/admin/components/AddCompetition.test.tsx
@@ -0,0 +1,51 @@
+import { render, screen } from '@testing-library/react'
+import { mount } from 'enzyme'
+import React from 'react'
+import { Provider } from 'react-redux'
+import { BrowserRouter } from 'react-router-dom'
+import configureMockStore from 'redux-mock-store'
+import thunk from 'redux-thunk'
+import store from '../../../store'
+import AddCompetition from './AddCompetition'
+
+const middlewares = [thunk]
+const mockStore = configureMockStore(middlewares)
+
+fit('renders add competition', () => {
+ render(
+ <BrowserRouter>
+ <Provider store={store}>
+ <AddCompetition />
+ </Provider>
+ </BrowserRouter>
+ )
+})
+
+fit('it adds competitions', () => {
+ const cities = [
+ {
+ id: 1,
+ name: 'Link\u00f6ping',
+ },
+ {
+ id: 2,
+ name: 'Stockholm',
+ },
+ ]
+ const store = mockStore({ cities })
+ // console.log(store.getState())
+ const wrapper = mount(
+ <Provider store={store}>
+ <AddCompetition />
+ </Provider>
+ )
+ const newCompetitionButton = wrapper.find('button')
+ newCompetitionButton.simulate('click')
+ const nameField = screen.getByRole('textbox')
+ // const nameField = textFields.children().first()
+
+ // nameField.simulate('focus')
+ // nameField.simulate('change', { target: { value: 'Changed' } })
+ console.log(nameField)
+ expect(wrapper.text().includes('2')).toBe(true) //TODO: check that SlideSettings exists
+})
--
GitLab
From 575b2fc8b88b1484b453c6f24609eb7c9b541afc Mon Sep 17 00:00:00 2001
From: Albin Henriksson <albhe428@student.liu.se>
Date: Tue, 6 Apr 2021 11:05:35 +0200
Subject: [PATCH 2/3] Added render test
---
.../admin/components/AddCompetition.test.tsx | 39 +------------------
1 file changed, 2 insertions(+), 37 deletions(-)
diff --git a/client/src/pages/admin/components/AddCompetition.test.tsx b/client/src/pages/admin/components/AddCompetition.test.tsx
index 4a32971d..f9cdf24f 100644
--- a/client/src/pages/admin/components/AddCompetition.test.tsx
+++ b/client/src/pages/admin/components/AddCompetition.test.tsx
@@ -1,17 +1,11 @@
-import { render, screen } from '@testing-library/react'
-import { mount } from 'enzyme'
+import { render } from '@testing-library/react'
import React from 'react'
import { Provider } from 'react-redux'
import { BrowserRouter } from 'react-router-dom'
-import configureMockStore from 'redux-mock-store'
-import thunk from 'redux-thunk'
import store from '../../../store'
import AddCompetition from './AddCompetition'
-const middlewares = [thunk]
-const mockStore = configureMockStore(middlewares)
-
-fit('renders add competition', () => {
+it('renders add competition', () => {
render(
<BrowserRouter>
<Provider store={store}>
@@ -20,32 +14,3 @@ fit('renders add competition', () => {
</BrowserRouter>
)
})
-
-fit('it adds competitions', () => {
- const cities = [
- {
- id: 1,
- name: 'Link\u00f6ping',
- },
- {
- id: 2,
- name: 'Stockholm',
- },
- ]
- const store = mockStore({ cities })
- // console.log(store.getState())
- const wrapper = mount(
- <Provider store={store}>
- <AddCompetition />
- </Provider>
- )
- const newCompetitionButton = wrapper.find('button')
- newCompetitionButton.simulate('click')
- const nameField = screen.getByRole('textbox')
- // const nameField = textFields.children().first()
-
- // nameField.simulate('focus')
- // nameField.simulate('change', { target: { value: 'Changed' } })
- console.log(nameField)
- expect(wrapper.text().includes('2')).toBe(true) //TODO: check that SlideSettings exists
-})
--
GitLab
From 3968d98d969cbb283b7adb9c0dd39ecd3ab6dc38 Mon Sep 17 00:00:00 2001
From: Albin Henriksson <albhe428@student.liu.se>
Date: Tue, 6 Apr 2021 14:15:53 +0200
Subject: [PATCH 3/3] Fix more bugs originating from changes to api
---
client/src/App.test.tsx | 15 +++++----
client/src/__mocks__/axios.js | 1 +
client/src/actions/user.ts | 9 ++----
client/src/interfaces/Competition.ts | 7 ++--
client/src/interfaces/Role.ts | 9 ++++++
.../pages/admin/components/AddCompetition.tsx | 5 +--
.../components/CompetitionManager.test.tsx | 32 +++++++++++--------
.../admin/components/CompetitionManager.tsx | 2 +-
client/src/reducers/userReducer.ts | 8 +++--
client/src/utils/checkAuthentication.ts | 7 +---
10 files changed, 53 insertions(+), 42 deletions(-)
create mode 100644 client/src/interfaces/Role.ts
diff --git a/client/src/App.test.tsx b/client/src/App.test.tsx
index 2eca756c..3750ecd1 100644
--- a/client/src/App.test.tsx
+++ b/client/src/App.test.tsx
@@ -1,13 +1,16 @@
import { render } from '@testing-library/react'
import React from 'react'
+import { act } from 'react-dom/test-utils'
import { Provider } from 'react-redux'
import App from './App'
import store from './store'
-test('renders app', () => {
- render(
- <Provider store={store}>
- <App />
- </Provider>
- )
+test('renders app', async () => {
+ await act(async () => {
+ render(
+ <Provider store={store}>
+ <App />
+ </Provider>
+ )
+ })
})
diff --git a/client/src/__mocks__/axios.js b/client/src/__mocks__/axios.js
index c3547a13..c2953961 100644
--- a/client/src/__mocks__/axios.js
+++ b/client/src/__mocks__/axios.js
@@ -1,3 +1,4 @@
export default {
get: jest.fn().mockImplementation(),
+ post: jest.fn().mockImplementation(),
}
diff --git a/client/src/actions/user.ts b/client/src/actions/user.ts
index 104722eb..b543a68a 100644
--- a/client/src/actions/user.ts
+++ b/client/src/actions/user.ts
@@ -30,15 +30,10 @@ export const getUserData = () => async (dispatch: AppDispatch) => {
await axios
.get('/users')
.then((res) => {
+ console.log(res.data)
dispatch({
type: Types.SET_USER,
- payload: {
- id: res.data.id,
- name: res.data.name,
- email: res.data.email,
- roleId: res.data.role_id,
- cityId: res.data.city_id,
- },
+ payload: res.data,
})
})
.catch((err) => {
diff --git a/client/src/interfaces/Competition.ts b/client/src/interfaces/Competition.ts
index 433ae5a3..7a9c7032 100644
--- a/client/src/interfaces/Competition.ts
+++ b/client/src/interfaces/Competition.ts
@@ -1,7 +1,8 @@
+import { City } from './City'
+
export interface Competition {
name: string
- city_id: number
- style_id: number
- year: number
id: number
+ city: City
+ year: number
}
diff --git a/client/src/interfaces/Role.ts b/client/src/interfaces/Role.ts
new file mode 100644
index 00000000..4165fe7b
--- /dev/null
+++ b/client/src/interfaces/Role.ts
@@ -0,0 +1,9 @@
+import { City } from './City'
+
+export interface Competition {
+ name: string
+ city: City
+ style_id: number
+ year: number
+ id: number
+}
diff --git a/client/src/pages/admin/components/AddCompetition.tsx b/client/src/pages/admin/components/AddCompetition.tsx
index bc06fdb2..d80195e5 100644
--- a/client/src/pages/admin/components/AddCompetition.tsx
+++ b/client/src/pages/admin/components/AddCompetition.tsx
@@ -37,8 +37,9 @@ const competitionSchema: Yup.SchemaOf<AddCompetitionFormModel> = Yup.object({
const AddCompetition: React.FC = (props: any) => {
const [anchorEl, setAnchorEl] = React.useState<HTMLButtonElement | null>(null)
- const [selectedCity, setSelectedCity] = React.useState<City | undefined>()
const cities = useAppSelector((state) => state.cities.cities)
+ const userCity = useAppSelector((state) => state.user.userInfo?.city)
+ const [selectedCity, setSelectedCity] = React.useState<City | undefined>(userCity)
const handleClick = (event: React.MouseEvent<HTMLButtonElement>) => {
setAnchorEl(event.currentTarget)
}
@@ -80,7 +81,7 @@ const AddCompetition: React.FC = (props: any) => {
}
const competitionInitialValues: AddCompetitionFormModel = {
- model: { name: '', city: noCitySelected, year: currentYear },
+ model: { name: '', city: userCity?.name ? userCity.name : noCitySelected, year: currentYear },
}
return (
<div>
diff --git a/client/src/pages/admin/components/CompetitionManager.test.tsx b/client/src/pages/admin/components/CompetitionManager.test.tsx
index 3fb03b69..f47d8045 100644
--- a/client/src/pages/admin/components/CompetitionManager.test.tsx
+++ b/client/src/pages/admin/components/CompetitionManager.test.tsx
@@ -8,37 +8,41 @@ import CompetitionManager from './CompetitionManager'
it('renders competition manager', () => {
const cityRes: any = {
- data: [
- {
- id: 1,
- name: 'Link\u00f6ping',
- },
- {
- id: 2,
- name: 'Stockholm',
- },
- ],
+ data: {
+ items: [
+ {
+ id: 1,
+ name: 'Link\u00f6ping',
+ },
+ {
+ id: 2,
+ name: 'Stockholm',
+ },
+ ],
+ count: 2,
+ total_count: 3,
+ },
}
const compRes: any = {
data: {
- competitions: [
+ items: [
{
id: 21,
name: 'ggff',
year: 2021,
style_id: 1,
- city_id: 1,
+ city: cityRes.data.items[0],
},
{
id: 22,
name: 'sssss',
year: 2021,
style_id: 1,
- city_id: 1,
+ city: cityRes.data.items[1],
},
],
count: 2,
- total: 3,
+ total_count: 3,
},
}
diff --git a/client/src/pages/admin/components/CompetitionManager.tsx b/client/src/pages/admin/components/CompetitionManager.tsx
index 2acce64b..ff73a994 100644
--- a/client/src/pages/admin/components/CompetitionManager.tsx
+++ b/client/src/pages/admin/components/CompetitionManager.tsx
@@ -152,7 +152,7 @@ const CompetitionManager: React.FC = (props: any) => {
{row.name}
</Button>
</TableCell>
- <TableCell align="right">{cities.find((city) => city.id === row.city_id)?.name || ''}</TableCell>
+ <TableCell align="right">{cities.find((city) => city.id === row.city.id)?.name || ''}</TableCell>
<TableCell align="right">{row.year}</TableCell>
<TableCell align="right">
<Button onClick={(event) => handleClick(event, row.id)}>
diff --git a/client/src/reducers/userReducer.ts b/client/src/reducers/userReducer.ts
index 8b651426..9a26b1c9 100644
--- a/client/src/reducers/userReducer.ts
+++ b/client/src/reducers/userReducer.ts
@@ -1,12 +1,14 @@
-//in userReducer.ts
import { AnyAction } from 'redux'
import Types from '../actions/types'
+import { City } from '../interfaces/City'
+import { Competition } from './../interfaces/Competition'
interface UserInfo {
name: string
email: string
- roleId: number
- cityId: number
+ role: Competition
+ city: City
+ id: number
}
interface UserState {
diff --git a/client/src/utils/checkAuthentication.ts b/client/src/utils/checkAuthentication.ts
index 7f41ef47..83b73554 100644
--- a/client/src/utils/checkAuthentication.ts
+++ b/client/src/utils/checkAuthentication.ts
@@ -22,12 +22,7 @@ export const CheckAuthentication = async () => {
store.dispatch({ type: Types.SET_AUTHENTICATED })
store.dispatch({
type: Types.SET_USER,
- payload: {
- name: res.data.name,
- email: res.data.email,
- roleId: res.data.role_id,
- cityId: res.data.city_id,
- },
+ payload: res.data,
})
})
.catch((error) => {
--
GitLab