[MOL-20560][NL] Add new event to location-field

src/__tests__/components/fields/location-field/location-field.spec.tsx

@@ -52,6 +52,7 @@ enum ELocationInputEvents {
 	"SET_CURRENT_LOCATION" = "set-current-location",
 	"GET_CURRENT_LOCATION" = "get-current-location",
 	"MOUNT" = "mount",
+	"SHOW_LOCATION_MODAL_READY" = "show-location-modal-ready",
 	"SHOW_MODAL" = "show-location-modal",
 	"HIDE_MODAL" = "hide-location-modal",
 	"CLICK_EDIT_BUTTON" = "click-edit-button",
@@ -635,6 +636,23 @@ describe("location-input-group", () => {
 		// PostalCodeError
 
 		//Modal Events
+		describe("Show Location Modal Ready events", () => {
+			it("should fire show-location-modal-ready after it is registered", async () => {
+				const handleShowLocationModalReady = jest.fn();
+				renderComponent({
+					eventType: ELocationInputEvents.SHOW_LOCATION_MODAL_READY,
+					eventListener: (formRef) => () => {
+						handleShowLocationModalReady();
+						formRef.dispatchFieldEvent(UI_TYPE, ELocationInputEvents.SHOW_MODAL, COMPONENT_ID);
+					},
+				});
+				await waitFor(() => {
+					expect(handleShowLocationModalReady).toHaveBeenCalled();
+					expect(getLocationModal(true)).toBeInTheDocument();
+				});
+			});
+		});
+
 		describe("Modal events", () => {
 			it("should fire show-location-modal event on showing location modal", async () => {
 				const handleShowReviewModal = jest.fn();

src/components/fields/location-field/location-field.tsx

@@ -59,6 +59,9 @@ export const LocationField = (props: IGenericFieldProps<ILocationFieldSchema>) =
 	useEffect(() => {
 		addFieldEventListener("show-location-modal", id, handleLocationModalShow);
 
+		// Signal that the field has registered its listeners and is ready for external triggers.
+		dispatchFieldEvent("show-location-modal-ready", id);
+
 		return () => {
 			removeFieldEventListener("show-location-modal", id, handleLocationModalShow);
 		};

src/components/fields/location-field/location-modal/location-search/location-search.tsx

@@ -143,7 +143,7 @@ export const LocationSearch = ({
 					latitude: 1.29994179707526,
 					longitude: 103.789404349716,
 					bufferRadius: 1,
-					abortSignal: reverseGeocodeAborter.current.signal,
+					abortSignal: reverseGeocodeAborter.current?.signal,
 					otherFeatures: OneMapBoolean.YES,
 					getToken,
 					headers: mapApiHeaders,

src/components/fields/location-field/types.ts

@@ -96,6 +96,7 @@ export type TSetCurrentLocationDetail = TLocationFieldDetail<ILocationCoord>;
 export type TLocationFieldErrorDetail = TLocationFieldDetail<TErrorType>;
 
 export type TLocationFieldEvents = {
+	"show-location-modal-ready": CustomEvent;
 	"get-current-location": CustomEvent;
 	"set-current-location": CustomEvent<TSetCurrentLocationDetail>;
 	error: CustomEvent<TLocationFieldErrorDetail>;
@@ -116,6 +117,14 @@ export class GeolocationPositionErrorWrapper extends Error {
 // =============================================================================
 // EVENTS (fired from FEE)
 // =============================================================================
+/** fired after the location field registers the `show-location-modal` event listener and is ready for external triggers */
+function locationFieldEvent(
+	uiType: "location-field",
+	type: "show-location-modal-ready",
+	id: string,
+	listener: TFieldEventListener,
+	options?: boolean | AddEventListenerOptions | undefined
+): void;
 /** fired on showing location modal */
 function locationFieldEvent(
 	uiType: "location-field",

src/stories/3-fields/location-field/location-field-events.stories.tsx

@@ -850,3 +850,10 @@ RefreshLocationAndTriggerGetCurrentLocation.args = {
 	label: "Refresh current location and trigger get current location",
 	mapApi: defaultMapApi,
 };
+
+export const ShowLocationModalReady = Template("show-location-modal-ready").bind({});
+ShowLocationModalReady.args = {
+	uiType: "location-field",
+	label: "Show Location Modal Ready",
+	mapApi: defaultMapApi,
+};