Improved error message logging in console (#573)

* More verbose error logging

* Test updates

* Slightly up pacakge size limit

* Changeset

* Update tests to use factory functions

* Throw an error rather than returning extraneous info in response

Author: arielsilvestri

.changeset/spotty-files-wave.md

@@ -0,0 +1,5 @@
+---
+'@segment/analytics-next': minor
+---
+
+Enhances console error logging when requests to settings api fail

packages/browser/package.json

@@ -43,7 +43,7 @@
   "size-limit": [
     {
       "path": "dist/umd/index.js",
-      "limit": "25.9 KB"
+      "limit": "25.95 KB"
     }
   ],
   "dependencies": {

packages/browser/src/browser/__tests__/analytics-pre-init.integration.test.ts

@@ -126,7 +126,7 @@ describe('Pre-initialization', () => {
       }
       mockFetchSettingsErrorResponse(err)
       const consoleSpy = jest
-        .spyOn(console, 'warn')
+        .spyOn(console, 'error')
         .mockImplementationOnce(() => {})
       AnalyticsBrowser.load({ writeKey: 'abc' })
       await sleep(500)

packages/browser/src/browser/__tests__/csp-detection.test.ts

@@ -4,6 +4,7 @@ import { LegacySettings } from '..'
 import { onCSPError } from '../../lib/csp-detection'
 import { pWhile } from '../../lib/p-while'
 import { snippet } from '../../tester/__fixtures__/segment-snippet'
+import * as Factory from '../../test-helpers/factories'
 
 const cdnResponse: LegacySettings = {
   integrations: {
@@ -24,9 +25,7 @@ const cdnResponse: LegacySettings = {
   },
 }
 
-const fetchSettings = Promise.resolve({
-  json: () => Promise.resolve(cdnResponse),
-})
+const fetchSettings = Factory.createSuccess(cdnResponse)
 
 jest.mock('unfetch', () => {
   return jest.fn()

packages/browser/src/browser/__tests__/standalone-analytics.test.ts

@@ -6,6 +6,7 @@ import { install, AnalyticsSnippet } from '../standalone-analytics'
 import unfetch from 'unfetch'
 import { PersistedPriorityQueue } from '../../lib/priority-queue/persisted'
 import { sleep } from '../../test-helpers/sleep'
+import * as Factory from '../../test-helpers/factories'
 
 const track = jest.fn()
 const identify = jest.fn()
@@ -32,12 +33,7 @@ jest.mock('@/core/analytics', () => ({
   }),
 }))
 
-const fetchSettings = Promise.resolve({
-  json: () =>
-    Promise.resolve({
-      integrations: {},
-    }),
-})
+const fetchSettings = Factory.createSuccess({ integrations: {} })
 
 jest.mock('unfetch', () => {
   return jest.fn()
@@ -81,6 +77,7 @@ describe('standalone bundle', () => {
     const documentSpy = jest.spyOn(global, 'document', 'get')
 
     jest.spyOn(console, 'warn').mockImplementationOnce(() => {})
+    jest.spyOn(console, 'error').mockImplementationOnce(() => {})
 
     windowSpy.mockImplementation(() => {
       return jsd.window as unknown as Window & typeof globalThis

packages/browser/src/browser/__tests__/standalone-errors.test.ts

@@ -4,6 +4,7 @@ import { snippet } from '../../tester/__fixtures__/segment-snippet'
 import { pWhile } from '../../lib/p-while'
 import unfetch from 'unfetch'
 import { RemoteMetrics } from '../../core/stats/remote-metrics'
+import * as Factory from '../../test-helpers/factories'
 
 const cdnResponse: LegacySettings = {
   integrations: {
@@ -24,9 +25,7 @@ const cdnResponse: LegacySettings = {
   },
 }
 
-const fetchSettings = Promise.resolve({
-  json: () => Promise.resolve(cdnResponse),
-})
+const fetchSettings = Factory.createSuccess(cdnResponse)
 
 jest.mock('unfetch', () => {
   return jest.fn()

packages/browser/src/browser/__tests__/standalone.test.ts

@@ -3,6 +3,7 @@ import unfetch from 'unfetch'
 import { LegacySettings } from '..'
 import { pWhile } from '../../lib/p-while'
 import { snippet } from '../../tester/__fixtures__/segment-snippet'
+import * as Factory from '../../test-helpers/factories'
 
 const cdnResponse: LegacySettings = {
   integrations: {
@@ -23,9 +24,7 @@ const cdnResponse: LegacySettings = {
   },
 }
 
-const fetchSettings = Promise.resolve({
-  json: () => Promise.resolve(cdnResponse),
-})
+const fetchSettings = Factory.createSuccess(cdnResponse)
 
 jest.mock('unfetch', () => {
   return jest.fn()

packages/browser/src/browser/index.ts

@@ -83,9 +83,16 @@ export function loadLegacySettings(
   const baseUrl = cdnURL ?? getCDN()
 
   return fetch(`${baseUrl}/v1/projects/${writeKey}/settings`)
-    .then((res) => res.json())
+    .then((res) => {
+      if (!res.ok) {
+        return res.text().then((errorResponseMessage) => {
+          throw new Error(errorResponseMessage)
+        })
+      }
+      return res.json()
+    })
     .catch((err) => {
-      console.warn('Failed to load settings', err)
+      console.error(err.message)
       throw err
     })
 }

packages/browser/src/plugins/ajs-destination/__tests__/index.test.ts

@@ -9,6 +9,7 @@ import { Plan } from '../../../core/events'
 import { tsubMiddleware } from '../../routing-middleware'
 import { AMPLITUDE_WRITEKEY } from '../../../test-helpers/test-writekeys'
 import { PersistedPriorityQueue } from '../../../lib/priority-queue/persisted'
+import * as Factory from '../../../test-helpers/factories'
 
 const cdnResponse: LegacySettings = {
   integrations: {
@@ -66,9 +67,7 @@ const cdnResponse: LegacySettings = {
   },
 }
 
-const fetchSettings = Promise.resolve({
-  json: () => Promise.resolve(cdnResponse),
-})
+const fetchSettings = Factory.createSuccess(cdnResponse)
 
 jest.mock('unfetch', () => {
   return jest.fn()