Skip push requests when the browser is offline

When `navigator.onLine` reports that the browser is offline, reject
the push in `PushApi#push` before calling the transport. The existing
catch paths in `Appsignal#send` and the `Dispatcher` retry loop treat
this the same as any other push failure, so the span is queued and
the dispatcher keeps backing off until connectivity returns.

This prevents runaway fetch attempts when a flood of errors is
generated without network connectivity, which was observed to crash
browser tabs when combined with `@appsignal/plugin-window-events`.

Fixes: appsignal/support#338

Author: ssh000

packages/javascript/.changesets/fix-skip-requests-when-browser-is-offline.md

@@ -0,0 +1,8 @@
+---
+bump: patch
+type: fix
+---
+
+Skip push requests when the browser is offline.
+
+When `navigator.onLine` reports that the browser is offline, the Push API client no longer attempts to send spans. The request is rejected before hitting the transport, which stops runaway retries that could crash tabs when a flood of errors was produced without connectivity.

packages/javascript/src/__tests__/api.test.ts

@@ -36,5 +36,21 @@ describe("PushApi", () => {
         body: FIXTURE.toJSON()
       })
     })
+
+    it("rejects without making a request when the browser is offline", async () => {
+      Object.defineProperty(window.navigator, "onLine", {
+        configurable: true,
+        get: () => false
+      })
+
+      fetchMock.mockClear()
+      await expect(api.push(FIXTURE)).rejects.toBeUndefined()
+      expect(fetchMock).not.toHaveBeenCalled()
+
+      Object.defineProperty(window.navigator, "onLine", {
+        configurable: true,
+        get: () => true
+      })
+    })
   })
 })

packages/javascript/src/api.ts

@@ -1,4 +1,4 @@
-import { Environment } from "./environment"
+import { Environment, isOffline } from "./environment"
 import { Span } from "./span"
 
 import { XDomainTransport } from "./transports/xdomain"
@@ -38,6 +38,9 @@ export class PushApi {
    * @return  {Promise<Span>}     A single API `Span`
    */
   public async push(span: Span): Promise<Span> {
+    if (isOffline()) {
+      return Promise.reject()
+    }
     await this._transport.send(span.toJSON())
     return span
   }

packages/javascript/src/environment.ts

@@ -114,3 +114,13 @@ export function getGlobalObject<T>(): T {
     ? self
     : {}) as T
 }
+
+/**
+ * Returns `true` when the browser reports itself as offline via
+ * `navigator.onLine`. Falls back to `false` when the property is
+ * unavailable (e.g. in Node) so callers default to attempting a request.
+ */
+export function isOffline(): boolean {
+  const globals = getGlobalObject<any>()
+  return globals.navigator !== undefined && globals.navigator.onLine === false
+}