Skip to content

Test: Implement Component: Fleet Manager Vehicle Tracking (Live Map) Updates - #523

Open
AdaBliss wants to merge 1 commit into
SwiftChainn:mainfrom
AdaBliss:test-comp-fleet-tracking
Open

Test: Implement Component: Fleet Manager Vehicle Tracking (Live Map) Updates#523
AdaBliss wants to merge 1 commit into
SwiftChainn:mainfrom
AdaBliss:test-comp-fleet-tracking

Conversation

@AdaBliss

Copy link
Copy Markdown

closes #497

Summary

Adds component tests for the fleet manager live map, covering marker clustering as the manager zooms, live driver telemetry updates, and empty/degenerate data.

While writing these it became clear the behaviour the issue asks to verify did not exist yet: clusterDrivers was always called with a fixed 0.05 degree cell size, so the map produced identical buckets at every zoom level. "Clusters markers when zoomed out" was therefore not observable. This PR makes clustering zoom-aware so the tests assert real behaviour rather than a constant.

Changes

components/fleet/clustering.ts

  • Added cellSizeForZoom(zoom). One Leaflet zoom step halves the ground distance a pixel covers, so the grid cell doubles for every level the user zooms out. That keeps the on-screen distance between merged pins roughly constant.
  • Result is clamped to [0.001, 45] degrees so extreme zooms cannot degenerate into one bucket per driver or a single bucket for the whole world, and a non-finite zoom falls back to the default.
  • Exported DEFAULT_CLUSTER_CELL_SIZE and REFERENCE_ZOOM; clusterDrivers now uses the named constant as its default, so the previous behaviour is unchanged at zoom 6.

components/fleet/FleetMapClient.tsx

  • Extracted a DriverClusterLayer child so useMapEvents can read the Leaflet map from context, and re-bucket on zoomend.
  • The live zoom is read from the map instance until the first zoomend, so a map created at a restored zoom or via fitBounds clusters correctly on first paint.

Test coverage

components/fleet/__tests__/FleetMapClient.test.tsx (19 tests). react-leaflet and leaflet are mocked with lightweight DOM stubs, since jsdom has no layout engine and the real MapContainer cannot mount. The stubs surface the props the component passes down (center, radius, colour) as data attributes, so assertions describe what a fleet manager would see rather than internals. No network, no timers, no real map instance.

  • Base rendering: map shell, OpenStreetMap tile URL, centroid centring, default centre with no drivers, one marker per distant driver.
  • Clustering on zoom: nearby drivers stay separate zoomed in; merge into one 2 drivers marker zoomed out; split apart again on zoom in; drivers in different cities never merge at regional zoom; cluster markers get the larger radius and the cluster colour; cluster sits at the centroid of its members; the layer adopts the map instance zoom on mount.
  • Live updates: re-clusters when a driver location update arrives, adds a marker when a driver comes online, removes markers when the fleet empties, and stays stable when an unrelated driver field changes.
  • Edge cases: empty fleet, drivers sharing an exact position, NaN zoom, and drivers straddling the equator and prime meridian.

components/fleet/__tests__/clustering.test.ts gains 7 cellSizeForZoom cases (reference zoom, doubling out, halving in, monotonicity, clamping, non-finite fallback, and an end-to-end merge/split check).

Verification

  • npx jest components/fleet - 4 suites, 40 tests, all passing.
  • Full suite: 899 -> 876 passing with no new failures; the 21 failing suites on this branch are exactly the 21 already failing on main before this change.
  • npx eslint components/fleet - clean.
  • npx tsc --noEmit - no errors from this change.

Note for the maintainer

main currently fails the CI Type Check and Build Verification steps for an unrelated reason: components/mobile/MobileFooter.tsx landed with its string quotes stripped (line 1 is a backtick-quoted use client, and imports read import React from react), which trips TS1160: Unterminated template literal. It came in with #318 and is present on main independently of this PR, so it will show red here and on every other open PR until it is fixed. I left it alone to keep this PR scoped to the issue; happy to open a separate fix PR if that would help.

…Updates

Add component tests for the fleet manager live map covering marker
clustering, live driver updates and empty states.

Clustering is now zoom-aware: the grid cell size doubles for every zoom
level the manager zooms out, so nearby drivers merge into one cluster
marker instead of rendering as overlapping pins, and split apart again on
zoom in. Previously the cell size was a fixed 0.05 degrees regardless of
zoom, so 'clusters when zoomed out' was not observable behaviour.

- clustering: add cellSizeForZoom() with clamping and non-finite guards
- FleetMapClient: track zoom via useMapEvents and re-bucket on zoomend
- tests: 19 FleetMapClient cases (mocked react-leaflet/leaflet) and 7
  cellSizeForZoom cases
@drips-wave

drips-wave Bot commented Aug 29, 2026

Copy link
Copy Markdown

@AdaBliss Great news! 🎉 Based on an automated assessment of this PR, the linked Wave issue(s) no longer count against your application limits.

You can now already apply to more issues while waiting for a review of this PR. Keep up the great work! 🚀

Learn more about application limits

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[Test] Component: Fleet Manager Vehicle Tracking (Live Map) Updates

1 participant