Beacon Validator (Future Test)

Purpose

This page will test the navigator.sendBeacon() API for guaranteed data transmission during page unload events. SendBeacon is designed to reliably send analytics data even when the page is being closed or navigated away from.

What Will Be Tested

Beacon API availability in the browser
Data transmission during beforeunload event
Data transmission during page navigation
Beacon payload structure and size limits
Fallback behavior when beacon API is unavailable

Future Implementation

When the ListenLayer tracking script is integrated, this page will include:

      // Future: Initialize ListenLayer tracking

      window._ll = window._ll || {};

      window._ll.track('page_view', { page: 'beacon-validator' });

      // Future: Track form submission with beacon on unload

      window.addEventListener('beforeunload', function() {

        const data = JSON.stringify({

          event: 'form_abandon',

          formId: 'test-form',

          timestamp: Date.now()

        });

        navigator.sendBeacon('/api/events', data);

      });

Expected Behavior (Phase 2)

Form interactions will be tracked in sessionStorage
On page unload, sendBeacon() will transmit the data
Console will log beacon transmission success/failure
Network tab will show the beacon request

Test Form (Non-functional)

This form is a placeholder. In Phase 2, it will track abandonment via sendBeacon().