diff --git a/editor.planx.uk/src/@planx/components/MapAndLabel/Public/Context.tsx b/editor.planx.uk/src/@planx/components/MapAndLabel/Public/Context.tsx index 2f023e69a2..4c39177df2 100644 --- a/editor.planx.uk/src/@planx/components/MapAndLabel/Public/Context.tsx +++ b/editor.planx.uk/src/@planx/components/MapAndLabel/Public/Context.tsx @@ -83,6 +83,7 @@ export const MapAndLabelProvider: React.FC = ( const mergedProperties = { ...feature.properties, ...values.schemaData[i], + label: `${i + 1}`, }; feature["properties"] = mergedProperties; geojson.features.push(feature); diff --git a/editor.planx.uk/src/@planx/components/MapAndLabel/test/mocks/GenericValues.ts b/editor.planx.uk/src/@planx/components/MapAndLabel/test/mocks/GenericValues.ts index 16c3737b3c..1ee9ab0758 100644 --- a/editor.planx.uk/src/@planx/components/MapAndLabel/test/mocks/GenericValues.ts +++ b/editor.planx.uk/src/@planx/components/MapAndLabel/test/mocks/GenericValues.ts @@ -2,7 +2,7 @@ export type TreeData = { species: string; work: string; justification: string; - urgency: "low" | "moderate" | "high" | "urgenct"; + urgency: "low" | "moderate" | "high" | "urgent"; label: string; }; diff --git a/editor.planx.uk/src/@planx/components/MapAndLabel/test/mocks/Trees.ts b/editor.planx.uk/src/@planx/components/MapAndLabel/test/mocks/Trees.ts index 8d79b1ad1f..abebddd4c4 100644 --- a/editor.planx.uk/src/@planx/components/MapAndLabel/test/mocks/Trees.ts +++ b/editor.planx.uk/src/@planx/components/MapAndLabel/test/mocks/Trees.ts @@ -3,8 +3,8 @@ import { Schema } from "@planx/components/shared/Schema/model"; import { PresentationalProps } from "../../Public"; import { Trees } from "../../schemas/Trees"; import { - previouslySubmittedDoubleData, - previouslySubmittedSingleData, + previouslySubmittedDoubleFeature, + previouslySubmittedSingleFeature, } from "./mockPayload"; const mockTreeSchema: Schema = { @@ -25,12 +25,12 @@ export const props: PresentationalProps = { latitude: 51.5230919, }; -export const previousSingleDataProps: PresentationalProps = { +export const previouslySubmittedSingleFeatureProps: PresentationalProps = { ...props, - previouslySubmittedData: previouslySubmittedSingleData, + previouslySubmittedData: previouslySubmittedSingleFeature, }; -export const previousDoubleDataProps: PresentationalProps = { +export const previouslySubmittedDoubleFeatureProps: PresentationalProps = { ...props, - previouslySubmittedData: previouslySubmittedDoubleData, + previouslySubmittedData: previouslySubmittedDoubleFeature, }; diff --git a/editor.planx.uk/src/@planx/components/MapAndLabel/test/mocks/mockPayload.tsx b/editor.planx.uk/src/@planx/components/MapAndLabel/test/mocks/mockPayload.tsx index fa12d5dc6f..036e7bc719 100644 --- a/editor.planx.uk/src/@planx/components/MapAndLabel/test/mocks/mockPayload.tsx +++ b/editor.planx.uk/src/@planx/components/MapAndLabel/test/mocks/mockPayload.tsx @@ -27,7 +27,7 @@ export const mockSingleFeaturePayload: MockPayload = { }, }; -export const previousMockDoubleFeatureData: MockPayload = { +export const mockDoubleFeaturePayload: MockPayload = { data: { MockFn: { features: [ @@ -53,12 +53,12 @@ export const previousMockDoubleFeatureData: MockPayload = { }, }; -export const previouslySubmittedSingleData: PreviousData = { +export const previouslySubmittedSingleFeature: PreviousData = { auto: false, ...mockSingleFeaturePayload, }; -export const previouslySubmittedDoubleData: PreviousData = { +export const previouslySubmittedDoubleFeature: PreviousData = { auto: false, - ...previousMockDoubleFeatureData, + ...mockDoubleFeaturePayload, }; diff --git a/editor.planx.uk/src/@planx/components/MapAndLabel/test/public.backNavigation.test.tsx b/editor.planx.uk/src/@planx/components/MapAndLabel/test/public.backNavigation.test.tsx index 5e7b52db90..f84e90468a 100644 --- a/editor.planx.uk/src/@planx/components/MapAndLabel/test/public.backNavigation.test.tsx +++ b/editor.planx.uk/src/@planx/components/MapAndLabel/test/public.backNavigation.test.tsx @@ -6,10 +6,10 @@ import { it, vi } from "vitest"; import { Presentational as MapAndLabel } from "../Public"; import { point1, point2, point3 } from "./mocks/geojson"; import { - previousDoubleDataProps, - previousSingleDataProps, + previouslySubmittedDoubleFeatureProps, + previouslySubmittedSingleFeatureProps, } from "./mocks/Trees"; -import { addMultipleFeatures } from "./utils"; +import { addMultipleFeatures, clickContinue } from "./utils"; beforeAll(() => { if (!window.customElements.get("my-map")) { @@ -28,7 +28,7 @@ beforeAll(() => { describe("navigating back after adding single feature", () => { it("shows previously submitted features", async () => { const { getByTestId, queryByRole } = setup( - , + ); const map = getByTestId("map-and-label-map"); @@ -40,18 +40,21 @@ describe("navigating back after adding single feature", () => { const firstTabPanel = getByTestId("vertical-tabpanel-0"); expect(firstTabPanel).toBeVisible(); - // point1 here needs to be reflected in the props you pass in at the start so labels match + // To properly add the features to the map, you need to pass all previous features as well addMultipleFeatures([point1, point2]); const secondTab = queryByRole("tab", { name: /Tree 2/ }); expect(secondTab).toBeVisible(); + + const secondTabPanel = getByTestId("vertical-tabpanel-1"); + expect(secondTabPanel).toBeVisible(); }); }); describe("navigating back after adding two features", () => { it("shows previously submitted features", async () => { const { getByTestId, queryByRole } = setup( - , + ); const map = getByTestId("map-and-label-map"); @@ -65,9 +68,37 @@ describe("navigating back after adding two features", () => { const secondTabPanel = getByTestId("vertical-tabpanel-1"); expect(secondTabPanel).toBeVisible(); + // To properly add the features to the map, you need to pass all previous features as well addMultipleFeatures([point1, point2, point3]); const thirdTab = queryByRole("tab", { name: /Tree 3/ }); expect(thirdTab).toBeVisible(); + + const thirdTabPanel = getByTestId("vertical-tabpanel-2"); + expect(thirdTabPanel).toBeVisible(); + }); + it("should maintain labelling when removing a feature", async () => { + const handleSubmit = vi.fn(); + const { getByRole, user } = setup( + + ); + + const firstTab = getByRole("tab", { name: /Tree 1/ }); + + await user.click(firstTab); + + const removeButton = getByRole("button", { name: /remove/i }); + + await user.click(removeButton); + + await clickContinue(user); + + const output = + handleSubmit.mock.calls[0][0].data.MockFn.features[0].properties.label; + + expect(output).toEqual("1"); }); });