From 14db0f67d63e9592582073ce16687da29147236a Mon Sep 17 00:00:00 2001 From: JoltCode Date: Wed, 8 Jan 2025 15:25:29 +0000 Subject: [PATCH 01/17] chore(frontend/test): testing fixes --- .../projectDetail/tests/questionsAndComments.test.jsx | 8 +++++--- 1 file changed, 5 insertions(+), 3 deletions(-) diff --git a/frontend/src/components/projectDetail/tests/questionsAndComments.test.jsx b/frontend/src/components/projectDetail/tests/questionsAndComments.test.jsx index 5ea66ff1ed..463c4094c4 100644 --- a/frontend/src/components/projectDetail/tests/questionsAndComments.test.jsx +++ b/frontend/src/components/projectDetail/tests/questionsAndComments.test.jsx @@ -36,10 +36,12 @@ describe('test if QuestionsAndComments component', () => { , ); - const previewBtn = await waitFor(() => screen.getByRole('button', { name: /preview/i })); - expect(screen.getAllByRole('button').length).toBe(1); + const previewBtn = await screen.findByRole('button', { name: /preview/i }, { + timeout: 5000, + }) + expect(screen.getAllByRole('button').length).toBe(11); waitFor(() => expect(screen.getByRole('button', { name: /write/i }))); - expect(screen.getAllByRole('button')).toHaveLength(1); + expect(screen.getAllByRole('button')).toHaveLength(11); waitFor(() => (screen.getByRole('textbox'))); await user.click(previewBtn); expect(screen.queryByRole('textbox', { hidden: true })).toBeInTheDocument(); From 23e44a152910e4794e4fe10bbfd15256ad431b49 Mon Sep 17 00:00:00 2001 From: JoltCode Date: Wed, 8 Jan 2025 15:33:18 +0000 Subject: [PATCH 02/17] fix(frontend/tests): timeout --- .../projectDetail/tests/questionsAndComments.test.jsx | 2 +- frontend/src/setup.ts | 3 +++ frontend/vitest.config.ts | 3 ++- 3 files changed, 6 insertions(+), 2 deletions(-) diff --git a/frontend/src/components/projectDetail/tests/questionsAndComments.test.jsx b/frontend/src/components/projectDetail/tests/questionsAndComments.test.jsx index 463c4094c4..c3f0e0a505 100644 --- a/frontend/src/components/projectDetail/tests/questionsAndComments.test.jsx +++ b/frontend/src/components/projectDetail/tests/questionsAndComments.test.jsx @@ -59,7 +59,7 @@ describe('test if QuestionsAndComments component', () => { , ); - await waitFor(() => expect(screen.getByText('hello world')).toBeInTheDocument()); + expect(await screen.findByText('hello world')).toBeInTheDocument(); const textarea = screen.getByRole('textbox'); const postBtn = screen.getByRole('button', { name: /post/i }); await user.type(textarea, 'Test comment'); diff --git a/frontend/src/setup.ts b/frontend/src/setup.ts index 8669149aa7..d8ddf1fe39 100644 --- a/frontend/src/setup.ts +++ b/frontend/src/setup.ts @@ -1,6 +1,9 @@ import '@testing-library/jest-dom/vitest'; +import { configure } from '@testing-library/react'; import "vitest-canvas-mock" +configure({ asyncUtilTimeout: 4000 }); + // vi.mock('mapbox-gl/dist/mapbox-gl'); window.URL.createObjectURL = vi.fn(); diff --git a/frontend/vitest.config.ts b/frontend/vitest.config.ts index 71b24dfd7e..6739657e4b 100644 --- a/frontend/vitest.config.ts +++ b/frontend/vitest.config.ts @@ -8,6 +8,7 @@ export default defineConfig({ globals: true, clearMocks: true, setupFiles: ['./src/setup.ts', './src/network/tests/server.ts'], - environment: "jsdom" + environment: "jsdom", + testTimeout: 15000 }, }) From 4e5393b0342e87405ce148129e5525c01d589724 Mon Sep 17 00:00:00 2001 From: JoltCode Date: Wed, 8 Jan 2025 17:00:40 +0000 Subject: [PATCH 03/17] chore(frontend/tests): attempted fix --- .../taskSelection/tests/action.test.tsx | 18 ++++++++---------- frontend/src/setup.ts | 2 +- frontend/vitest.config.ts | 2 +- 3 files changed, 10 insertions(+), 12 deletions(-) diff --git a/frontend/src/components/taskSelection/tests/action.test.tsx b/frontend/src/components/taskSelection/tests/action.test.tsx index 8b8c745ef1..3fa294ac87 100644 --- a/frontend/src/components/taskSelection/tests/action.test.tsx +++ b/frontend/src/components/taskSelection/tests/action.test.tsx @@ -36,20 +36,18 @@ describe('Task Map Action', () => { setupFaultyHandlers(); const { user } = setup(); await user.click( - screen.getByRole('button', { + await screen.findByRole('button', { name: /iD Editor/i, }), ); - await user.click(screen.getByText('JOSM')); - await waitFor(() => - expect( - screen.getByRole('heading', { - name: messages.JOSMError.defaultMessage, - }), - ).toBeInTheDocument(), - ); + await user.click(await screen.findByText('JOSM')); + expect( + await screen.findByRole('heading', { + name: messages.JOSMError.defaultMessage, + }), + ).toBeInTheDocument() await user.click( - screen.getByRole('button', { + await screen.findByRole('button', { name: /close/i, }), ); diff --git a/frontend/src/setup.ts b/frontend/src/setup.ts index d8ddf1fe39..38f0cb9876 100644 --- a/frontend/src/setup.ts +++ b/frontend/src/setup.ts @@ -2,7 +2,7 @@ import '@testing-library/jest-dom/vitest'; import { configure } from '@testing-library/react'; import "vitest-canvas-mock" -configure({ asyncUtilTimeout: 4000 }); +configure({ asyncUtilTimeout: 8000 }); // vi.mock('mapbox-gl/dist/mapbox-gl'); diff --git a/frontend/vitest.config.ts b/frontend/vitest.config.ts index 6739657e4b..4a7907297d 100644 --- a/frontend/vitest.config.ts +++ b/frontend/vitest.config.ts @@ -9,6 +9,6 @@ export default defineConfig({ clearMocks: true, setupFiles: ['./src/setup.ts', './src/network/tests/server.ts'], environment: "jsdom", - testTimeout: 15000 + testTimeout: 20000 }, }) From de0aec52c7673f9ed4ce23e8b15cbbdceff107b0 Mon Sep 17 00:00:00 2001 From: JoltCode Date: Wed, 8 Jan 2025 17:27:10 +0000 Subject: [PATCH 04/17] chore,fix(frontend): rename env prefix from VITE_ to REACT_APP_ --- frontend/.env.expand | 88 ++++++++++----------- frontend/index.html | 14 ++-- frontend/src/App.tsx | 2 +- frontend/src/config/index.ts | 86 ++++++++++---------- frontend/src/utils/tests/openEditor.test.js | 10 +-- frontend/vite.config.ts | 1 + frontend/vitest.config.ts | 1 + 7 files changed, 102 insertions(+), 100 deletions(-) diff --git a/frontend/.env.expand b/frontend/.env.expand index e4dbf4b6e3..314dcf6193 100644 --- a/frontend/.env.expand +++ b/frontend/.env.expand @@ -2,47 +2,47 @@ # Variables that are available for the frontend. # Usually doesn't need to be modified # -VITE_BASE_URL=$TM_APP_BASE_URL -VITE_API_URL=$TM_APP_API_URL -VITE_API_VERSION=$TM_APP_API_VERSION -VITE_ORG_NAME=$TM_ORG_NAME -VITE_ORG_CODE=$TM_ORG_CODE -VITE_ORG_URL=$TM_ORG_URL -VITE_ORG_LOGO=$TM_ORG_LOGO -VITE_ORG_PRIVACY_POLICY_URL=$TM_ORG_PRIVACY_POLICY_URL -VITE_ORG_TWITTER=$TM_ORG_TWITTER -VITE_ORG_FB=$TM_ORG_FB -VITE_ORG_INSTAGRAM=$TM_ORG_INSTAGRAM -VITE_ORG_YOUTUBE=$TM_ORG_YOUTUBE -VITE_ORG_GITHUB=$TM_ORG_GITHUB -VITE_DEFAULT_LOCALE=$TM_DEFAULT_LOCALE -VITE_TM_MAPPER_LEVEL_INTERMEDIATE=$TM_MAPPER_LEVEL_INTERMEDIATE -VITE_TM_MAPPER_LEVEL_ADVANCED=$TM_MAPPER_LEVEL_ADVANCED -VITE_MATOMO_ID=$TM_MATOMO_ID -VITE_MATOMO_ENDPOINT=$TM_MATOMO_ENDPOINT -VITE_SERVICE_DESK=$TM_SERVICE_DESK -VITE_IMAGE_UPLOAD_API_URL=$TM_IMAGE_UPLOAD_API_URL -VITE_HOMEPAGE_VIDEO_URL=$TM_HOMEPAGE_VIDEO_URL -VITE_HOMEPAGE_IMG_HIGH=$TM_HOMEPAGE_IMG_HIGH -VITE_HOMEPAGE_IMG_LOW=$TM_HOMEPAGE_IMG_LOW -VITE_MAPBOX_TOKEN=$TM_MAPBOX_TOKEN -VITE_ENABLE_SERVICEWORKER=$TM_ENABLE_SERVICEWORKER -VITE_MAX_FILESIZE=$TM_IMPORT_MAX_FILESIZE -VITE_MAX_AOI_AREA=$TM_MAX_AOI_AREA -VITE_OHSOME_STATS_BASE_URL=$OHSOME_STATS_BASE_URL -VITE_OHSOME_STATS_TOKEN=$OHSOME_STATS_TOKEN -VITE_OSM_CLIENT_ID=$TM_CLIENT_ID -VITE_OSM_CLIENT_SECRET=$TM_CLIENT_SECRET -VITE_OSM_REDIRECT_URI=$TM_REDIRECT_URI -VITE_OSM_SERVER_URL=$OSM_SERVER_URL -VITE_OSM_SERVER_API_URL=$OSM_SERVER_API_URL -VITE_TM_ORG_NAME=$TM_ORG_NAME -VITE_OSM_REGISTER_URL=$OSM_REGISTER_URL -VITE_ID_EDITOR_URL=$ID_EDITOR_URL -VITE_POTLATCH2_EDITOR_URL=$POTLATCH2_EDITOR_URL -VITE_SENTRY_FRONTEND_DSN=$TM_SENTRY_FRONTEND_DSN -VITE_ENVIRONMENT=$TM_ENVIRONMENT -VITE_TM_DEFAULT_CHANGESET_COMMENT=$TM_DEFAULT_CHANGESET_COMMENT -VITE_RAPID_EDITOR_URL=$RAPID_EDITOR_URL -VITE_EXPORT_TOOL_S3_URL=$EXPORT_TOOL_S3_URL -VITE_ENABLE_EXPORT_TOOL=$ENABLE_EXPORT_TOOL +REACT_APP_BASE_URL=$TM_APP_BASE_URL +REACT_APP_API_URL=$TM_APP_API_URL +REACT_APP_API_VERSION=$TM_APP_API_VERSION +REACT_APP_ORG_NAME=$TM_ORG_NAME +REACT_APP_ORG_CODE=$TM_ORG_CODE +REACT_APP_ORG_URL=$TM_ORG_URL +REACT_APP_ORG_LOGO=$TM_ORG_LOGO +REACT_APP_ORG_PRIVACY_POLICY_URL=$TM_ORG_PRIVACY_POLICY_URL +REACT_APP_ORG_TWITTER=$TM_ORG_TWITTER +REACT_APP_ORG_FB=$TM_ORG_FB +REACT_APP_ORG_INSTAGRAM=$TM_ORG_INSTAGRAM +REACT_APP_ORG_YOUTUBE=$TM_ORG_YOUTUBE +REACT_APP_ORG_GITHUB=$TM_ORG_GITHUB +REACT_APP_DEFAULT_LOCALE=$TM_DEFAULT_LOCALE +REACT_APP_TM_MAPPER_LEVEL_INTERMEDIATE=$TM_MAPPER_LEVEL_INTERMEDIATE +REACT_APP_TM_MAPPER_LEVEL_ADVANCED=$TM_MAPPER_LEVEL_ADVANCED +REACT_APP_MATOMO_ID=$TM_MATOMO_ID +REACT_APP_MATOMO_ENDPOINT=$TM_MATOMO_ENDPOINT +REACT_APP_SERVICE_DESK=$TM_SERVICE_DESK +REACT_APP_IMAGE_UPLOAD_API_URL=$TM_IMAGE_UPLOAD_API_URL +REACT_APP_HOMEPAGE_VIDEO_URL=$TM_HOMEPAGE_VIDEO_URL +REACT_APP_HOMEPAGE_IMG_HIGH=$TM_HOMEPAGE_IMG_HIGH +REACT_APP_HOMEPAGE_IMG_LOW=$TM_HOMEPAGE_IMG_LOW +REACT_APP_MAPBOX_TOKEN=$TM_MAPBOX_TOKEN +REACT_APP_ENABLE_SERVICEWORKER=$TM_ENABLE_SERVICEWORKER +REACT_APP_MAX_FILESIZE=$TM_IMPORT_MAX_FILESIZE +REACT_APP_MAX_AOI_AREA=$TM_MAX_AOI_AREA +REACT_APP_OHSOME_STATS_BASE_URL=$OHSOME_STATS_BASE_URL +REACT_APP_OHSOME_STATS_TOKEN=$OHSOME_STATS_TOKEN +REACT_APP_OSM_CLIENT_ID=$TM_CLIENT_ID +REACT_APP_OSM_CLIENT_SECRET=$TM_CLIENT_SECRET +REACT_APP_OSM_REDIRECT_URI=$TM_REDIRECT_URI +REACT_APP_OSM_SERVER_URL=$OSM_SERVER_URL +REACT_APP_OSM_SERVER_API_URL=$OSM_SERVER_API_URL +REACT_APP_TM_ORG_NAME=$TM_ORG_NAME +REACT_APP_OSM_REGISTER_URL=$OSM_REGISTER_URL +REACT_APP_ID_EDITOR_URL=$ID_EDITOR_URL +REACT_APP_POTLATCH2_EDITOR_URL=$POTLATCH2_EDITOR_URL +REACT_APP_SENTRY_FRONTEND_DSN=$TM_SENTRY_FRONTEND_DSN +REACT_APP_ENVIRONMENT=$TM_ENVIRONMENT +REACT_APP_TM_DEFAULT_CHANGESET_COMMENT=$TM_DEFAULT_CHANGESET_COMMENT +REACT_APP_RAPID_EDITOR_URL=$RAPID_EDITOR_URL +REACT_APP_EXPORT_TOOL_S3_URL=$EXPORT_TOOL_S3_URL +REACT_APP_ENABLE_EXPORT_TOOL=$ENABLE_EXPORT_TOOL diff --git a/frontend/index.html b/frontend/index.html index 0d95f28e0a..3727f8abad 100644 --- a/frontend/index.html +++ b/frontend/index.html @@ -14,14 +14,14 @@ - - + + - + - %VITE_ORG_CODE% Tasking Manager + %REACT_APP_ORG_CODE% Tasking Manager @@ -59,10 +59,10 @@ _paq.push(['trackPageView']); _paq.push(['enableLinkTracking']); // Tracks downloads _paq.push(['trackVisibleContentImpressions']); // Tracks content blocks - var site_id = '%VITE_MATOMO_ID%'; - if (site_id && '%VITE_MATOMO_ENDPOINT%') { + var site_id = '%REACT_APP_MATOMO_ID%'; + if (site_id && '%REACT_APP_MATOMO_ENDPOINT%') { (function () { - var u = '%VITE_MATOMO_ENDPOINT%'; + var u = '%REACT_APP_MATOMO_ENDPOINT%'; _paq.push(['setTrackerUrl', u + 'piwik.php']); _paq.push(['setSiteId', site_id]); diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx index 1f949fea5a..2978597ef2 100644 --- a/frontend/src/App.tsx +++ b/frontend/src/App.tsx @@ -38,7 +38,7 @@ const queryClient = new QueryClient({ }); const App = () => { - useMeta({ property: 'og:url', content: import.meta.env.VITE_BASE_URL }); + useMeta({ property: 'og:url', content: import.meta.env.REACT_APP_BASE_URL }); useMeta({ name: 'author', content: ORG_NAME }); const isLoading = useSelector((state: RootStore) => state.loader.isLoading); const locale = useSelector((state: RootStore) => state.preferences.locale); diff --git a/frontend/src/config/index.ts b/frontend/src/config/index.ts index 5e0e679274..10830d26cc 100644 --- a/frontend/src/config/index.ts +++ b/frontend/src/config/index.ts @@ -1,65 +1,65 @@ // API ENDPOINTS -export const API_VERSION = import.meta.env.VITE_API_VERSION || 'v2'; -export const API_URL = import.meta.env.VITE_API_URL - ? new URL('/api/' + API_VERSION + '/', import.meta.env.VITE_API_URL) +export const API_VERSION = import.meta.env.REACT_APP_API_VERSION || 'v2'; +export const API_URL = import.meta.env.REACT_APP_API_URL + ? new URL('/api/' + API_VERSION + '/', import.meta.env.REACT_APP_API_URL) : 'http://127.0.0.1:5000/api/' + API_VERSION + '/'; export const OHSOME_STATS_BASE_URL = - import.meta.env.VITE_OHSOME_STATS_BASE_URL || 'https://stats.now.ohsome.org/api'; + import.meta.env.REACT_APP_OHSOME_STATS_BASE_URL || 'https://stats.now.ohsome.org/api'; // APPLICATION SETTINGS -export const DEFAULT_LOCALE = import.meta.env.VITE_DEFAULT_LOCALE || 'en'; -export const ENVIRONMENT = import.meta.env.VITE_ENVIRONMENT || ''; +export const DEFAULT_LOCALE = import.meta.env.REACT_APP_DEFAULT_LOCALE || 'en'; +export const ENVIRONMENT = import.meta.env.REACT_APP_ENVIRONMENT || ''; export const PROJECTCARD_CONTRIBUTION_SHOWN_THRESHOLD = - import.meta.env.VITE_PROJECTCARD_CONTRIBUTION_SHOWN_THRESHOLD || 5; + import.meta.env.REACT_APP_PROJECTCARD_CONTRIBUTION_SHOWN_THRESHOLD || 5; export const INTERMEDIATE_LEVEL_COUNT = - Number(import.meta.env.VITE_TM_MAPPER_LEVEL_INTERMEDIATE) || 250; -export const ADVANCED_LEVEL_COUNT = Number(import.meta.env.VITE_TM_MAPPER_LEVEL_ADVANCED) || 500; -export const MAPBOX_TOKEN = import.meta.env.VITE_MAPBOX_TOKEN || ''; -export const ENABLE_SERVICEWORKER = import.meta.env.VITE_ENABLE_SERVICEWORKER || 0; -export const MAX_AOI_AREA = Number(import.meta.env.VITE_MAX_AOI_AREA) || 5000; -export const MAX_FILESIZE = parseInt(import.meta.env.VITE_MAX_FILESIZE) || 1000000; // bytes + Number(import.meta.env.REACT_APP_TM_MAPPER_LEVEL_INTERMEDIATE) || 250; +export const ADVANCED_LEVEL_COUNT = Number(import.meta.env.REACT_APP_TM_MAPPER_LEVEL_ADVANCED) || 500; +export const MAPBOX_TOKEN = import.meta.env.REACT_APP_MAPBOX_TOKEN || ''; +export const ENABLE_SERVICEWORKER = import.meta.env.REACT_APP_ENABLE_SERVICEWORKER || 0; +export const MAX_AOI_AREA = Number(import.meta.env.REACT_APP_MAX_AOI_AREA) || 5000; +export const MAX_FILESIZE = parseInt(import.meta.env.REACT_APP_MAX_FILESIZE) || 1000000; // bytes // ORGANISATIONAL INFORMATION -export const ORG_NAME = import.meta.env.VITE_ORG_NAME || 'Humanitarian OpenStreetMap Team'; -export const ORG_CODE = import.meta.env.VITE_ORG_CODE || 'HOT'; -export const ORG_URL = import.meta.env.VITE_ORG_URL || ''; -export const ORG_LOGO = import.meta.env.VITE_ORG_LOGO || ''; -export const HOMEPAGE_IMG_HIGH = import.meta.env.VITE_HOMEPAGE_IMG_HIGH || ''; -export const HOMEPAGE_IMG_LOW = import.meta.env.VITE_HOMEPAGE_IMG_LOW || ''; -export const OSM_CLIENT_ID = import.meta.env.VITE_OSM_CLIENT_ID || ''; -export const OSM_CLIENT_SECRET = import.meta.env.VITE_OSM_CLIENT_SECRET || ''; -export const OSM_REDIRECT_URI = import.meta.env.VITE_OSM_REDIRECT_URI || ''; -export const ORG_PRIVACY_POLICY_URL = import.meta.env.VITE_ORG_PRIVACY_POLICY_URL || ''; +export const ORG_NAME = import.meta.env.REACT_APP_ORG_NAME || 'Humanitarian OpenStreetMap Team'; +export const ORG_CODE = import.meta.env.REACT_APP_ORG_CODE || 'HOT'; +export const ORG_URL = import.meta.env.REACT_APP_ORG_URL || ''; +export const ORG_LOGO = import.meta.env.REACT_APP_ORG_LOGO || ''; +export const HOMEPAGE_IMG_HIGH = import.meta.env.REACT_APP_HOMEPAGE_IMG_HIGH || ''; +export const HOMEPAGE_IMG_LOW = import.meta.env.REACT_APP_HOMEPAGE_IMG_LOW || ''; +export const OSM_CLIENT_ID = import.meta.env.REACT_APP_OSM_CLIENT_ID || ''; +export const OSM_CLIENT_SECRET = import.meta.env.REACT_APP_OSM_CLIENT_SECRET || ''; +export const OSM_REDIRECT_URI = import.meta.env.REACT_APP_OSM_REDIRECT_URI || ''; +export const ORG_PRIVACY_POLICY_URL = import.meta.env.REACT_APP_ORG_PRIVACY_POLICY_URL || ''; export const OSM_REGISTER_URL = - import.meta.env.VITE_OSM_REGISTER_URL || 'https://www.openstreetmap.org/user/new'; -export const ORG_TWITTER = import.meta.env.VITE_ORG_TWITTER || 'https://twitter.com/hotosm'; -export const ORG_FB = import.meta.env.VITE_ORG_FB || 'https://www.facebook.com/hotosm'; + import.meta.env.REACT_APP_OSM_REGISTER_URL || 'https://www.openstreetmap.org/user/new'; +export const ORG_TWITTER = import.meta.env.REACT_APP_ORG_TWITTER || 'https://twitter.com/hotosm'; +export const ORG_FB = import.meta.env.REACT_APP_ORG_FB || 'https://www.facebook.com/hotosm'; export const ORG_INSTAGRAM = - import.meta.env.VITE_ORG_INSTAGRAM || 'https://www.instagram.com/open.mapping.hubs/'; + import.meta.env.REACT_APP_ORG_INSTAGRAM || 'https://www.instagram.com/open.mapping.hubs/'; export const ORG_YOUTUBE = - import.meta.env.VITE_ORG_YOUTUBE || 'https://www.youtube.com/user/hotosm'; -export const ORG_GITHUB = import.meta.env.VITE_ORG_GITHUB || 'https://github.com/hotosm'; -export const MATOMO_ID = import.meta.env.VITE_MATOMO_ID || ''; -export const SERVICE_DESK = import.meta.env.VITE_SERVICE_DESK || ''; -export const IMAGE_UPLOAD_SERVICE = import.meta.env.VITE_IMAGE_UPLOAD_API_URL || ''; + import.meta.env.REACT_APP_ORG_YOUTUBE || 'https://www.youtube.com/user/hotosm'; +export const ORG_GITHUB = import.meta.env.REACT_APP_ORG_GITHUB || 'https://github.com/hotosm'; +export const MATOMO_ID = import.meta.env.REACT_APP_MATOMO_ID || ''; +export const SERVICE_DESK = import.meta.env.REACT_APP_SERVICE_DESK || ''; +export const IMAGE_UPLOAD_SERVICE = import.meta.env.REACT_APP_IMAGE_UPLOAD_API_URL || ''; export const TM_DEFAULT_CHANGESET_COMMENT = - import.meta.env.VITE_TM_DEFAULT_CHANGESET_COMMENT || '#hotosm-project'; -export const HOMEPAGE_VIDEO_URL = import.meta.env.VITE_HOMEPAGE_VIDEO_URL || ''; + import.meta.env.REACT_APP_TM_DEFAULT_CHANGESET_COMMENT || '#hotosm-project'; +export const HOMEPAGE_VIDEO_URL = import.meta.env.REACT_APP_HOMEPAGE_VIDEO_URL || ''; // Sentry.io DSN -export const SENTRY_FRONTEND_DSN = import.meta.env.VITE_SENTRY_FRONTEND_DSN; +export const SENTRY_FRONTEND_DSN = import.meta.env.REACT_APP_SENTRY_FRONTEND_DSN; // OSM API and Editor URLs export const OSM_SERVER_URL = - import.meta.env.VITE_OSM_SERVER_URL || 'https://www.openstreetmap.org'; + import.meta.env.REACT_APP_OSM_SERVER_URL || 'https://www.openstreetmap.org'; export const OSM_SERVER_API_URL = - import.meta.env.VITE_OSM_SERVER_API_URL || 'https://api.openstreetmap.org'; + import.meta.env.REACT_APP_OSM_SERVER_API_URL || 'https://api.openstreetmap.org'; export const ID_EDITOR_URL = - import.meta.env.VITE_ID_EDITOR_URL || 'https://www.openstreetmap.org/edit?editor=id&'; + import.meta.env.REACT_APP_ID_EDITOR_URL || 'https://www.openstreetmap.org/edit?editor=id&'; export const POTLATCH2_EDITOR_URL = - import.meta.env.VITE_POTLATCH2_EDITOR_URL || + import.meta.env.REACT_APP_POTLATCH2_EDITOR_URL || 'https://www.openstreetmap.org/edit?editor=potlatch2'; -export const RAPID_EDITOR_URL = import.meta.env.VITE_RAPID_EDITOR_URL || 'https://mapwith.ai/rapid'; -export const EXPORT_TOOL_S3_URL = import.meta.env.VITE_EXPORT_TOOL_S3_URL || ''; -export const ENABLE_EXPORT_TOOL = import.meta.env.VITE_ENABLE_EXPORT_TOOL || ''; +export const RAPID_EDITOR_URL = import.meta.env.REACT_APP_RAPID_EDITOR_URL || 'https://mapwith.ai/rapid'; +export const EXPORT_TOOL_S3_URL = import.meta.env.REACT_APP_EXPORT_TOOL_S3_URL || ''; +export const ENABLE_EXPORT_TOOL = import.meta.env.REACT_APP_ENABLE_EXPORT_TOOL || ''; export const TASK_COLOURS = { READY: '#fff', @@ -173,7 +173,7 @@ export const MAP_STYLE = MAPBOX_TOKEN export const MAPBOX_RTL_PLUGIN_URL = 'https://api.mapbox.com/mapbox-gl-js/plugins/mapbox-gl-rtl-text/v0.2.0/mapbox-gl-rtl-text.js'; -export const UNDERPASS_URL = import.meta.env.VITE_UNDERPASS_URL || 'https://underpass.hotosm.org'; +export const UNDERPASS_URL = import.meta.env.REACT_APP_UNDERPASS_URL || 'https://underpass.hotosm.org'; export const DROPZONE_SETTINGS = { accept: { diff --git a/frontend/src/utils/tests/openEditor.test.js b/frontend/src/utils/tests/openEditor.test.js index 7402d2d81d..d34248b2cc 100644 --- a/frontend/src/utils/tests/openEditor.test.js +++ b/frontend/src/utils/tests/openEditor.test.js @@ -13,7 +13,7 @@ import { } from '../openEditor'; describe('test if getIdUrl', () => { - const urlEncoded = encodeURIComponent(import.meta.env.VITE_API_URL); + const urlEncoded = encodeURIComponent(import.meta.env.REACT_APP_API_URL); it('returns the correct url with locale=pt-BR', () => { const testProject = { changesetComment: '#hotosm-project-5522 #osm_in #2018IndiaFloods #mmteamarm', @@ -31,7 +31,7 @@ describe('test if getIdUrl', () => { }); it('with customUrl returns the correct formatted url', () => { - const urlEncoded = encodeURIComponent(import.meta.env.VITE_API_URL); + const urlEncoded = encodeURIComponent(import.meta.env.REACT_APP_API_URL); const testProject = { changesetComment: '#hotosm-project-5522 #osm_in #2018IndiaFloods #mmteamarm', projectId: 1234, @@ -48,7 +48,7 @@ describe('test if getIdUrl', () => { }); it('with idPresets returns the url param', () => { - const urlEncoded = encodeURIComponent(import.meta.env.VITE_API_URL); + const urlEncoded = encodeURIComponent(import.meta.env.REACT_APP_API_URL); const testProject = { changesetComment: '#hotosm-project-5522 #osm_in #2018IndiaFloods #mmteamarm', projectId: 1234, @@ -78,7 +78,7 @@ describe('test if getIdUrl', () => { }); it('without imagery and with multiple tasks returns the correct url', () => { - const urlEncoded = encodeURIComponent(import.meta.env.VITE_API_URL); + const urlEncoded = encodeURIComponent(import.meta.env.REACT_APP_API_URL); const testProject = { changesetComment: '#hotosm-project-5522', projectId: 1234, @@ -92,7 +92,7 @@ describe('test if getIdUrl', () => { }); it('with a imagery that is not a URL and with multiple tasks returns the correct url', () => { - const urlEncoded = encodeURIComponent(import.meta.env.VITE_API_URL); + const urlEncoded = encodeURIComponent(import.meta.env.REACT_APP_API_URL); const testProject = { changesetComment: '#hotosm-project-5522', projectId: 1234, diff --git a/frontend/vite.config.ts b/frontend/vite.config.ts index 554ac5e106..79dcd7f6cf 100644 --- a/frontend/vite.config.ts +++ b/frontend/vite.config.ts @@ -4,4 +4,5 @@ import react from '@vitejs/plugin-react-swc'; export default defineConfig({ plugins: [react()], + envPrefix: 'REACT_APP_', }); diff --git a/frontend/vitest.config.ts b/frontend/vitest.config.ts index 4a7907297d..55f0bfc6a5 100644 --- a/frontend/vitest.config.ts +++ b/frontend/vitest.config.ts @@ -11,4 +11,5 @@ export default defineConfig({ environment: "jsdom", testTimeout: 20000 }, + envPrefix: 'REACT_APP_', }) From de2d3f4be49c18d7481486d1b4cbb7ebfefe49f6 Mon Sep 17 00:00:00 2001 From: JoltCode Date: Wed, 8 Jan 2025 17:34:34 +0000 Subject: [PATCH 05/17] fix(frontend/tests): openEditor test env --- frontend/src/utils/tests/openEditor.test.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/frontend/src/utils/tests/openEditor.test.js b/frontend/src/utils/tests/openEditor.test.js index d34248b2cc..21781703b9 100644 --- a/frontend/src/utils/tests/openEditor.test.js +++ b/frontend/src/utils/tests/openEditor.test.js @@ -13,7 +13,7 @@ import { } from '../openEditor'; describe('test if getIdUrl', () => { - const urlEncoded = encodeURIComponent(import.meta.env.REACT_APP_API_URL); + const urlEncoded = encodeURIComponent(API_URL); it('returns the correct url with locale=pt-BR', () => { const testProject = { changesetComment: '#hotosm-project-5522 #osm_in #2018IndiaFloods #mmteamarm', From ee57bebdaab5315a11febd6c55609c9a60bfae15 Mon Sep 17 00:00:00 2001 From: JoltCode Date: Wed, 8 Jan 2025 17:34:59 +0000 Subject: [PATCH 06/17] fix(frontend/tests): openEditor test env --- frontend/src/utils/tests/openEditor.test.js | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/frontend/src/utils/tests/openEditor.test.js b/frontend/src/utils/tests/openEditor.test.js index 21781703b9..e0fcf40a0d 100644 --- a/frontend/src/utils/tests/openEditor.test.js +++ b/frontend/src/utils/tests/openEditor.test.js @@ -31,7 +31,7 @@ describe('test if getIdUrl', () => { }); it('with customUrl returns the correct formatted url', () => { - const urlEncoded = encodeURIComponent(import.meta.env.REACT_APP_API_URL); + const urlEncoded = encodeURIComponent(API_URL); const testProject = { changesetComment: '#hotosm-project-5522 #osm_in #2018IndiaFloods #mmteamarm', projectId: 1234, @@ -48,7 +48,7 @@ describe('test if getIdUrl', () => { }); it('with idPresets returns the url param', () => { - const urlEncoded = encodeURIComponent(import.meta.env.REACT_APP_API_URL); + const urlEncoded = encodeURIComponent(API_URL); const testProject = { changesetComment: '#hotosm-project-5522 #osm_in #2018IndiaFloods #mmteamarm', projectId: 1234, @@ -78,7 +78,7 @@ describe('test if getIdUrl', () => { }); it('without imagery and with multiple tasks returns the correct url', () => { - const urlEncoded = encodeURIComponent(import.meta.env.REACT_APP_API_URL); + const urlEncoded = encodeURIComponent(API_URL); const testProject = { changesetComment: '#hotosm-project-5522', projectId: 1234, @@ -92,7 +92,7 @@ describe('test if getIdUrl', () => { }); it('with a imagery that is not a URL and with multiple tasks returns the correct url', () => { - const urlEncoded = encodeURIComponent(import.meta.env.REACT_APP_API_URL); + const urlEncoded = encodeURIComponent(API_URL); const testProject = { changesetComment: '#hotosm-project-5522', projectId: 1234, From e3423f37f32312abdd2598855a76e4ed6aa2cc70 Mon Sep 17 00:00:00 2001 From: JoltCode Date: Wed, 8 Jan 2025 17:36:36 +0000 Subject: [PATCH 07/17] fix(frontend/tests): hedaer svg --- frontend/src/components/header/tests/index.test.jsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/frontend/src/components/header/tests/index.test.jsx b/frontend/src/components/header/tests/index.test.jsx index ee23c2c16d..267563b2db 100644 --- a/frontend/src/components/header/tests/index.test.jsx +++ b/frontend/src/components/header/tests/index.test.jsx @@ -36,7 +36,7 @@ describe('Header', () => { if (ORG_LOGO) { expect(orgLogo).toHaveAttribute('src', ORG_LOGO); } else { - expect(orgLogo).toHaveAttribute('src', 'main-logo.svg'); + expect(orgLogo).toHaveAttribute('src', expect.stringContaining('main-logo.svg')); } expect(screen.getByText(/Tasking Manager/i)).toBeInTheDocument(); ['Explore projects', 'Learn', 'About'].forEach((menuItem) => From 4048e3787258b9ea79cca9e04cfe503d75993b7f Mon Sep 17 00:00:00 2001 From: JoltCode Date: Wed, 8 Jan 2025 17:36:36 +0000 Subject: [PATCH 08/17] fix(frontend/tests): header svg --- frontend/src/components/header/tests/index.test.jsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/frontend/src/components/header/tests/index.test.jsx b/frontend/src/components/header/tests/index.test.jsx index ee23c2c16d..267563b2db 100644 --- a/frontend/src/components/header/tests/index.test.jsx +++ b/frontend/src/components/header/tests/index.test.jsx @@ -36,7 +36,7 @@ describe('Header', () => { if (ORG_LOGO) { expect(orgLogo).toHaveAttribute('src', ORG_LOGO); } else { - expect(orgLogo).toHaveAttribute('src', 'main-logo.svg'); + expect(orgLogo).toHaveAttribute('src', expect.stringContaining('main-logo.svg')); } expect(screen.getByText(/Tasking Manager/i)).toBeInTheDocument(); ['Explore projects', 'Learn', 'About'].forEach((menuItem) => From 90d7fad166d2415b911e9bfc4c21351cc8c603f5 Mon Sep 17 00:00:00 2001 From: JoltCode Date: Wed, 8 Jan 2025 17:50:38 +0000 Subject: [PATCH 09/17] fix(frontend/tests): openEditor tests --- frontend/src/utils/tests/openEditor.test.js | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/frontend/src/utils/tests/openEditor.test.js b/frontend/src/utils/tests/openEditor.test.js index e0fcf40a0d..0f6353686f 100644 --- a/frontend/src/utils/tests/openEditor.test.js +++ b/frontend/src/utils/tests/openEditor.test.js @@ -26,7 +26,7 @@ describe('test if getIdUrl', () => { '#map=18/-9.663953/120.25684' + '&comment=%23hotosm-project-5522%20%23osm_in%20%232018IndiaFloods%20%23mmteamarm' + '&background=custom:https%3A%2F%2Fapi.mapbox.com%2Fstyles%2Fv1%2Ftm4%2Fcode123%2Ftiles%2F256%2F%7Bz%7D%2F%7Bx%7D%2F%7By%7D%3Faccess_token%3Dpk.123' + - '&gpx=' + urlEncoded + 'api%2Fv2%2Fprojects%2F1234%2Ftasks%2Fqueries%2Fgpx%2F%3Ftasks%3D1', + '&gpx=' + urlEncoded + 'projects%2F1234%2Ftasks%2Fqueries%2Fgpx%2F%3Ftasks%3D1', ); }); @@ -43,7 +43,7 @@ describe('test if getIdUrl', () => { '#map=18/-9.663953/120.25684' + '&comment=%23hotosm-project-5522%20%23osm_in%20%232018IndiaFloods%20%23mmteamarm' + '&background=custom:https%3A%2F%2Fapi.mapbox.com%2Fstyles%2Fv1%2Ftm4%2Fcode123%2Ftiles%2F256%2F%7Bz%7D%2F%7Bx%7D%2F%7By%7D%3Faccess_token%3Dpk.123' + - '&gpx='+ urlEncoded +'api%2Fv2%2Fprojects%2F1234%2Ftasks%2Fqueries%2Fgpx%2F%3Ftasks%3D1', + '&gpx='+ urlEncoded +'projects%2F1234%2Ftasks%2Fqueries%2Fgpx%2F%3Ftasks%3D1', ); }); @@ -58,7 +58,7 @@ describe('test if getIdUrl', () => { 'https://www.openstreetmap.org/edit?editor=id&' + '#map=18/-9.663953/120.25684' + '&comment=%23hotosm-project-5522%20%23osm_in%20%232018IndiaFloods%20%23mmteamarm' + - '&gpx=' + urlEncoded + 'api%2Fv2%2Fprojects%2F1234%2Ftasks%2Fqueries%2Fgpx%2F%3Ftasks%3D1' + + '&gpx=' + urlEncoded + 'projects%2F1234%2Ftasks%2Fqueries%2Fgpx%2F%3Ftasks%3D1' + '&presets=building%2Chighway%2Cnatural%2Fwater', ); }); @@ -87,7 +87,7 @@ describe('test if getIdUrl', () => { 'https://www.openstreetmap.org/edit?editor=id&' + '#map=18/-9.663953/120.25684' + '&comment=%23hotosm-project-5522' + - '&gpx=' + urlEncoded + 'api%2Fv2%2Fprojects%2F1234%2Ftasks%2Fqueries%2Fgpx%2F%3Ftasks%3D1%2C2', + '&gpx=' + urlEncoded + 'projects%2F1234%2Ftasks%2Fqueries%2Fgpx%2F%3Ftasks%3D1%2C2', ); }); @@ -103,7 +103,7 @@ describe('test if getIdUrl', () => { '#map=18/-9.663953/120.25684' + '&comment=%23hotosm-project-5522' + '&background=Maxar-Premium' + - '&gpx=' + urlEncoded + 'api%2Fv2%2Fprojects%2F1234%2Ftasks%2Fqueries%2Fgpx%2F%3Ftasks%3D1%2C2', + '&gpx=' + urlEncoded + 'projects%2F1234%2Ftasks%2Fqueries%2Fgpx%2F%3Ftasks%3D1%2C2', ); }); }); From 0d4d47daaae66ef6d86a70a0db59aa08a31bb878 Mon Sep 17 00:00:00 2001 From: JoltCode Date: Wed, 8 Jan 2025 18:44:49 +0000 Subject: [PATCH 10/17] chore(frontend/tests): switch from jsdom to happy-dom --- frontend/package.json | 1 + .../taskSelection/tests/taskStatus.test.jsx | 36 +++++++++---------- .../src/components/user/tests/list.test.jsx | 2 +- frontend/vitest.config.ts | 2 +- frontend/yarn.lock | 18 ++++++++++ 5 files changed, 39 insertions(+), 20 deletions(-) diff --git a/frontend/package.json b/frontend/package.json index f201b52ed7..68419df227 100644 --- a/frontend/package.json +++ b/frontend/package.json @@ -134,6 +134,7 @@ "@vitejs/plugin-react-swc": "^3.7.0", "@vitest/ui": "2.1.8", "combine-react-intl-messages": "^4.0.0", + "happy-dom": "^16.5.2", "msw": "^2.7.0", "prettier": "^2.8.8", "react-scripts": "^5.0.1", diff --git a/frontend/src/components/taskSelection/tests/taskStatus.test.jsx b/frontend/src/components/taskSelection/tests/taskStatus.test.jsx index 5715733dcc..2a73a2c1ca 100644 --- a/frontend/src/components/taskSelection/tests/taskStatus.test.jsx +++ b/frontend/src/components/taskSelection/tests/taskStatus.test.jsx @@ -15,8 +15,8 @@ describe('test correct elements of TaskStatus', () => { ); expect(container.querySelectorAll("span")[0]).toHaveStyle({ backgroundColor: '#fff', - height: '0.875rem', - width: '0.875rem', + height: '14px', + width: '14px', }); expect(container.querySelectorAll("span")[0]).toHaveClass('ba bw1 b--grey-light dib v-mid'); expect(screen.getByText("Locked for mapping by test_user")).toBeInTheDocument(); @@ -32,8 +32,8 @@ describe('test correct elements of TaskStatus', () => { expect(container.querySelector("span")).toHaveStyle({ backgroundColor: '#fff', - height: '0.875rem', - width: '0.875rem', + height: '14px', + width: '14px', }); expect(container.querySelector("span")).toHaveClass( 'ba bw1 b--grey-light dib v-mid', @@ -51,8 +51,8 @@ describe('test correct elements of TaskStatus', () => { expect(container.querySelector("span")).toHaveStyle({ backgroundColor: '#ade6ef', - height: '1rem', - width: '1rem', + height: '16px', + width: '16px', }); expect(container.querySelector("span")).toHaveClass(' dib v-mid'); expect(screen.getByText("Locked for validation by test_user")).toBeInTheDocument(); @@ -68,8 +68,8 @@ describe('test correct elements of TaskStatus', () => { expect(container.querySelector("span")).toHaveStyle({ backgroundColor: '#ade6ef', - height: '1rem', - width: '1rem', + height: '16px', + width: '16px', }); expect(container.querySelector("span")).toHaveClass(' dib v-mid'); expect(screen.getByText(messages.taskStatus_LOCKED_FOR_VALIDATION.defaultMessage)).toBeInTheDocument(); @@ -85,8 +85,8 @@ describe('test correct elements of TaskStatus', () => { expect(container.querySelector("span")).toHaveStyle({ backgroundColor: '#fff', - height: '0.875rem', - width: '0.875rem', + height: '14px', + width: '14px', }); expect(container.querySelector("span")).toHaveClass( 'ba bw1 b--grey-light dib v-mid', @@ -104,8 +104,8 @@ describe('test correct elements of TaskStatus', () => { expect(container.querySelector("span")).toHaveStyle({ backgroundColor: '#ade6ef', - height: '1rem', - width: '1rem', + height: '16px', + width: '16px', }); expect(container.querySelector("span")).toHaveClass(' dib v-mid'); expect(screen.getByText(messages.taskStatus_MAPPED.defaultMessage)).toBeInTheDocument(); @@ -121,8 +121,8 @@ describe('test correct elements of TaskStatus', () => { expect(container.querySelector("span")).toHaveStyle({ backgroundColor: '#40ac8c', - height: '1rem', - width: '1rem', + height: '16px', + width: '16px', }); expect(container.querySelector("span")).toHaveClass(' dib v-mid'); expect(screen.getByText(messages.taskStatus_VALIDATED.defaultMessage)).toBeInTheDocument(); @@ -138,8 +138,8 @@ describe('test correct elements of TaskStatus', () => { expect(container.querySelector("span")).toHaveStyle({ backgroundColor: '#fceca4', - height: '1rem', - width: '1rem', + height: '16px', + width: '16px', }); expect(container.querySelector("span")).toHaveClass(' dib v-mid'); expect(screen.getByText(messages.taskStatus_INVALIDATED.defaultMessage)).toBeInTheDocument(); @@ -155,8 +155,8 @@ describe('test correct elements of TaskStatus', () => { expect(container.querySelector("span")).toHaveStyle({ backgroundColor: '#d8dae4', - height: '1rem', - width: '1rem', + height: '16px', + width: '16px', }); expect(container.querySelector("span")).toHaveClass(' dib v-mid'); expect(screen.getByText(messages.taskStatus_BADIMAGERY.defaultMessage)).toBeInTheDocument(); diff --git a/frontend/src/components/user/tests/list.test.jsx b/frontend/src/components/user/tests/list.test.jsx index 7ba54ad0e6..ab9a594b43 100644 --- a/frontend/src/components/user/tests/list.test.jsx +++ b/frontend/src/components/user/tests/list.test.jsx @@ -33,7 +33,7 @@ describe('User list card', () => { expect(getByText('Shyam')).toBeInTheDocument(); expect(screen.getByText('Shyam').closest('a')).toHaveAttribute('href', '/users/Shyam'); expect(screen.getByTitle(/Ram/i)).toHaveStyle( - `background-image: url(https://www.openstreetmap.org/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaHBBNXQ2Q3c9PSIsImV4cCI6bnVsbCwicHVyIjoiYmxvYl9pZCJ9fQ==--fe41f1b2a5d6cf492a7133f15c81f105dec06ff7/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaDdCem9MWm05eWJXRjBPZ2h3Ym1jNkZISmxjMmw2WlY5MGIxOXNhVzFwZEZzSGFXbHBhUT09IiwiZXhwIjpudWxsLCJwdXIiOiJ2YXJpYXRpb24ifX0=--058ac785867b32287d598a314311e2253bd879a3/unnamed.webp)`, + `background-image: url("https://www.openstreetmap.org/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaHBBNXQ2Q3c9PSIsImV4cCI6bnVsbCwicHVyIjoiYmxvYl9pZCJ9fQ==--fe41f1b2a5d6cf492a7133f15c81f105dec06ff7/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaDdCem9MWm05eWJXRjBPZ2h3Ym1jNkZISmxjMmw2WlY5MGIxOXNhVzFwZEZzSGFXbHBhUT09IiwiZXhwIjpudWxsLCJwdXIiOiJ2YXJpYXRpb24ifX0=--058ac785867b32287d598a314311e2253bd879a3/unnamed.webp")`, ); expect(container.querySelectorAll('svg').length).toBe(2); }); diff --git a/frontend/vitest.config.ts b/frontend/vitest.config.ts index 55f0bfc6a5..ed138e7b65 100644 --- a/frontend/vitest.config.ts +++ b/frontend/vitest.config.ts @@ -8,7 +8,7 @@ export default defineConfig({ globals: true, clearMocks: true, setupFiles: ['./src/setup.ts', './src/network/tests/server.ts'], - environment: "jsdom", + environment: "happy-dom", testTimeout: 20000 }, envPrefix: 'REACT_APP_', diff --git a/frontend/yarn.lock b/frontend/yarn.lock index 97ec9518ef..e24a174350 100644 --- a/frontend/yarn.lock +++ b/frontend/yarn.lock @@ -8057,6 +8057,14 @@ handle-thing@^2.0.0: resolved "https://registry.yarnpkg.com/handle-thing/-/handle-thing-2.0.1.tgz#857f79ce359580c340d43081cc648970d0bb234e" integrity sha512-9Qn4yBxelxoh2Ow62nP+Ka/kMnOXRi8BXnRaUwezLNhqelnN49xKz4F/dPP8OYLxLxq6JDtZb2i9XznUQbNPTg== +happy-dom@^16.5.2: + version "16.5.2" + resolved "https://registry.yarnpkg.com/happy-dom/-/happy-dom-16.5.2.tgz#0521876d462d014f4f42db2ce95bf8096a5ac9e0" + integrity sha512-XWXjbbNjog3Me13Q9FQ5L1D7p4bCUdxrJndLVdsCIsCZgHpKz7HUQzAy+R2TidjKEz2Spe3gaqNpPPxOOkepyg== + dependencies: + webidl-conversions "^7.0.0" + whatwg-mimetype "^3.0.0" + hard-rejection@^2.1.0: version "2.1.0" resolved "https://registry.yarnpkg.com/hard-rejection/-/hard-rejection-2.1.0.tgz#1c6eda5c1685c63942766d79bb40ae773cecd883" @@ -15155,6 +15163,11 @@ webidl-conversions@^6.1.0: resolved "https://registry.yarnpkg.com/webidl-conversions/-/webidl-conversions-6.1.0.tgz#9111b4d7ea80acd40f5270d666621afa78b69514" integrity sha512-qBIvFLGiBpLjfwmYAaHPXsn+ho5xZnGvyGvsarywGNc8VyQJUMHJ8OBKGGrPER0okBeMDaan4mNBlgBROxuI8w== +webidl-conversions@^7.0.0: + version "7.0.0" + resolved "https://registry.yarnpkg.com/webidl-conversions/-/webidl-conversions-7.0.0.tgz#256b4e1882be7debbf01d05f0aa2039778ea080a" + integrity sha512-VwddBukDzu71offAQR975unBIGqfKZpM+8ZX6ySk8nYhVoo5CYaZyzt3YBvYtRtO+aoGlqxPg/B87NGVZ/fu6g== + webpack-dev-middleware@^5.3.4: version "5.3.4" resolved "https://registry.yarnpkg.com/webpack-dev-middleware/-/webpack-dev-middleware-5.3.4.tgz#eb7b39281cbce10e104eb2b8bf2b63fce49a3517" @@ -15296,6 +15309,11 @@ whatwg-mimetype@^2.3.0: resolved "https://registry.yarnpkg.com/whatwg-mimetype/-/whatwg-mimetype-2.3.0.tgz#3d4b1e0312d2079879f826aff18dbeeca5960fbf" integrity sha512-M4yMwr6mAnQz76TbJm914+gPpB/nCwvZbJU28cUD6dR004SAxDLOOSUaB1JDRqLtaOV/vi0IC5lEAGFgrjGv/g== +whatwg-mimetype@^3.0.0: + version "3.0.0" + resolved "https://registry.yarnpkg.com/whatwg-mimetype/-/whatwg-mimetype-3.0.0.tgz#5fa1a7623867ff1af6ca3dc72ad6b8a4208beba7" + integrity sha512-nt+N2dzIutVRxARx1nghPKGv1xHikU7HKdfafKkLNLindmPU/ch3U31NOCGGA/dmPcmb1VlofO0vnKAcsm0o/Q== + whatwg-url@^5.0.0: version "5.0.0" resolved "https://registry.yarnpkg.com/whatwg-url/-/whatwg-url-5.0.0.tgz#966454e8765462e37644d3626f6742ce8b70965d" From d420ceeaae7aaa90370cd429990a558b32e278b4 Mon Sep 17 00:00:00 2001 From: JoltCode Date: Wed, 8 Jan 2025 18:51:59 +0000 Subject: [PATCH 11/17] test fix? --- frontend/src/views/tests/userDetail.test.jsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/frontend/src/views/tests/userDetail.test.jsx b/frontend/src/views/tests/userDetail.test.jsx index 3de4bcc6c6..3a8be8e979 100644 --- a/frontend/src/views/tests/userDetail.test.jsx +++ b/frontend/src/views/tests/userDetail.test.jsx @@ -37,7 +37,7 @@ describe('User Detail Component', () => { store.dispatch({ type: 'SET_TOKEN', token: 'validToken' }); store.dispatch({ type: 'SET_USER_DETAILS', - userDetails: { username: 'user123' }, + userDetails: { username: 'Somebody' }, }); }); From 0a5f9fd04b3bb025cc396b3b7769a2cf2c2ef475 Mon Sep 17 00:00:00 2001 From: JoltCode Date: Wed, 8 Jan 2025 18:55:01 +0000 Subject: [PATCH 12/17] Revert "test fix?" This reverts commit d420ceeaae7aaa90370cd429990a558b32e278b4. --- frontend/src/views/tests/userDetail.test.jsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/frontend/src/views/tests/userDetail.test.jsx b/frontend/src/views/tests/userDetail.test.jsx index 3a8be8e979..3de4bcc6c6 100644 --- a/frontend/src/views/tests/userDetail.test.jsx +++ b/frontend/src/views/tests/userDetail.test.jsx @@ -37,7 +37,7 @@ describe('User Detail Component', () => { store.dispatch({ type: 'SET_TOKEN', token: 'validToken' }); store.dispatch({ type: 'SET_USER_DETAILS', - userDetails: { username: 'Somebody' }, + userDetails: { username: 'user123' }, }); }); From 28723d4efe9e827d7673a2cbc659898be7fb82d8 Mon Sep 17 00:00:00 2001 From: JoltCode Date: Wed, 8 Jan 2025 18:56:45 +0000 Subject: [PATCH 13/17] chore(frontend/tests): remove broken test --- frontend/src/views/tests/userDetail.test.jsx | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/frontend/src/views/tests/userDetail.test.jsx b/frontend/src/views/tests/userDetail.test.jsx index 3de4bcc6c6..a8eb090e7c 100644 --- a/frontend/src/views/tests/userDetail.test.jsx +++ b/frontend/src/views/tests/userDetail.test.jsx @@ -58,7 +58,8 @@ describe('User Detail Component', () => { , ); - expect(await screen.findByText('Somebody')).toBeInTheDocument(); + // TODO: Fix this test + // expect(await screen.findByText('Somebody')).toBeInTheDocument(); expect(screen.getByText(/time spent mapping/i)).toBeInTheDocument(); expect(await screen.findByTitle('American Red Cross')).toBeInTheDocument(); expect(await screen.findByText('Philippines')).toBeInTheDocument(); From 3c528d4912bd9b3a785679812f230cf1c2bbc8f9 Mon Sep 17 00:00:00 2001 From: JoltCode Date: Wed, 8 Jan 2025 19:09:34 +0000 Subject: [PATCH 14/17] fix(frontend/tests): img --- frontend/src/components/user/tests/list.test.jsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/frontend/src/components/user/tests/list.test.jsx b/frontend/src/components/user/tests/list.test.jsx index ab9a594b43..51bc00f88f 100644 --- a/frontend/src/components/user/tests/list.test.jsx +++ b/frontend/src/components/user/tests/list.test.jsx @@ -32,9 +32,9 @@ describe('User list card', () => { expect(getByText('Beginner')).toBeInTheDocument(); expect(getByText('Shyam')).toBeInTheDocument(); expect(screen.getByText('Shyam').closest('a')).toHaveAttribute('href', '/users/Shyam'); - expect(screen.getByTitle(/Ram/i)).toHaveStyle( + expect(container.querySelector("img").toHaveStyle( `background-image: url("https://www.openstreetmap.org/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaHBBNXQ2Q3c9PSIsImV4cCI6bnVsbCwicHVyIjoiYmxvYl9pZCJ9fQ==--fe41f1b2a5d6cf492a7133f15c81f105dec06ff7/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaDdCem9MWm05eWJXRjBPZ2h3Ym1jNkZISmxjMmw2WlY5MGIxOXNhVzFwZEZzSGFXbHBhUT09IiwiZXhwIjpudWxsLCJwdXIiOiJ2YXJpYXRpb24ifX0=--058ac785867b32287d598a314311e2253bd879a3/unnamed.webp")`, - ); + )); expect(container.querySelectorAll('svg').length).toBe(2); }); }); From f560c22ecbaf1845455f7a6a41535846ea86faec Mon Sep 17 00:00:00 2001 From: JoltCode Date: Wed, 8 Jan 2025 19:22:40 +0000 Subject: [PATCH 15/17] fix(frontend/tests): syntax issue --- frontend/src/components/user/tests/list.test.jsx | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/frontend/src/components/user/tests/list.test.jsx b/frontend/src/components/user/tests/list.test.jsx index 51bc00f88f..1d3e383674 100644 --- a/frontend/src/components/user/tests/list.test.jsx +++ b/frontend/src/components/user/tests/list.test.jsx @@ -32,9 +32,10 @@ describe('User list card', () => { expect(getByText('Beginner')).toBeInTheDocument(); expect(getByText('Shyam')).toBeInTheDocument(); expect(screen.getByText('Shyam').closest('a')).toHaveAttribute('href', '/users/Shyam'); - expect(container.querySelector("img").toHaveStyle( + expect(container.querySelector("img")).toHaveStyle( `background-image: url("https://www.openstreetmap.org/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaHBBNXQ2Q3c9PSIsImV4cCI6bnVsbCwicHVyIjoiYmxvYl9pZCJ9fQ==--fe41f1b2a5d6cf492a7133f15c81f105dec06ff7/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaDdCem9MWm05eWJXRjBPZ2h3Ym1jNkZISmxjMmw2WlY5MGIxOXNhVzFwZEZzSGFXbHBhUT09IiwiZXhwIjpudWxsLCJwdXIiOiJ2YXJpYXRpb24ifX0=--058ac785867b32287d598a314311e2253bd879a3/unnamed.webp")`, - )); + ); + expect(container.querySelector('.absolute.bg-red.br-pill.hhalf.hide-child')).toHaveStyle("meow"); expect(container.querySelectorAll('svg').length).toBe(2); }); }); From 5adf96369dfcf63994578517a44e85476e3dfd2a Mon Sep 17 00:00:00 2001 From: JoltCode Date: Wed, 8 Jan 2025 20:04:49 +0000 Subject: [PATCH 16/17] fix(frontend/tests): list test --- frontend/src/components/user/tests/list.test.jsx | 5 +---- 1 file changed, 1 insertion(+), 4 deletions(-) diff --git a/frontend/src/components/user/tests/list.test.jsx b/frontend/src/components/user/tests/list.test.jsx index 1d3e383674..bac19698b6 100644 --- a/frontend/src/components/user/tests/list.test.jsx +++ b/frontend/src/components/user/tests/list.test.jsx @@ -32,10 +32,7 @@ describe('User list card', () => { expect(getByText('Beginner')).toBeInTheDocument(); expect(getByText('Shyam')).toBeInTheDocument(); expect(screen.getByText('Shyam').closest('a')).toHaveAttribute('href', '/users/Shyam'); - expect(container.querySelector("img")).toHaveStyle( - `background-image: url("https://www.openstreetmap.org/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaHBBNXQ2Q3c9PSIsImV4cCI6bnVsbCwicHVyIjoiYmxvYl9pZCJ9fQ==--fe41f1b2a5d6cf492a7133f15c81f105dec06ff7/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaDdCem9MWm05eWJXRjBPZ2h3Ym1jNkZISmxjMmw2WlY5MGIxOXNhVzFwZEZzSGFXbHBhUT09IiwiZXhwIjpudWxsLCJwdXIiOiJ2YXJpYXRpb24ifX0=--058ac785867b32287d598a314311e2253bd879a3/unnamed.webp")`, - ); - expect(container.querySelector('.absolute.bg-red.br-pill.hhalf.hide-child')).toHaveStyle("meow"); + expect(container.querySelector("a").firstChild.style.backgroundImage).toEqual(`url("https://www.openstreetmap.org/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaHBBNXQ2Q3c9PSIsImV4cCI6bnVsbCwicHVyIjoiYmxvYl9pZCJ9fQ==--fe41f1b2a5d6cf492a7133f15c81f105dec06ff7/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaDdCem9MWm05eWJXRjBPZ2h3Ym1jNkZISmxjMmw2WlY5MGIxOXNhVzFwZEZzSGFXbHBhUT09IiwiZXhwIjpudWxsLCJwdXIiOiJ2YXJpYXRpb24ifX0=--058ac785867b32287d598a314311e2253bd879a3/unnamed.webp")`); expect(container.querySelectorAll('svg').length).toBe(2); }); }); From 6dc87621ea9a6189e295729941d85d564ac3cf82 Mon Sep 17 00:00:00 2001 From: JoltCode Date: Wed, 8 Jan 2025 20:25:47 +0000 Subject: [PATCH 17/17] chore(frontend/tests): timeout --- frontend/src/setup.ts | 2 +- frontend/src/views/tests/userDetail.test.jsx | 5 +---- 2 files changed, 2 insertions(+), 5 deletions(-) diff --git a/frontend/src/setup.ts b/frontend/src/setup.ts index 38f0cb9876..2b5426f7ae 100644 --- a/frontend/src/setup.ts +++ b/frontend/src/setup.ts @@ -2,7 +2,7 @@ import '@testing-library/jest-dom/vitest'; import { configure } from '@testing-library/react'; import "vitest-canvas-mock" -configure({ asyncUtilTimeout: 8000 }); +configure({ asyncUtilTimeout: 12000 }); // vi.mock('mapbox-gl/dist/mapbox-gl'); diff --git a/frontend/src/views/tests/userDetail.test.jsx b/frontend/src/views/tests/userDetail.test.jsx index a8eb090e7c..1222ab1d62 100644 --- a/frontend/src/views/tests/userDetail.test.jsx +++ b/frontend/src/views/tests/userDetail.test.jsx @@ -1,7 +1,5 @@ - import { render, screen, act, waitFor } from '@testing-library/react'; import { MemoryRouter, Route, Routes } from 'react-router-dom'; - import { UserDetail } from '../userDetail'; import { store } from '../../store'; import { @@ -58,8 +56,7 @@ describe('User Detail Component', () => { , ); - // TODO: Fix this test - // expect(await screen.findByText('Somebody')).toBeInTheDocument(); + expect(await screen.findByText('Somebody')).toBeInTheDocument(); expect(screen.getByText(/time spent mapping/i)).toBeInTheDocument(); expect(await screen.findByTitle('American Red Cross')).toBeInTheDocument(); expect(await screen.findByText('Philippines')).toBeInTheDocument();