diff --git a/frontend/src/network/tests/mockData/projects.js b/frontend/src/network/tests/mockData/projects.js index 47a7ca86af..2f21c3e08f 100644 --- a/frontend/src/network/tests/mockData/projects.js +++ b/frontend/src/network/tests/mockData/projects.js @@ -323,6 +323,7 @@ export const taskDetail = (taskId) => ({ export const projectComments = { chat: [ { + id: 1, message: "

@happy_me we do want 'significant' roads that lead to houses. Rule of thumb I use for picking classification is the usage over condition/what it looks like. If it's the main 'path' to one or maybe several homes, I would pick service; even if a vehicle can't drive it, that can be reflected with additional tags, but the road still functions as access to the home(s).

", pictureUrl: @@ -331,6 +332,7 @@ export const projectComments = { username: 'helnershingthapa', }, { + id: 2, message: '

hello world

', pictureUrl: 'https://www.openstreetmap.org/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaHBBNXQ2Q3c9PSIsImV4cCI6bnVsbCwicHVyIjoiYmxvYl9pZCJ9fQ==--fe41f1b2a5d6cf492a7133f15c81f105dec06ff7/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaDdCem9MWm05eWJXRjBPZ2h3Ym1jNkZISmxjMmw2WlY5MGIxOXNhVzFwZEZzSGFXbHBhUT09IiwiZXhwIjpudWxsLCJwdXIiOiJ2YXJpYXRpb24ifX0=--058ac785867b32287d598a314311e2253bd879a3/unnamed.webp', @@ -338,6 +340,7 @@ export const projectComments = { username: 'helnershingthapa', }, { + id: 3, message: '

asdadadasdasdasd

', pictureUrl: 'https://www.openstreetmap.org/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaHBBeFJheFE9PSIsImV4cCI6bnVsbCwicHVyIjoiYmxvYl9pZCJ9fQ==--a765e2377a288bccae85da6604300251d9de6d39/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaDdCem9MWm05eWJXRjBTU0lJYW5CbkJqb0dSVlE2RkhKbGMybDZaVjkwYjE5c2FXMXBkRnNIYVdscGFRPT0iLCJleHAiOm51bGwsInB1ciI6InZhcmlhdGlvbiJ9fQ==--1d22b8d446683a272d1a9ff04340453ca7c374b4/bitmoji.jpg', @@ -345,6 +348,7 @@ export const projectComments = { username: 'Hel Nershing Thapa', }, { + id: 4, message: '

test of \ncode block\nhmmm\npreview showed it as a block\nand monospace font\nbut not indented

', pictureUrl: @@ -353,6 +357,7 @@ export const projectComments = { username: 'wireguy', }, { + id: 5, message: '

this is a code\nblock\nshould it\nbe indented\nby 4 space?\nminor...

', pictureUrl: diff --git a/frontend/src/views/project.js b/frontend/src/views/project.js index 321bbd8826..0dc5557b74 100644 --- a/frontend/src/views/project.js +++ b/frontend/src/views/project.js @@ -107,15 +107,18 @@ export const UserProjectsPage = ({ management }) => { } }, [navigate, userToken]); - if ( - !fullProjectsQuery.createdByMe && - !fullProjectsQuery.managedByMe && - !fullProjectsQuery.mappedByMe && - !fullProjectsQuery.favoritedByMe && - !fullProjectsQuery.status - ) { - setProjectQuery({ managedByMe: true }); - } + useEffect(() => { + if ( + !fullProjectsQuery.createdByMe && + !fullProjectsQuery.managedByMe && + !fullProjectsQuery.mappedByMe && + !fullProjectsQuery.favoritedByMe && + !fullProjectsQuery.status + ) { + setProjectQuery({ managedByMe: true }); + } + // eslint-disable-next-line react-hooks/exhaustive-deps + }, []); return (
diff --git a/frontend/src/views/tests/project.test.js b/frontend/src/views/tests/project.test.js index 74b168d3e8..a2ce7ae14e 100644 --- a/frontend/src/views/tests/project.test.js +++ b/frontend/src/views/tests/project.test.js @@ -1,7 +1,7 @@ import '@testing-library/jest-dom'; import { ReactRouter6Adapter } from 'use-query-params/adapters/react-router-6'; import { QueryParamProvider } from 'use-query-params'; -import { act, render, screen, waitFor } from '@testing-library/react'; +import { act, screen, waitFor } from '@testing-library/react'; import { store } from '../../store'; import { @@ -21,7 +21,6 @@ import { import { setupFaultyHandlers } from '../../network/tests/server'; import { projects } from '../../network/tests/mockData/projects'; -import { MemoryRouter, Route, Routes } from 'react-router-dom'; test('CreateProject renders ProjectCreate', async () => { renderWithRouter( @@ -202,21 +201,30 @@ describe('Projects Page', () => { }); describe('Project Detail Page', () => { + window.scrollTo = jest.fn(); jest.mock('react-chartjs-2', () => ({ Doughnut: () => null, Bar: () => null, Line: () => null, })); + const setup = () => { + createComponentWithMemoryRouter( + + + , + { + route: '/projects/:id', + entryRoute: '/projects/123', + }, + ); + }; + it('should render component details', async () => { act(() => { store.dispatch({ type: 'SET_LOCALE', locale: 'es-AR' }); }); - renderWithRouter( - - jest.fn()} /> - , - ); + setup(); await waitFor(() => { expect(screen.getByText(/sample project/i)).toBeInTheDocument(); expect(screen.getByText(/hello world/i)).toBeInTheDocument(); @@ -225,20 +233,7 @@ describe('Project Detail Page', () => { it('should display private project error message', async () => { setupFaultyHandlers(); - render( - - - - jest.fn()} /> - - } - /> - - , - ); + setup(); await waitFor(() => expect( @@ -249,20 +244,7 @@ describe('Project Detail Page', () => { it('should display generic error message', async () => { setupFaultyHandlers(); - render( - - - - jest.fn()} /> - - } - /> - - , - ); + setup(); await waitFor(() => expect( diff --git a/frontend/src/views/tests/taskSelection.test.js b/frontend/src/views/tests/taskSelection.test.js index 68aaa38755..d7f454c1c6 100644 --- a/frontend/src/views/tests/taskSelection.test.js +++ b/frontend/src/views/tests/taskSelection.test.js @@ -6,31 +6,22 @@ import { MemoryRouter, Route, Routes } from 'react-router-dom'; import userEvent from '@testing-library/user-event'; import { store } from '../../store'; -import { ReduxIntlProviders } from '../../utils/testWithIntl'; +import { ReduxIntlProviders, createComponentWithMemoryRouter } from '../../utils/testWithIntl'; import { SelectTask } from '../taskSelection'; describe('Task Selection Page', () => { - const setup = () => { - return { - user: userEvent.setup(), - ...render( - - - - - - - - } - /> - - , - ), - }; - }; + const setup = () => + createComponentWithMemoryRouter( + + + + + , + { + route: 'projects/:id/tasks', + entryRoute: '/projects/123/tasks', + }, + ); it('should redirect to login page if the user is not logged in', () => { act(() => { @@ -232,27 +223,18 @@ describe('Task Selection Page', () => { }); describe('Random Task Selection', () => { - const setup = () => { - return { - user: userEvent.setup(), - ...render( - - - - - - - - } - /> - - , - ), - }; - }; + const setup = () => + createComponentWithMemoryRouter( + + + + + , + { + route: 'projects/:id/tasks', + entryRoute: '/projects/963/tasks', + }, + ); it('should not change the button text to map selected task when user selects a task for mapping', async () => { act(() => { @@ -300,21 +282,16 @@ describe('Random Task Selection', () => { describe('Complete Project', () => { const setup = () => - render( - - - - - - - - } - /> - - , + createComponentWithMemoryRouter( + + + + + , + { + route: 'projects/:id/tasks', + entryRoute: '/projects/6/tasks', + }, ); it('should display button to select another project', async () => { @@ -330,21 +307,16 @@ describe('Complete Project', () => { describe('Mapped Project', () => { const setup = () => - render( - - - - - - - - } - /> - - , + createComponentWithMemoryRouter( + + + + + , + { + route: 'projects/:id/tasks', + entryRoute: '/projects/3/tasks', + }, ); it('should display button to validate a task', async () => { @@ -366,21 +338,16 @@ describe('Mapped Project', () => { describe('Resume Mapping', () => { const setup = () => - render( - - - - - - - - } - /> - - , + createComponentWithMemoryRouter( + + + + + , + { + route: 'projects/:id/tasks', + entryRoute: '/projects/222/tasks', + }, ); it('should display button to resume mapping', async () => { @@ -410,21 +377,16 @@ test('it should pre select task from the list from URL params', async () => { }); }); - render( - - - - - - - - } - /> - - , + createComponentWithMemoryRouter( + + + + + , + { + route: 'projects/:id/tasks', + entryRoute: '/projects/123/tasks?search=1', + }, ); await screen.findAllByText(/last updated by/i); expect(screen.getByPlaceholderText(/filter tasks by id or username/i)).toHaveValue('1');