Fix remaining unit tests
This commit is contained in:
parent
ba01927707
commit
1a324af241
|
@ -1,6 +1,7 @@
|
||||||
import React from 'react'
|
import React from 'react'
|
||||||
import { fireEvent, render, screen, waitFor } from '@testing-library/react'
|
import { fireEvent, render, screen, waitFor } from '@testing-library/react'
|
||||||
import PeoplePage, {
|
import {
|
||||||
|
PeoplePage,
|
||||||
FaceDetails,
|
FaceDetails,
|
||||||
FaceGroup,
|
FaceGroup,
|
||||||
MY_FACES_QUERY,
|
MY_FACES_QUERY,
|
||||||
|
@ -69,16 +70,10 @@ describe('PeoplePage component', () => {
|
||||||
]
|
]
|
||||||
|
|
||||||
test('people page', async () => {
|
test('people page', async () => {
|
||||||
const matchMock = {
|
|
||||||
params: {
|
|
||||||
person: undefined,
|
|
||||||
},
|
|
||||||
}
|
|
||||||
|
|
||||||
render(
|
render(
|
||||||
<MemoryRouter initialEntries={['/people']}>
|
<MemoryRouter initialEntries={['/people']}>
|
||||||
<MockedProvider mocks={graphqlMocks} addTypename={false}>
|
<MockedProvider mocks={graphqlMocks} addTypename={false}>
|
||||||
<PeoplePage match={matchMock} />
|
<PeoplePage />
|
||||||
</MockedProvider>
|
</MockedProvider>
|
||||||
</MemoryRouter>
|
</MemoryRouter>
|
||||||
)
|
)
|
||||||
|
|
|
@ -2,6 +2,7 @@ import React from 'react'
|
||||||
import { render, screen, waitFor } from '@testing-library/react'
|
import { render, screen, waitFor } from '@testing-library/react'
|
||||||
import { MockedProvider } from '@apollo/client/testing'
|
import { MockedProvider } from '@apollo/client/testing'
|
||||||
import SingleFaceGroup, { SINGLE_FACE_GROUP } from './SingleFaceGroup'
|
import SingleFaceGroup, { SINGLE_FACE_GROUP } from './SingleFaceGroup'
|
||||||
|
import { MemoryRouter } from 'react-router-dom'
|
||||||
|
|
||||||
jest.mock('../../../hooks/useScrollPagination')
|
jest.mock('../../../hooks/useScrollPagination')
|
||||||
|
|
||||||
|
@ -83,9 +84,11 @@ test('single face group', async () => {
|
||||||
]
|
]
|
||||||
|
|
||||||
render(
|
render(
|
||||||
|
<MemoryRouter initialEntries={['/person/123']}>
|
||||||
<MockedProvider mocks={graphqlMocks}>
|
<MockedProvider mocks={graphqlMocks}>
|
||||||
<SingleFaceGroup faceGroupID="123" />
|
<SingleFaceGroup faceGroupID="123" />
|
||||||
</MockedProvider>
|
</MockedProvider>
|
||||||
|
</MemoryRouter>
|
||||||
)
|
)
|
||||||
|
|
||||||
await waitFor(() => {
|
await waitFor(() => {
|
||||||
|
|
|
@ -1,9 +1,11 @@
|
||||||
import React from 'react'
|
import React from 'react'
|
||||||
import AuthorizedRoute from './AuthorizedRoute'
|
import AuthorizedRoute, { useIsAdmin } from './AuthorizedRoute'
|
||||||
import { render, screen } from '@testing-library/react'
|
import { render, screen, waitFor } from '@testing-library/react'
|
||||||
import { MemoryRouter, Route } from 'react-router-dom'
|
import { MemoryRouter, Route, Routes } from 'react-router-dom'
|
||||||
|
|
||||||
import * as authentication from '../../helpers/authentication'
|
import * as authentication from '../../helpers/authentication'
|
||||||
|
import { MockedProvider } from '@apollo/client/testing'
|
||||||
|
import { ADMIN_QUERY } from '../layout/Layout'
|
||||||
|
|
||||||
jest.mock('../../helpers/authentication.ts')
|
jest.mock('../../helpers/authentication.ts')
|
||||||
|
|
||||||
|
@ -18,26 +20,117 @@ describe('AuthorizedRoute component', () => {
|
||||||
authToken.mockImplementation(() => null)
|
authToken.mockImplementation(() => null)
|
||||||
|
|
||||||
render(
|
render(
|
||||||
<MemoryRouter initialEntries={['/']}>
|
<MemoryRouter initialEntries={['/authorized']}>
|
||||||
<Route path="/login">login redirect</Route>
|
<Routes>
|
||||||
<AuthorizedRoute path="/" component={AuthorizedComponent} />
|
<Route index element={<div>redirect</div>} />
|
||||||
|
<Route
|
||||||
|
path="/authorized"
|
||||||
|
element={
|
||||||
|
<AuthorizedRoute>
|
||||||
|
<AuthorizedComponent />
|
||||||
|
</AuthorizedRoute>
|
||||||
|
}
|
||||||
|
/>
|
||||||
|
</Routes>
|
||||||
</MemoryRouter>
|
</MemoryRouter>
|
||||||
)
|
)
|
||||||
|
|
||||||
expect(screen.getByText('login redirect')).toBeInTheDocument()
|
expect(screen.getByText('redirect')).toBeInTheDocument()
|
||||||
|
expect(screen.queryByText('authorized content')).toBeNull()
|
||||||
})
|
})
|
||||||
|
|
||||||
test('logged in', async () => {
|
test('logged in', async () => {
|
||||||
authToken.mockImplementation(() => 'token-here')
|
authToken.mockImplementation(() => 'token-here')
|
||||||
|
|
||||||
render(
|
render(
|
||||||
<MemoryRouter initialEntries={['/']}>
|
<MemoryRouter initialEntries={['/authorized']}>
|
||||||
<Route path="/login">login redirect</Route>
|
<Routes>
|
||||||
<AuthorizedRoute path="/" component={AuthorizedComponent} />
|
<Route index element={<div>redirect</div>} />
|
||||||
|
<Route
|
||||||
|
path="/authorized"
|
||||||
|
element={
|
||||||
|
<AuthorizedRoute>
|
||||||
|
<AuthorizedComponent />
|
||||||
|
</AuthorizedRoute>
|
||||||
|
}
|
||||||
|
/>
|
||||||
|
</Routes>
|
||||||
</MemoryRouter>
|
</MemoryRouter>
|
||||||
)
|
)
|
||||||
|
|
||||||
expect(screen.getByText('authorized content')).toBeInTheDocument()
|
expect(screen.getByText('authorized content')).toBeInTheDocument()
|
||||||
expect(screen.queryByText('login redirect')).toBeNull()
|
expect(screen.queryByText('redirect')).toBeNull()
|
||||||
|
})
|
||||||
|
})
|
||||||
|
|
||||||
|
describe('useIsAdmin hook', () => {
|
||||||
|
const graphqlMock = (admin: boolean) => ({
|
||||||
|
request: {
|
||||||
|
query: ADMIN_QUERY,
|
||||||
|
},
|
||||||
|
result: {
|
||||||
|
data: {
|
||||||
|
myUser: {
|
||||||
|
admin,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
})
|
||||||
|
|
||||||
|
test('not logged in', async () => {
|
||||||
|
authToken.mockImplementation(() => null)
|
||||||
|
|
||||||
|
const TestComponent = () => {
|
||||||
|
const isAdmin = useIsAdmin()
|
||||||
|
return isAdmin ? <div>is admin</div> : <div>not admin</div>
|
||||||
|
}
|
||||||
|
|
||||||
|
render(
|
||||||
|
<MockedProvider mocks={[graphqlMock(true)]}>
|
||||||
|
<TestComponent />
|
||||||
|
</MockedProvider>
|
||||||
|
)
|
||||||
|
|
||||||
|
await waitFor(() => {
|
||||||
|
expect(screen.getByText('not admin')).toBeInTheDocument()
|
||||||
|
})
|
||||||
|
})
|
||||||
|
|
||||||
|
test('not admin', async () => {
|
||||||
|
authToken.mockImplementation(() => 'token-here')
|
||||||
|
|
||||||
|
const TestComponent = () => {
|
||||||
|
const isAdmin = useIsAdmin()
|
||||||
|
return isAdmin ? <div>is admin</div> : <div>not admin</div>
|
||||||
|
}
|
||||||
|
|
||||||
|
render(
|
||||||
|
<MockedProvider mocks={[graphqlMock(false)]}>
|
||||||
|
<TestComponent />
|
||||||
|
</MockedProvider>
|
||||||
|
)
|
||||||
|
|
||||||
|
await waitFor(() => {
|
||||||
|
expect(screen.getByText('not admin')).toBeInTheDocument()
|
||||||
|
})
|
||||||
|
})
|
||||||
|
|
||||||
|
test('is admin', async () => {
|
||||||
|
authToken.mockImplementation(() => 'token-here')
|
||||||
|
|
||||||
|
const TestComponent = () => {
|
||||||
|
const isAdmin = useIsAdmin()
|
||||||
|
return isAdmin ? <div>is admin</div> : <div>not admin</div>
|
||||||
|
}
|
||||||
|
|
||||||
|
render(
|
||||||
|
<MockedProvider mocks={[graphqlMock(true)]}>
|
||||||
|
<TestComponent />
|
||||||
|
</MockedProvider>
|
||||||
|
)
|
||||||
|
|
||||||
|
await waitFor(() => {
|
||||||
|
expect(screen.getByText('is admin')).toBeInTheDocument()
|
||||||
|
})
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
import React, { useEffect } from 'react'
|
|
||||||
import { RouteProps, Navigate } from 'react-router-dom'
|
|
||||||
import { useLazyQuery } from '@apollo/client'
|
import { useLazyQuery } from '@apollo/client'
|
||||||
|
import React, { useEffect } from 'react'
|
||||||
|
import { Navigate } from 'react-router-dom'
|
||||||
import { authToken } from '../../helpers/authentication'
|
import { authToken } from '../../helpers/authentication'
|
||||||
import { ADMIN_QUERY } from '../layout/Layout'
|
import { ADMIN_QUERY } from '../layout/Layout'
|
||||||
|
|
||||||
|
@ -26,23 +26,17 @@ export const Authorized = ({ children }: { children: JSX.Element }) => {
|
||||||
return token ? children : null
|
return token ? children : null
|
||||||
}
|
}
|
||||||
|
|
||||||
interface AuthorizedRouteProps extends Omit<RouteProps, 'component'> {
|
interface AuthorizedRouteProps {
|
||||||
children: React.ReactNode
|
children: React.ReactNode
|
||||||
admin?: boolean
|
|
||||||
}
|
}
|
||||||
|
|
||||||
const AuthorizedRoute = ({ admin = false, children }: AuthorizedRouteProps) => {
|
const AuthorizedRoute = ({ children }: AuthorizedRouteProps) => {
|
||||||
const token = authToken()
|
const token = authToken()
|
||||||
const isAdmin = useIsAdmin()
|
|
||||||
|
|
||||||
if (!token) {
|
if (!token) {
|
||||||
return <Navigate to="/" />
|
return <Navigate to="/" />
|
||||||
}
|
}
|
||||||
|
|
||||||
if (admin && !isAdmin) {
|
|
||||||
return <Navigate to="/" />
|
|
||||||
}
|
|
||||||
|
|
||||||
return <>{children}</>
|
return <>{children}</>
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue