diff --git a/frontend/app/api_middleware.js b/frontend/app/api_middleware.js index 1846a9dbc..f01f107ec 100644 --- a/frontend/app/api_middleware.js +++ b/frontend/app/api_middleware.js @@ -41,9 +41,9 @@ export default (store) => (next) => (action) => { function parseError(e) { try { - return JSON.parse(e).errors || []; + return [...JSON.parse(e).errors] || []; } catch { - return e; + return Array.isArray(e) ? e : [e]; } } diff --git a/frontend/app/duck/errors.js b/frontend/app/duck/errors.js index 32cbf4c40..624c05633 100644 --- a/frontend/app/duck/errors.js +++ b/frontend/app/duck/errors.js @@ -56,6 +56,7 @@ const initialState = Map({ function reducer(state = initialState, action = {}) { let updError; + console.log(action) switch (action.type) { case EDIT_OPTIONS: return state.mergeIn(["options"], action.instance).set('currentPage', 1); @@ -66,6 +67,8 @@ function reducer(state = initialState, action = {}) { } else { return state.set("instance", ErrorInfo(action.data)); } + case failure(FETCH): + return state.set("instance", ErrorInfo()); case success(FETCH_TRACE): return state.set("instanceTrace", List(action.data.trace)).set('sourcemapUploaded', action.data.sourcemapUploaded); case success(FETCH_LIST): diff --git a/frontend/app/player/web/WebPlayer.ts b/frontend/app/player/web/WebPlayer.ts index 83b82d0b6..ff6d3d0da 100644 --- a/frontend/app/player/web/WebPlayer.ts +++ b/frontend/app/player/web/WebPlayer.ts @@ -26,11 +26,12 @@ export default class WebPlayer extends Player { private targetMarker: TargetMarker constructor(protected wpState: Store, session: any, live: boolean) { + console.log(session.events, session.resources, session.errors) let initialLists = live ? {} : { event: session.events.toJSON(), stack: session.stackEvents.toJSON(), resource: session.resources.toJSON(), // MBTODO: put ResourceTiming in file - exceptions: session.errors.toJSON().map(({ time, errorId, name }: any) => + exceptions: session.errors.map(({ time, errorId, name }: any) => Log({ level: LogLevel.ERROR, value: name, diff --git a/frontend/app/types/session/error.js b/frontend/app/types/session/error.js deleted file mode 100644 index 9b0fcb278..000000000 --- a/frontend/app/types/session/error.js +++ /dev/null @@ -1,32 +0,0 @@ -import Record from 'Types/Record'; - - -function getStck0InfoString(stack) { - const stack0 = stack[0]; - if (!stack0) return ""; - let s = stack0.function || ""; - if (stack0.url) { - s += ` (${stack0.url})`; - } - return s; -} - - -export default Record({ - sessionId: undefined, - messageId: undefined, - timestamp: undefined, - errorId: undefined, - projectId: undefined, - source: undefined, - name: undefined, - message: undefined, - time: undefined, - function: '?', -}, { - fromJS: ({ stack, ...rest }) => ({ - ...rest, - stack0InfoString: getStck0InfoString(stack || []), - function: (stack && stack[0] && stack[0].function) || '?', - }), -}); diff --git a/frontend/app/types/session/error.ts b/frontend/app/types/session/error.ts new file mode 100644 index 000000000..fd66e06a8 --- /dev/null +++ b/frontend/app/types/session/error.ts @@ -0,0 +1,48 @@ +import Record from 'Types/Record'; + +function getStck0InfoString(stack: Stack) { + const stack0 = stack[0]; + if (!stack0) return ""; + let s = stack0.function || ""; + if (stack0.url) { + s += ` (${stack0.url})`; + } + return s; +} + +type Stack = { function: string; url: string}[] + +export interface IError { + sessionId: string + messageId: string + timestamp: number + errorId: string + projectId: string + source: string + name: string + message: string + time: number + function: string + stack: Stack +} + +export default class Error { + sessionId: IError["sessionId"]; + messageId: IError["messageId"]; + timestamp: IError["timestamp"]; + errorId: IError["errorId"]; + projectId: IError["projectId"]; + source: IError["source"]; + name: IError["name"]; + message: IError["message"]; + time: IError["time"]; + function: IError["function"]; + + constructor({ stack, ...rest }: IError) { + Object.assign(this, { + ...rest, + stack0InfoString: getStck0InfoString(stack || []), + function: (stack && stack[0] && stack[0].function) || '?', + }) + } +} diff --git a/frontend/app/types/session/session.ts b/frontend/app/types/session/session.ts index 0f454029e..35206a5a4 100644 --- a/frontend/app/types/session/session.ts +++ b/frontend/app/types/session/session.ts @@ -4,7 +4,7 @@ import { Duration } from 'luxon'; import SessionEvent, { TYPES } from './event'; import StackEvent from './stackEvent'; import Resource from './resource'; -import SessionError from './error'; +import SessionError, { IError } from './error'; import Issue, { IIssue } from './issue'; const HASH_MOD = 1610612741; @@ -90,7 +90,7 @@ export default Record( backendErrors = 0, consoleErrors = 0, projectId, - errors, + errors = [], stackEvents = [], issues = [], sessionId, @@ -124,7 +124,7 @@ export default Record( .concat(List(session.userEvents)) .sortBy((se) => se.timestamp) .map((se) => StackEvent({ ...se, time: se.timestamp - startedAt })); - const exceptions = List(errors).map(SessionError); + const exceptions = (errors as IError[]).map(e => new SessionError(e)); const issuesList = (issues as IIssue[]).map((i, k) => new Issue({ ...i, time: i.timestamp - startedAt, key: k }));