psp-7739 layer test updates.

bcgov · Apr 10, 2024 · c0ae71b · c0ae71b
1 parent 8847346
commit c0ae71b
Show file tree

Hide file tree

Showing 3 changed files with 51 additions and 59 deletions.
diff --git a/source/frontend/src/components/maps/leaflet/Control/LayersControl/LayersControl.test.tsx b/source/frontend/src/components/maps/leaflet/Control/LayersControl/LayersControl.test.tsx
@@ -15,7 +15,7 @@ function Template({ openByDefault = false }) {
   const toggle = () => {
     setOpen(!open);
   };
-  return <LayersControl open={open} onToggle={toggle} />;
+  return <LayersControl onToggle={toggle} />;
 }
 
 function setup(ui = <Template />, setMap = noop) {
@@ -26,18 +26,10 @@ function setup(ui = <Template />, setMap = noop) {
   return {
     ...utils,
     ready: promise,
-    findLayerList: () => document.querySelector('#layersContainer') as HTMLElement,
     findToggleButton: () => document.querySelector('#layersControlButton') as HTMLElement,
   };
 }
 
-function isLayerVisible(key: string, leaflet: any) {
-  return Object.keys(leaflet._layers)
-    .map(k => leaflet._layers[k])
-    .map(x => x.options)
-    .find(options => options?.key === key);
-}
-
 describe('LayersControl View', () => {
   afterEach(cleanup);
 
@@ -52,50 +44,4 @@ describe('LayersControl View', () => {
     const toggleBtn = findToggleButton();
     expect(toggleBtn).toBeInTheDocument();
   });
-
-  it('should be closed by default', async () => {
-    const { ready, findLayerList } = setup();
-    await waitFor(() => ready);
-    const layersContainer = findLayerList();
-    expect(layersContainer).toBeInTheDocument();
-    expect(layersContainer.className).toContain('closed');
-  });
-
-  it('when closed, clicking the button should open the layer list', async () => {
-    const { ready, findLayerList, findToggleButton } = setup();
-    await waitFor(() => ready);
-    // when layer list is closed...
-    const layersContainer = findLayerList();
-    expect(layersContainer).toBeInTheDocument();
-    expect(layersContainer.className).toContain('closed');
-    // clicking the button should open it...
-    const toggleBtn = findToggleButton();
-    await act(async () => userEvent.click(toggleBtn));
-    await waitFor(() => expect(layersContainer.className).not.toContain('closed'));
-  });
-
-  it('when open, clicking the button should close the layers list', async () => {
-    const { ready, findLayerList, findToggleButton } = setup(<Template openByDefault={true} />);
-    await waitFor(() => ready);
-    // when layer list is open...
-    const layersContainer = findLayerList();
-    expect(layersContainer).toBeInTheDocument();
-    expect(layersContainer.className).not.toContain('closed');
-    // clicking the button should close it...
-    const toggleBtn = findToggleButton();
-    await act(async () => userEvent.click(toggleBtn));
-    await waitFor(() => expect(layersContainer.className).toContain('closed'));
-  });
-
-  it('should enable the Parcels layer and disable the Municipality layer by default', async () => {
-    let mapInstance: L.Map | undefined = undefined;
-    function setMap(map: L.Map) {
-      mapInstance = map;
-    }
-    const { ready } = setup(<Template />, setMap);
-    await waitFor(() => ready);
-    await waitFor(() => expect(mapInstance).toBeDefined());
-    expect(isLayerVisible('parcelBoundaries', mapInstance)).toBeDefined();
-    expect(isLayerVisible('municipalities', mapInstance)).toBeUndefined();
-  });
 });
diff --git a/source/frontend/src/features/properties/map/MapContainer.test.tsx b/source/frontend/src/features/properties/map/MapContainer.test.tsx
@@ -80,6 +80,7 @@ jest.mock('react-visibility-sensor', () => {
   exportPropertiesApi: jest.fn(),
   getPropertiesApi: jest.fn(),
   getPropertyConceptWithIdApi: jest.fn(),
+  getPropertyConceptWithPidApi: jest.fn(),
   putPropertyConceptApi: jest.fn(),
 });
 

diff --git a/source/frontend/src/features/properties/map/__snapshots__/MapContainer.test.tsx.snap b/source/frontend/src/features/properties/map/__snapshots__/MapContainer.test.tsx.snap
@@ -1519,7 +1519,7 @@ exports[`MapContainer Renders the map 1`] = `
                   class="c18 text-left col-12"
                 >
                   <div
-                    class="pb-4 row"
+                    class="row"
                   >
                     <div
                       class="col-1"
@@ -1565,7 +1565,7 @@ exports[`MapContainer Renders the map 1`] = `
                     </div>
                   </div>
                   <div
-                    class="pb-4 row"
+                    class="pt-4 row"
                   >
                     <div
                       class="col-1"
@@ -1611,7 +1611,7 @@ exports[`MapContainer Renders the map 1`] = `
                     </div>
                   </div>
                   <div
-                    class="pb-4 row"
+                    class="pt-4 row"
                   >
                     <div
                       class="col-1"
@@ -1657,7 +1657,7 @@ exports[`MapContainer Renders the map 1`] = `
                     </div>
                   </div>
                   <div
-                    class="row"
+                    class="pt-4 row"
                   >
                     <div
                       class="col-1"
@@ -1701,6 +1701,51 @@ exports[`MapContainer Renders the map 1`] = `
                       </span>
                     </div>
                   </div>
+                  <div
+                    class="pt-4 row"
+                  >
+                    <div
+                      class="col-1"
+                    >
+                      <div
+                        class="form-group"
+                      >
+                        <div
+                          class="check-field"
+                        >
+                          <div
+                            class="form-check"
+                          >
+                            <input
+                              class="form-check-input position-static"
+                              id="input-isRetired"
+                              name="isRetired"
+                              type="checkbox"
+                              value="false"
+                            />
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                    <div
+                      class="col-1"
+                    >
+                      <img
+                        class=""
+                        height="36"
+                        src="retired.png"
+                      />
+                    </div>
+                    <div
+                      class="pl-5 col"
+                    >
+                      <span
+                        class="mb-3"
+                      >
+                        Retired
+                      </span>
+                    </div>
+                  </div>
                 </div>
               </div>
             </div>