Manual Testing Checklist

A comprehensive step-by-step checklist for manually verifying every feature in the SafeCall web interface. Use this when performing a full application review, after major releases, or when onboarding testers.

Prerequisites

Server Mode (Full SafeCall)

For a complete test, run the server with all features enabled:

"server_features": ["bridge", "safecall"]

"safecall" expands to navigation, alerting, rtls, and sensors. This ensures all UI pages and feature-gated elements are visible.

Required Test Data

Before starting, ensure the system has:

• At least 2 users (1 admin, 1 regular)
• At least 2 locations in a hierarchy (e.g., Building > Floor)
• At least 3 beacons of different types (watch, navigation, sensor)
• At least 2 gateways
• At least 1 map uploaded and assigned to a location
• At least 1 floor with a navigation graph (nodes + edges)
• At least 1 zone drawn on a map with connections
• Some log entries and beacon events in the database

Browser Setup

• Test in Chrome/Chromium (primary target)
• Keep DevTools Console open to catch JavaScript errors
• Test responsive behavior by resizing the window or using DevTools device toolbar

---

1. Login Page

1.1 Page Rendering

• [ ] Page loads with product name in hero section
• [ ] Email and password input fields are visible
• [ ] Login button is visible
• [ ] App version and build date appear in footer

1.2 Authentication

• [ ] Valid login: Enter valid admin credentials → redirects to Dashboard
• [ ] Invalid credentials: Enter wrong password → danger notification appears with error message
• [ ] Empty fields: Submit with empty email/password → appropriate error shown
• [ ] Enter key submission: Type credentials and press Enter → form submits (no need to click the button)

1.3 Error Handling

• [ ] If server is unreachable → notification shows connection error
• [ ] Notification disappears or can be dismissed

---

2. Dashboard

2.1 Page Rendering

• [ ] Dashboard loads after login with all sections visible
• [ ] Page title is set to "Dashboard"

2.2 Navbar (Global — test from Dashboard)

• [ ] All navbar items are present: Dashboard, Locations, Zones, Beacons, Users, Gateways, Maps, Navigation, Gateway ID, Placement Planner, Sensors (if enabled), Logout
• [ ] Dropdown menus: Hover over dropdown parent items (e.g., "RTLS" containing Zones, "Admin" containing Users/Gateways) → child items become visible
• [ ] Each navbar item navigates to its respective page
• [ ] Active state: Current page's navbar item is visually highlighted
• [ ] Logout: Clicking Logout clears session and returns to login page

2.3 Mobile Navbar

• [ ] Resize browser to mobile width (< 1024px)
• [ ] Burger menu icon appears
• [ ] Clicking burger toggles the navbar menu open/closed
• [ ] Dropdown submenus expand on click in mobile mode
• [ ] All navigation items remain accessible in mobile layout

2.4 Status Section

• [ ] MQTT Status button: Click → status tag updates to show Connected (green) or Disconnected (red)
• [ ] KISS Status button: Click → status tag updates accordingly (may show error if KISS not configured)

2.5 Beacon Events Section

• [ ] Events table renders with recent beacon events (if data exists)
• [ ] Export Events button: Click → triggers CSV file download (events.csv)
• [ ] Downloaded CSV contains event data

2.6 Logs Section

• [ ] Recent logs are displayed in a list
• [ ] Log entries show timestamp and message content

2.7 Mobile Access / QR Section

• [ ] Location dropdown is populated with locations from the system
• [ ] Select a location → token dropdown updates with available navigation tokens
• [ ] Create Token button: Click → new token appears in the dropdown
• [ ] Select a token → QR code renders on the canvas
• [ ] QR status label updates

---

3. Locations

3.1 Access Control

• [ ] Admin user can access the page
• [ ] Non-admin user sees a danger notification and no content

3.2 Page Rendering

• [ ] Location tree renders with existing locations
• [ ] Each location shows an icon matching its type (building, floor, department, room, other)
• [ ] "Add New Location", "Save", and "Reset" buttons are visible

3.3 CRUD Operations

• [ ] Add Location: Click "Add New Location" → modal opens with name and type fields
  • [ ] Enter name and select type → click Create → new location appears in tree
  • [ ] Close modal via Cancel button
  • [ ] Close modal via X button
  • [ ] Close modal via Escape key
• [ ] Edit Location: Click the edit icon on a location → inline inputs appear
  • [ ] Change name and/or type → click Save → changes apply in the tree
• [ ] Delete Location: Click the delete icon → location and its children are removed from the tree

3.4 Drag and Drop

• [ ] Drag a location onto another → it becomes a child of the target
• [ ] Drag a location to the "Drop here to make root" zone → it becomes a root-level location
• [ ] Dragging a parent onto its own descendant is prevented (no cycles)

3.5 Save and Reset

• [ ] Save: After making changes, click Save → changes persist (reload page to verify)
• [ ] Reset: After making unsaved changes, click Reset → tree reverts to server state

---

4. Beacons

4.1 Access Control

• [ ] Admin user can access the page

4.2 Page Rendering

• [ ] Beacon table renders with columns: ID, Name, MAC, Type, IP, Send to KISS, Active, Actions
• [ ] Existing beacons appear in the table

4.3 Search

• [ ] Type in the search input → table filters to matching beacons (fuzzy match across name, MAC, etc.)
• [ ] Clear search → full list restores

4.4 Create Beacon

• [ ] Click "New Beacon" → modal opens
• [ ] Fill in required fields (MAC, type, name)
• [ ] Type-dependent fields:
  • [ ] Select type "Watch" or "Panic" → watch/panic-specific fields appear
  • [ ] Select type "Navigation" → navigation fields appear (floor, x, y, uname, rnumber, POI, static)
  • [ ] Select type "Sensor" → sensor fields appear (update interval, humidity/temperature coefficients and ranges)
• [ ] Submit → success notification, table updates with new beacon
• [ ] Close modal via Cancel → no beacon created
• [ ] Close modal via X button → no beacon created
• [ ] Close modal via Escape → no beacon created

4.5 Edit Beacon

• [ ] Click edit icon on a beacon → edit modal opens with pre-filled data
• [ ] Modify fields → save → success notification, table updates
• [ ] Type select is disabled (unless original type was "unknown")

4.6 View Beacon Info

• [ ] Click view icon on a beacon → info modal opens
• [ ] Modal shows beacon details, active flags, and relevant sections based on type
• [ ] Events table: Recent events listed
• [ ] Sightings table: Gateway sightings with MAC, RSSI, time
• [ ] Sensor data table (sensor type only): Type, value, timestamp

4.7 Test Transmit (WebSocket)

In the beacon info modal:

• [ ] Battery test: Click battery test button → response notification appears
• [ ] Sensor test (sensor type): Click sensor test button → response notification
• [ ] Watch/Panic test (watch/panic type): Click test button → response notification

4.8 Delete Beacon

• [ ] Click delete icon → confirmation modal appears
• [ ] Confirm → beacon removed from table
• [ ] Cancel → beacon remains

4.9 Import Beacons

• [ ] Click "Import Beacons" → import runs and shows summary notification with count

---

5. Gateways

5.1 Page Rendering

• [ ] Gateway table renders with columns: ID, MAC, IP, Sticker Name, Location, Room, Tag, Actions
• [ ] Existing gateways appear, sorted by IP

5.2 Create Gateway

• [ ] Click "New Gateway" → modal opens
• [ ] Fill in fields: MAC, MAC2, IP, short name, room, cable, tag, location (dropdown)
• [ ] Submit → success notification, table updates
• [ ] Cancel/X/Escape → no gateway created

5.3 Edit Gateway

• [ ] Click edit icon → edit modal with pre-filled data
• [ ] Modify fields → save → success notification

5.4 Delete Gateway

• [ ] Click delete icon → confirmation modal
• [ ] Confirm → gateway removed

5.5 Import Gateways

• [ ] Click "Import Gateways" → import runs and shows summary notification

---

6. Maps

6.1 Page Rendering

• [ ] Maps overview shows cards for each existing map
• [ ] Each card displays name, location, file path, and Edit/Delete buttons
• [ ] "Create Map" button is visible

6.2 Create Map

• [ ] Click "Create Map" → modal opens
• [ ] Fill in name, select location, choose an image file
• [ ] File name label updates when file is selected
• [ ] Submit → success notification, new map card appears
• [ ] Submit without file → appropriate error
• [ ] Cancel/X/Escape → modal closes without creating

6.3 Edit Map

• [ ] Click "Edit" on a map card → edit modal with pre-filled data
• [ ] Metadata-only update: Change name or location without new file → save → success
• [ ] With new image: Select new file + update metadata → save → success

6.4 Delete Map

• [ ] Click "Delete" on a map card → confirmation modal with map name shown
• [ ] Confirm → map removed from overview
• [ ] Cancel → map remains

---

7. Zones

7.1 Tab Navigation

• [ ] Zones page loads with tabs: Overview, Track, Manage Zones, Debug
• [ ] Clicking each tab switches the visible content
• [ ] Active tab is visually highlighted

7.2 Overview Tab

• [ ] Map listing sidebar shows available maps
• [ ] Clicking a map item loads the zone overview canvas
• [ ] Tracking status: Shows running/stopped indicator with correct icon
• [ ] Algorithm display: Shows current tracking algorithm name
• [ ] Algorithm select: Dropdown populated with available algorithms
• [ ] Start Tracking: Click → tracking starts (status updates to running)
• [ ] Stop Tracking: Click → tracking stops (status updates to stopped)
• [ ] Change Algorithm: Select a different algorithm → click Change → algorithm switches
• [ ] Live overview (requires active tracking + beacons): Canvas shows real-time beacon positions via WebSocket updates

7.3 Manage Zones Tab

Map Management

• [ ] Map listing sidebar shows maps with visible delete buttons
• [ ] "New Map" button opens create map modal (same fields as Maps page)
• [ ] "Edit Map" button is disabled until a map is selected
• [ ] Select a map → "Edit Map" enables → click opens edit modal
• [ ] Delete a map from sidebar → confirmation modal → map removed

Zone Editor Canvas

• [ ] Select a map → editor canvas loads with map image background
• [ ] Toolbar appears with buttons: Reset, Save, New Zone, Add Gateway, visibility/lock toggles

Zone Operations

• [ ] Create Zone: Click "New Zone" → zone form modal opens
  • [ ] Fill in zone name and properties → submit → zone rectangle appears on canvas
  • [ ] Cancel → no zone created
• [ ] Move Zone: Drag a zone rectangle → position updates
• [ ] Resize Zone: Drag corner handles (TL/TR/BR/BL) → zone resizes
• [ ] Edit Zone: Right-click a zone → zone form modal opens with pre-filled data
  • [ ] Modify fields → submit → zone updates on canvas
• [ ] Delete Zone: Click the red X button on a zone → zone removed from canvas
• [ ] Zone Connections:
  • [ ] In zone form modal, select a target zone from the connection dropdown → click Add → connection tag appears
  • [ ] Delete a connection tag → connection removed
  • [ ] Connections display as text overlays on zone rectangles

Gateway Placement

• [ ] Click "Add Gateway" → modal shows list of unassigned gateways
• [ ] Select a gateway → it appears on the canvas as a draggable circle with IP label
• [ ] Drag a gateway → position updates
• [ ] Right-click a gateway on map → gateway removed from map (unassigned)

Toolbar Toggles

• [ ] Toggle Zones Visibility: Click → zones layer shows/hides
• [ ] Toggle Gateways Visibility: Click → gateways layer shows/hides
• [ ] Lock Zones: Click → zone drag/resize/delete handles disappear, interactions disabled
• [ ] Lock Gateways: Click → gateway drag handles disappear

Save and Reset

• [ ] Save: After making changes → click Save → changes persist to server
• [ ] Reset: Click Reset → canvas reloads from server, discarding unsaved changes

7.4 Track Tab

• [ ] Beacon select dropdown populated with active beacons
• [ ] Select a beacon → click "Track" → canvas loads map with beacon's estimated area
• [ ] Live tracking (requires active tracking): Canvas updates in real-time via WebSocket as beacon moves
• [ ] Tracking rectangle updates position and camera follows

7.5 Debug Tab

• [ ] Beacon select dropdown populated with active beacons
• [ ] Select a beacon → click "Debug" → debug panel opens
• [ ] Panel shows: current algorithm, beacon MAC, predictions per second, last prediction
• [ ] Terminal: Streaming log lines appear in the debug terminal via WebSocket
• [ ] Predictions per second counter updates periodically

---

8. Navigation

8.1 Tab Navigation

• [ ] Navigation page loads with tabs: Overview, Floors, Beacons
• [ ] Clicking each tab switches content

8.2 Overview Tab

• [ ] Summary cards display: floor count, total navigation beacons, assigned beacons, total nodes, total edges
• [ ] Values match expected data

8.3 Floors Tab

Floor Management

• [ ] Floor listing sidebar shows existing floors
• [ ] "New Floor" button opens create floor modal
  • [ ] Fill in name, select location, optionally select map → submit → new floor appears in listing
  • [ ] Cancel → no floor created
• [ ] "Edit Floor" button is disabled until a floor is selected
• [ ] Select a floor → "Edit Floor" enables → opens edit modal
  • [ ] Pre-filled with floor data including compass angle and map scale
  • [ ] Modify and save → success notification
• [ ] Delete a floor from listing → confirmation modal → floor removed

Graph Editor Canvas

• [ ] Select a floor → canvas loads with map background, existing nodes, edges, and navigation beacons
• [ ] Graph Tools box appears with tool buttons and calibration inputs

Tool: Select (Default)

• [ ] Click a node → it is selected
• [ ] Drag a node → node moves, connected edges redraw
• [ ] Drag a navigation beacon → beacon moves on canvas

Tool: Add Node

• [ ] Activate "Add Node" tool
• [ ] Click on canvas → new node appears at click position

Tool: Connect

• [ ] Activate "Connect" tool
• [ ] Click one node, then click another → edge created between them with auto-calculated weight
• [ ] Attempting to create a duplicate edge is prevented
• [ ] Right-click a node → node and its edges are deleted

Tool: Ruler

• [ ] Activate "Ruler" tool
• [ ] Click two points on canvas → measurement line with distance label appears

Edge Interaction

• [ ] Right-click an edge → edge is deleted

Calibration

• [ ] Modify compass angle input → value stored for save
• [ ] Modify map scale input → value stored for save

Save and Discard

• [ ] Save Graph: Click → beacon positions, graph (nodes/edges/deletions), and calibration are all saved to server
• [ ] Discard: Click → all unsaved changes are cleared, canvas reloads from server
• [ ] Unsaved changes counter updates as changes are made

8.4 Beacons Tab

• [ ] Table shows navigation beacons with: Name, MAC, Unique Name, Floor, X, Y, POI, Static
• [ ] Data is read-only (no edit controls in this tab)
• [ ] Values match beacons assigned to navigation floors

---

9. Users

9.1 Page Rendering

• [ ] User table renders with columns: ID, Email, Role (Admin/User), Actions
• [ ] Existing users appear in the table
• [ ] The main admin (ID 1) does not have a Delete button

9.2 Create User

• [ ] Click "New User" → modal opens
• [ ] Fill in email, password, repeat password
• [ ] Toggle admin checkbox
• [ ] Submit → success notification, new user appears in table
• [ ] Password mismatch: Enter different passwords → appropriate error
• [ ] Cancel/X/Escape → no user created

9.3 Change Password

• [ ] Click "Change Password" on a user row → modal opens
• [ ] Enter new password and repeat → submit → success notification
• [ ] Password mismatch: Enter different passwords → appropriate error

9.4 Delete User

• [ ] Click "Delete" on a non-admin user → user removed
• [ ] Verify that user ID 1 (main admin) cannot be deleted (no delete button present)

---

10. Sensors

Feature Gated

The Sensors page is only accessible when "sensors" is in the server's feature list. If the Sensors navbar item is not visible, verify server_features includes "sensors" (or "safecall").

10.1 Page Rendering

• [ ] Sensors page loads with Alerts and Charts sections

10.2 Alerts Section

• [ ] Loading indicator appears, then either:
  • [ ] Success notification: "No alerts" (if no alerts)
  • [ ] Table of alerts: beacon name, sensor MAC, type, value, expected range, last occurred

10.3 Charts Section

• [ ] Loading indicator appears, then Chart.js line charts render
• [ ] One chart per sensor type (Temperature, Humidity, Battery)
• [ ] Charts show per-beacon lines with tooltips
• [ ] Legend toggles individual beacon lines on/off

---

11. Gateway ID Tool

11.1 Page Rendering

• [ ] Page loads with scan configuration inputs, results area, and scan history

11.2 Scan Configuration

• [ ] Enter a beacon MAC (without colons)
• [ ] Select scan duration from dropdown (3–30 seconds)
• [ ] Set RSSI cutoff value

11.3 Running a Scan

• [ ] Click "Scan" → button disables, loading state shown
• [ ] Progress bar fills over the scan duration
• [ ] Countdown timer updates
• [ ] WebSocket status indicator shows Connected (green)

11.4 Scan Results

• [ ] After scan completes:
  • [ ] Summary notification showing best gateway (or "no result" if none above cutoff)
  • [ ] Detailed table: Rank, Gateway MAC, IP, Average RSSI, Min, Max, Sample Count
  • [ ] Footer summarizes settings used

11.5 Scan History

• [ ] Each completed scan adds a row: Time, MAC, Settings, Best Gateway, Gateway Count
• [ ] Clear History: Click → history table empties

11.6 WebSocket Status

• [ ] If WebSocket drops → status indicator changes to Disconnected (red)
• [ ] Reconnection attempts show appropriate feedback

---

12. Placement Planner Tool

12.1 Initial State

• [ ] Page shows file upload area and empty state message
• [ ] No canvas or tools visible until a map is uploaded

12.2 Map Upload

• [ ] Select an image file → map loads on canvas
• [ ] Map dimensions display in the info area
• [ ] Scale, mode, areas, actions, export, and stats boxes become visible

12.3 Scale Configuration

• [ ] Enter pixels value → meters value updates proportionally
• [ ] Enter meters value → pixels value updates proportionally
• [ ] Device range circles resize when scale changes

12.4 Planning Mode

• [ ] RTLS mode: Select RTLS radio → RTLS parameter inputs appear (min spacing, max distance)
• [ ] Navigation mode: Select Navigation radio → Navigation parameter inputs appear (min spacing, max distance, range)
• [ ] Device icons change color/label based on mode

12.5 Canvas Tools

Select Tool (Default)

• [ ] Drag devices → they move on canvas
• [ ] Drag usable areas → they move
• [ ] Middle/right-click drag → canvas pans

Add Area Tool

• [ ] Click and drag on canvas → rectangle area drawn
• [ ] Release → area finalized, appears in the areas list with name and meter dimensions
• [ ] Minimum size enforced (very small drags are ignored)

Add Device Tool

• [ ] Click on canvas → device placed at click position

Delete Tool

• [ ] Click on a device → device removed
• [ ] Click on an area → area removed

12.6 Actions

• [ ] Generate: Click → clears existing devices, generates suggested placements based on usable areas and spacing parameters
• [ ] Clear Devices: Click → all devices removed, areas remain
• [ ] Clear All: Click → all devices and areas removed

12.7 Usable Areas List

• [ ] Each area shows name and dimensions in meters
• [ ] Delete button on each area → area removed from list and canvas

12.8 Stats

• [ ] Device count updates as devices are added/removed/generated
• [ ] Area count updates as areas are added/removed

12.9 Export

• [ ] Export Image: Click → PNG file downloads with current canvas view
• [ ] Print: Click → new window opens with rendered image and summary, print dialog triggers

---

13. Cross-Cutting Concerns

13.1 Modal Behavior (All Pages)

Test on any page that has modals (Locations, Beacons, Gateways, Maps, Users, Zones, Navigation):

• [ ] Close via X button: Click the X in the modal header → modal closes
• [ ] Close via Cancel button: Click Cancel in the modal footer → modal closes
• [ ] Close via Escape key: Press Escape → modal closes
• [ ] Draggable modals: Drag the modal by its header handle → modal moves on screen
• [ ] No data loss warning: If a form has unsaved input and modal is closed, no stale data persists when reopening

13.2 Notifications

• [ ] Success notifications: Green notification appears after successful CRUD operations
• [ ] Error notifications: Red notification appears on errors (network, validation, server)
• [ ] Notifications are dismissible or auto-expire

13.3 Responsive Layout

• [ ] Desktop (> 1024px): Full navbar, multi-column layouts
• [ ] Tablet (768–1024px): Layout adjusts, tables may scroll horizontally
• [ ] Mobile (< 768px): Burger menu, stacked layouts, touch-friendly targets

13.4 Canvas Interactions (Zones, Navigation, Placement Planner)

• [ ] Mouse wheel zoom: Scroll to zoom in/out on canvas
• [ ] Pan: Middle-click drag or viewport drag to move the canvas view
• [ ] Touch support: Pinch-to-zoom works on touch devices
• [ ] No page scroll: Mouse wheel over canvas does not scroll the page

13.5 Authentication Persistence

• [ ] Refresh the page while logged in → session persists, returns to Dashboard
• [ ] Close and reopen the browser → session persists via localStorage JWT
• [ ] Token expiration → redirected to login page

13.6 Admin vs Regular User

• [ ] Log in as a regular (non-admin) user
• [ ] Verify that admin-only pages (Locations, Beacons, Gateways, Maps, Zones, Navigation, Users, Sensors) show access denied or are not navigable
• [ ] Dashboard, Gateway ID, and Placement Planner remain accessible

---

14. Feature Flag Variations

14.1 All Features Enabled ("safecall")

• [ ] All navbar items are visible
• [ ] All pages load and function as described above

14.2 Sensors Disabled

Set server_features to exclude "sensors" (e.g., ["navigation", "alerting", "rtls"]):

• [ ] Sensors navbar item is hidden
• [ ] Navigating directly to a sensors-related action shows no content or is blocked

14.3 Minimal Features

Test with only specific features enabled (e.g., ["navigation"] only):

• [ ] Only navigation-related functionality is expected to work end-to-end
• [ ] Other pages may render but dependent API calls may fail gracefully

---

15. WebSocket Features

15.1 Connection Management

• [ ] WebSocket connects on pages that need it (Zones overview/track/debug, Gateway ID, Beacon test sends)
• [ ] Connection established notification appears (where notifications are enabled)
• [ ] If server WebSocket drops, error/close notification appears
• [ ] Reconnection retries with backoff (up to 3 attempts for sends)

15.2 Live Data Streams

• [ ] Zones Overview: Real-time beacon position updates on the overview canvas
• [ ] Zones Track: Live tracking rectangle follows the tracked beacon
• [ ] Zones Debug: Streaming log lines in the debug terminal
• [ ] Gateway ID: Real-time RSSI readings during scan

---

Quick Reference: Page Access Matrix

Page	Requires Login	Requires Admin	Feature Gated
Login	No	No	—
Dashboard	Yes	No	—
Locations	Yes	Yes	—
Beacons	Yes	Yes	—
Gateways	Yes	Yes	—
Maps	Yes	Yes	—
Zones	Yes	Yes	—
Navigation	Yes	Yes	—
Users	Yes	Yes	—
Sensors	Yes	Yes	sensors
Gateway ID	Yes	No	—
Placement Planner	Yes	No	—