diff --git a/frontend/app/player/MessageDistributor/managers/DOM/DOMManager.ts b/frontend/app/player/MessageDistributor/managers/DOM/DOMManager.ts index 942b11a88..c15fc5682 100644 --- a/frontend/app/player/MessageDistributor/managers/DOM/DOMManager.ts +++ b/frontend/app/player/MessageDistributor/managers/DOM/DOMManager.ts @@ -51,7 +51,7 @@ export default class DOMManager extends ListWalker { private vRoots: Map = new Map() private activeIframeRoots: Map = new Map() private styleSheets: Map = new Map() - + private upperBodyId: number = -1; private nodeScrollManagers: Map> = new Map() @@ -82,7 +82,7 @@ export default class DOMManager extends ListWalker { if(m.tag === "BODY" && this.upperBodyId === -1) { this.upperBodyId = m.id } - } else if (m.tp === "set_node_attribute" && + } else if (m.tp === "set_node_attribute" && (IGNORED_ATTRS.includes(m.name) || !ATTR_NAME_REGEXP.test(m.name))) { logger.log("Ignorring message: ", m) return; // Ignoring @@ -96,7 +96,7 @@ export default class DOMManager extends ListWalker { } } - // May be make it as a message on message add? + // May be make it as a message on message add? private removeAutocomplete(node: Element): boolean { const tag = node.tagName if ([ "FORM", "TEXTAREA", "SELECT" ].includes(tag)) { @@ -124,7 +124,7 @@ export default class DOMManager extends ListWalker { const pNode = parent.node if ((pNode instanceof HTMLStyleElement) && // TODO: correct ordering OR filter in tracker - pNode.sheet && + pNode.sheet && pNode.sheet.cssRules && pNode.sheet.cssRules.length > 0 && pNode.innerText && @@ -161,7 +161,7 @@ export default class DOMManager extends ListWalker { vDoc.insertChildAt(vn, 0) this.vRoots = new Map([[0, vDoc]]) // watchout: id==0 for both Document and documentElement // this is done for the AdoptedCSS logic - // todo: start from 0 (sync logic with tracker) + // todo: start from 0 (sync logic with tracker) this.stylesManager.reset() this.activeIframeRoots.clear() return @@ -267,6 +267,8 @@ export default class DOMManager extends ListWalker { vn.applyChanges() } return + + // @depricated since 4.0.2 in favor of adopted_ss_insert/delete_rule + add_owner as being common case for StyleSheets case "css_insert_rule": vn = this.vElements.get(msg.id) if (!vn) { logger.error("Node not found", msg); return } @@ -285,6 +287,8 @@ export default class DOMManager extends ListWalker { } vn.onStyleSheet(sheet => deleteRule(sheet, msg)) return + // end @depricated + case "create_i_frame_document": vn = this.vElements.get(msg.frameID) if (!vn) { logger.error("Node not found", msg); return } @@ -332,6 +336,7 @@ export default class DOMManager extends ListWalker { } deleteRule(styleSheet, msg) return + case "adopted_ss_replace": styleSheet = this.styleSheets.get(msg.sheetID) if (!styleSheet) { @@ -343,7 +348,14 @@ export default class DOMManager extends ListWalker { return case "adopted_ss_add_owner": vn = this.vRoots.get(msg.id) - if (!vn) { logger.error("Node not found", msg); return } + if (!vn) { + // non-constructed case + vn = this.vElements.get(msg.id) + if (!vn) { logger.error("Node not found", msg); return } + if (!(vn instanceof VStyleElement)) { logger.error("Non-style owner", msg); return } + this.styleSheets.set(msg.sheetID, vn.node.sheet) + return + } styleSheet = this.styleSheets.get(msg.sheetID) if (!styleSheet) { let context: typeof globalThis @@ -370,11 +382,11 @@ export default class DOMManager extends ListWalker { //@ts-ignore vn.node.adoptedStyleSheets = [...vn.node.adoptedStyleSheets].filter(s => s !== styleSheet) return - } + } } moveReady(t: number): Promise { - // MBTODO (back jump optimisation): + // MBTODO (back jump optimisation): // - store intemediate virtual dom state // - cancel previous moveReady tasks (is it possible?) if new timestamp is less this.moveApply(t, this.applyMessage) // This function autoresets pointer if necessary (better name?) @@ -399,4 +411,4 @@ export default class DOMManager extends ListWalker { }) }) } -} \ No newline at end of file +} diff --git a/frontend/app/player/MessageDistributor/managers/DOM/StylesManager.ts b/frontend/app/player/MessageDistributor/managers/DOM/StylesManager.ts index c6b674c4e..f26d8e5ea 100644 --- a/frontend/app/player/MessageDistributor/managers/DOM/StylesManager.ts +++ b/frontend/app/player/MessageDistributor/managers/DOM/StylesManager.ts @@ -1,9 +1,8 @@ import type StatedScreen from '../../StatedScreen'; -import type { CssInsertRule, CssDeleteRule } from '../../messages'; +import type { CssInsertRule, CssDeleteRule, ReplaceVcss } from '../../messages'; -type CSSRuleMessage = CssInsertRule | CssDeleteRule; +type CSSRuleMessage = CssInsertRule | CssDeleteRule | ReplaceVcss; -import logger from 'App/logger'; import ListWalker from '../ListWalker'; @@ -72,7 +71,7 @@ export default class StylesManager extends ListWalker { private manageRule = (msg: CSSRuleMessage):void => { // if (msg.tp === "css_insert_rule") { // let styleSheet = this.#screen.document.styleSheets[ msg.stylesheetID ]; - // if (!styleSheet) { + // if (!styleSheet) { // logger.log("No stylesheet with corresponding ID found: ", msg) // styleSheet = this.#screen.document.styleSheets[0]; // if (!styleSheet) { @@ -91,9 +90,9 @@ export default class StylesManager extends ListWalker { // if (msg.tp === "css_delete_rule") { // // console.warn('Warning: STYLESHEET_DELETE_RULE msg') // const styleSheet = this.#screen.document.styleSheets[msg.stylesheetID]; - // if (!styleSheet) { + // if (!styleSheet) { // logger.log("No stylesheet with corresponding ID found: ", msg) - // return; + // return; // } // styleSheet.deleteRule(msg.index); // } @@ -103,4 +102,4 @@ export default class StylesManager extends ListWalker { return Promise.all(this.linkLoadPromises) .then(() => this.moveApply(t, this.manageRule)); } -} \ No newline at end of file +} diff --git a/frontend/app/player/MessageDistributor/messages/JSONRawMessageReader.ts b/frontend/app/player/MessageDistributor/messages/JSONRawMessageReader.ts index 0a5677824..33bf9d2c5 100644 --- a/frontend/app/player/MessageDistributor/messages/JSONRawMessageReader.ts +++ b/frontend/app/player/MessageDistributor/messages/JSONRawMessageReader.ts @@ -64,7 +64,7 @@ const resolvers = { ...msg, text: resolveCSS(msg.baseURL, msg.text), tp: "adopted_ss_replace" - }) + }), } as const type ResolvableType = keyof typeof resolvers @@ -84,7 +84,7 @@ export default class JSONRawMessageReader { readMessage(): RawMessage | null { let msg = this.messages.shift() if (!msg) { return null } - const rawMsg = Array.isArray(msg) + const rawMsg = Array.isArray(msg) ? translate(msg) : legacyTranslate(msg) if (!rawMsg) { @@ -97,4 +97,4 @@ export default class JSONRawMessageReader { return rawMsg } -} \ No newline at end of file +} diff --git a/frontend/app/player/MessageDistributor/messages/RawMessageReader.ts b/frontend/app/player/MessageDistributor/messages/RawMessageReader.ts index d925d8bcc..f459c9369 100644 --- a/frontend/app/player/MessageDistributor/messages/RawMessageReader.ts +++ b/frontend/app/player/MessageDistributor/messages/RawMessageReader.ts @@ -1,4 +1,5 @@ // Auto-generated, do not edit +/* eslint-disable */ import PrimitiveReader from './PrimitiveReader' import type { RawMessage } from './raw' @@ -18,50 +19,50 @@ export default class RawMessageReader extends PrimitiveReader { switch (tp) { case 0: { - const timestamp = this.readUint(); if (timestamp === null) { return resetPointer() } + const timestamp = this.readUint(); if (timestamp === null) { return resetPointer() } return { - tp: "timestamp", - timestamp, + tp: "timestamp", + timestamp, }; } case 4: { const url = this.readString(); if (url === null) { return resetPointer() } const referrer = this.readString(); if (referrer === null) { return resetPointer() } - const navigationStart = this.readUint(); if (navigationStart === null) { return resetPointer() } + const navigationStart = this.readUint(); if (navigationStart === null) { return resetPointer() } return { - tp: "set_page_location", + tp: "set_page_location", url, referrer, - navigationStart, + navigationStart, }; } case 5: { const width = this.readUint(); if (width === null) { return resetPointer() } - const height = this.readUint(); if (height === null) { return resetPointer() } + const height = this.readUint(); if (height === null) { return resetPointer() } return { - tp: "set_viewport_size", + tp: "set_viewport_size", width, - height, + height, }; } case 6: { const x = this.readInt(); if (x === null) { return resetPointer() } - const y = this.readInt(); if (y === null) { return resetPointer() } + const y = this.readInt(); if (y === null) { return resetPointer() } return { - tp: "set_viewport_scroll", + tp: "set_viewport_scroll", x, - y, + y, }; } case 7: { - + return { - tp: "create_document", - + tp: "create_document", + }; } @@ -70,164 +71,164 @@ export default class RawMessageReader extends PrimitiveReader { const parentID = this.readUint(); if (parentID === null) { return resetPointer() } const index = this.readUint(); if (index === null) { return resetPointer() } const tag = this.readString(); if (tag === null) { return resetPointer() } - const svg = this.readBoolean(); if (svg === null) { return resetPointer() } + const svg = this.readBoolean(); if (svg === null) { return resetPointer() } return { - tp: "create_element_node", + tp: "create_element_node", id, parentID, index, tag, - svg, + svg, }; } case 9: { const id = this.readUint(); if (id === null) { return resetPointer() } const parentID = this.readUint(); if (parentID === null) { return resetPointer() } - const index = this.readUint(); if (index === null) { return resetPointer() } + const index = this.readUint(); if (index === null) { return resetPointer() } return { - tp: "create_text_node", + tp: "create_text_node", id, parentID, - index, + index, }; } case 10: { const id = this.readUint(); if (id === null) { return resetPointer() } const parentID = this.readUint(); if (parentID === null) { return resetPointer() } - const index = this.readUint(); if (index === null) { return resetPointer() } + const index = this.readUint(); if (index === null) { return resetPointer() } return { - tp: "move_node", + tp: "move_node", id, parentID, - index, + index, }; } case 11: { - const id = this.readUint(); if (id === null) { return resetPointer() } + const id = this.readUint(); if (id === null) { return resetPointer() } return { - tp: "remove_node", - id, + tp: "remove_node", + id, }; } case 12: { const id = this.readUint(); if (id === null) { return resetPointer() } const name = this.readString(); if (name === null) { return resetPointer() } - const value = this.readString(); if (value === null) { return resetPointer() } + const value = this.readString(); if (value === null) { return resetPointer() } return { - tp: "set_node_attribute", + tp: "set_node_attribute", id, name, - value, + value, }; } case 13: { const id = this.readUint(); if (id === null) { return resetPointer() } - const name = this.readString(); if (name === null) { return resetPointer() } + const name = this.readString(); if (name === null) { return resetPointer() } return { - tp: "remove_node_attribute", + tp: "remove_node_attribute", id, - name, + name, }; } case 14: { const id = this.readUint(); if (id === null) { return resetPointer() } - const data = this.readString(); if (data === null) { return resetPointer() } + const data = this.readString(); if (data === null) { return resetPointer() } return { - tp: "set_node_data", + tp: "set_node_data", id, - data, + data, }; } case 15: { const id = this.readUint(); if (id === null) { return resetPointer() } - const data = this.readString(); if (data === null) { return resetPointer() } + const data = this.readString(); if (data === null) { return resetPointer() } return { - tp: "set_css_data", + tp: "set_css_data", id, - data, + data, }; } case 16: { const id = this.readUint(); if (id === null) { return resetPointer() } const x = this.readInt(); if (x === null) { return resetPointer() } - const y = this.readInt(); if (y === null) { return resetPointer() } + const y = this.readInt(); if (y === null) { return resetPointer() } return { - tp: "set_node_scroll", + tp: "set_node_scroll", id, x, - y, + y, }; } case 18: { const id = this.readUint(); if (id === null) { return resetPointer() } const value = this.readString(); if (value === null) { return resetPointer() } - const mask = this.readInt(); if (mask === null) { return resetPointer() } + const mask = this.readInt(); if (mask === null) { return resetPointer() } return { - tp: "set_input_value", + tp: "set_input_value", id, value, - mask, + mask, }; } case 19: { const id = this.readUint(); if (id === null) { return resetPointer() } - const checked = this.readBoolean(); if (checked === null) { return resetPointer() } + const checked = this.readBoolean(); if (checked === null) { return resetPointer() } return { - tp: "set_input_checked", + tp: "set_input_checked", id, - checked, + checked, }; } case 20: { const x = this.readUint(); if (x === null) { return resetPointer() } - const y = this.readUint(); if (y === null) { return resetPointer() } + const y = this.readUint(); if (y === null) { return resetPointer() } return { - tp: "mouse_move", + tp: "mouse_move", x, - y, + y, }; } case 22: { const level = this.readString(); if (level === null) { return resetPointer() } - const value = this.readString(); if (value === null) { return resetPointer() } + const value = this.readString(); if (value === null) { return resetPointer() } return { - tp: "console_log", + tp: "console_log", level, - value, + value, }; } case 37: { const id = this.readUint(); if (id === null) { return resetPointer() } const rule = this.readString(); if (rule === null) { return resetPointer() } - const index = this.readUint(); if (index === null) { return resetPointer() } + const index = this.readUint(); if (index === null) { return resetPointer() } return { - tp: "css_insert_rule", + tp: "css_insert_rule", id, rule, - index, + index, }; } case 38: { const id = this.readUint(); if (id === null) { return resetPointer() } - const index = this.readUint(); if (index === null) { return resetPointer() } + const index = this.readUint(); if (index === null) { return resetPointer() } return { - tp: "css_delete_rule", + tp: "css_delete_rule", id, - index, + index, }; } @@ -238,16 +239,16 @@ export default class RawMessageReader extends PrimitiveReader { const response = this.readString(); if (response === null) { return resetPointer() } const status = this.readUint(); if (status === null) { return resetPointer() } const timestamp = this.readUint(); if (timestamp === null) { return resetPointer() } - const duration = this.readUint(); if (duration === null) { return resetPointer() } + const duration = this.readUint(); if (duration === null) { return resetPointer() } return { - tp: "fetch", + tp: "fetch", method, url, request, response, status, timestamp, - duration, + duration, }; } @@ -255,67 +256,67 @@ export default class RawMessageReader extends PrimitiveReader { const name = this.readString(); if (name === null) { return resetPointer() } const duration = this.readUint(); if (duration === null) { return resetPointer() } const args = this.readString(); if (args === null) { return resetPointer() } - const result = this.readString(); if (result === null) { return resetPointer() } + const result = this.readString(); if (result === null) { return resetPointer() } return { - tp: "profiler", + tp: "profiler", name, duration, args, - result, + result, }; } case 41: { const key = this.readString(); if (key === null) { return resetPointer() } - const value = this.readString(); if (value === null) { return resetPointer() } + const value = this.readString(); if (value === null) { return resetPointer() } return { - tp: "o_table", + tp: "o_table", key, - value, + value, }; } case 44: { const action = this.readString(); if (action === null) { return resetPointer() } const state = this.readString(); if (state === null) { return resetPointer() } - const duration = this.readUint(); if (duration === null) { return resetPointer() } + const duration = this.readUint(); if (duration === null) { return resetPointer() } return { - tp: "redux", + tp: "redux", action, state, - duration, + duration, }; } case 45: { const mutation = this.readString(); if (mutation === null) { return resetPointer() } - const state = this.readString(); if (state === null) { return resetPointer() } + const state = this.readString(); if (state === null) { return resetPointer() } return { - tp: "vuex", + tp: "vuex", mutation, - state, + state, }; } case 46: { const type = this.readString(); if (type === null) { return resetPointer() } - const payload = this.readString(); if (payload === null) { return resetPointer() } + const payload = this.readString(); if (payload === null) { return resetPointer() } return { - tp: "mob_x", + tp: "mob_x", type, - payload, + payload, }; } case 47: { const action = this.readString(); if (action === null) { return resetPointer() } const state = this.readString(); if (state === null) { return resetPointer() } - const duration = this.readUint(); if (duration === null) { return resetPointer() } + const duration = this.readUint(); if (duration === null) { return resetPointer() } return { - tp: "ng_rx", + tp: "ng_rx", action, state, - duration, + duration, }; } @@ -323,13 +324,13 @@ export default class RawMessageReader extends PrimitiveReader { const operationKind = this.readString(); if (operationKind === null) { return resetPointer() } const operationName = this.readString(); if (operationName === null) { return resetPointer() } const variables = this.readString(); if (variables === null) { return resetPointer() } - const response = this.readString(); if (response === null) { return resetPointer() } + const response = this.readString(); if (response === null) { return resetPointer() } return { - tp: "graph_ql", + tp: "graph_ql", operationKind, operationName, variables, - response, + response, }; } @@ -337,31 +338,31 @@ export default class RawMessageReader extends PrimitiveReader { const frames = this.readInt(); if (frames === null) { return resetPointer() } const ticks = this.readInt(); if (ticks === null) { return resetPointer() } const totalJSHeapSize = this.readUint(); if (totalJSHeapSize === null) { return resetPointer() } - const usedJSHeapSize = this.readUint(); if (usedJSHeapSize === null) { return resetPointer() } + const usedJSHeapSize = this.readUint(); if (usedJSHeapSize === null) { return resetPointer() } return { - tp: "performance_track", + tp: "performance_track", frames, ticks, totalJSHeapSize, - usedJSHeapSize, + usedJSHeapSize, }; } case 54: { const downlink = this.readUint(); if (downlink === null) { return resetPointer() } - const type = this.readString(); if (type === null) { return resetPointer() } + const type = this.readString(); if (type === null) { return resetPointer() } return { - tp: "connection_information", + tp: "connection_information", downlink, - type, + type, }; } case 55: { - const hidden = this.readBoolean(); if (hidden === null) { return resetPointer() } + const hidden = this.readBoolean(); if (hidden === null) { return resetPointer() } return { - tp: "set_page_visibility", - hidden, + tp: "set_page_visibility", + hidden, }; } @@ -372,16 +373,16 @@ export default class RawMessageReader extends PrimitiveReader { const containerType = this.readUint(); if (containerType === null) { return resetPointer() } const containerSrc = this.readString(); if (containerSrc === null) { return resetPointer() } const containerId = this.readString(); if (containerId === null) { return resetPointer() } - const containerName = this.readString(); if (containerName === null) { return resetPointer() } + const containerName = this.readString(); if (containerName === null) { return resetPointer() } return { - tp: "long_task", + tp: "long_task", timestamp, duration, context, containerType, containerSrc, containerId, - containerName, + containerName, }; } @@ -389,25 +390,25 @@ export default class RawMessageReader extends PrimitiveReader { const id = this.readUint(); if (id === null) { return resetPointer() } const name = this.readString(); if (name === null) { return resetPointer() } const value = this.readString(); if (value === null) { return resetPointer() } - const baseURL = this.readString(); if (baseURL === null) { return resetPointer() } + const baseURL = this.readString(); if (baseURL === null) { return resetPointer() } return { - tp: "set_node_attribute_url_based", + tp: "set_node_attribute_url_based", id, name, value, - baseURL, + baseURL, }; } case 61: { const id = this.readUint(); if (id === null) { return resetPointer() } const data = this.readString(); if (data === null) { return resetPointer() } - const baseURL = this.readString(); if (baseURL === null) { return resetPointer() } + const baseURL = this.readString(); if (baseURL === null) { return resetPointer() } return { - tp: "set_css_data_url_based", + tp: "set_css_data_url_based", id, data, - baseURL, + baseURL, }; } @@ -415,13 +416,13 @@ export default class RawMessageReader extends PrimitiveReader { const id = this.readUint(); if (id === null) { return resetPointer() } const rule = this.readString(); if (rule === null) { return resetPointer() } const index = this.readUint(); if (index === null) { return resetPointer() } - const baseURL = this.readString(); if (baseURL === null) { return resetPointer() } + const baseURL = this.readString(); if (baseURL === null) { return resetPointer() } return { - tp: "css_insert_rule_url_based", + tp: "css_insert_rule_url_based", id, rule, index, - baseURL, + baseURL, }; } @@ -429,45 +430,45 @@ export default class RawMessageReader extends PrimitiveReader { const id = this.readUint(); if (id === null) { return resetPointer() } const hesitationTime = this.readUint(); if (hesitationTime === null) { return resetPointer() } const label = this.readString(); if (label === null) { return resetPointer() } - const selector = this.readString(); if (selector === null) { return resetPointer() } + const selector = this.readString(); if (selector === null) { return resetPointer() } return { - tp: "mouse_click", + tp: "mouse_click", id, hesitationTime, label, - selector, + selector, }; } case 70: { const frameID = this.readUint(); if (frameID === null) { return resetPointer() } - const id = this.readUint(); if (id === null) { return resetPointer() } + const id = this.readUint(); if (id === null) { return resetPointer() } return { - tp: "create_i_frame_document", + tp: "create_i_frame_document", frameID, - id, + id, }; } case 71: { const sheetID = this.readUint(); if (sheetID === null) { return resetPointer() } const text = this.readString(); if (text === null) { return resetPointer() } - const baseURL = this.readString(); if (baseURL === null) { return resetPointer() } + const baseURL = this.readString(); if (baseURL === null) { return resetPointer() } return { - tp: "adopted_ss_replace_url_based", + tp: "adopted_ss_replace_url_based", sheetID, text, - baseURL, + baseURL, }; } case 72: { const sheetID = this.readUint(); if (sheetID === null) { return resetPointer() } - const text = this.readString(); if (text === null) { return resetPointer() } + const text = this.readString(); if (text === null) { return resetPointer() } return { - tp: "adopted_ss_replace", + tp: "adopted_ss_replace", sheetID, - text, + text, }; } @@ -475,65 +476,65 @@ export default class RawMessageReader extends PrimitiveReader { const sheetID = this.readUint(); if (sheetID === null) { return resetPointer() } const rule = this.readString(); if (rule === null) { return resetPointer() } const index = this.readUint(); if (index === null) { return resetPointer() } - const baseURL = this.readString(); if (baseURL === null) { return resetPointer() } + const baseURL = this.readString(); if (baseURL === null) { return resetPointer() } return { - tp: "adopted_ss_insert_rule_url_based", + tp: "adopted_ss_insert_rule_url_based", sheetID, rule, index, - baseURL, + baseURL, }; } case 74: { const sheetID = this.readUint(); if (sheetID === null) { return resetPointer() } const rule = this.readString(); if (rule === null) { return resetPointer() } - const index = this.readUint(); if (index === null) { return resetPointer() } + const index = this.readUint(); if (index === null) { return resetPointer() } return { - tp: "adopted_ss_insert_rule", + tp: "adopted_ss_insert_rule", sheetID, rule, - index, + index, }; } case 75: { const sheetID = this.readUint(); if (sheetID === null) { return resetPointer() } - const index = this.readUint(); if (index === null) { return resetPointer() } + const index = this.readUint(); if (index === null) { return resetPointer() } return { - tp: "adopted_ss_delete_rule", + tp: "adopted_ss_delete_rule", sheetID, - index, + index, }; } case 76: { const sheetID = this.readUint(); if (sheetID === null) { return resetPointer() } - const id = this.readUint(); if (id === null) { return resetPointer() } + const id = this.readUint(); if (id === null) { return resetPointer() } return { - tp: "adopted_ss_add_owner", + tp: "adopted_ss_add_owner", sheetID, - id, + id, }; } case 77: { const sheetID = this.readUint(); if (sheetID === null) { return resetPointer() } - const id = this.readUint(); if (id === null) { return resetPointer() } + const id = this.readUint(); if (id === null) { return resetPointer() } return { - tp: "adopted_ss_remove_owner", + tp: "adopted_ss_remove_owner", sheetID, - id, + id, }; } case 79: { const mutation = this.readString(); if (mutation === null) { return resetPointer() } - const state = this.readString(); if (state === null) { return resetPointer() } + const state = this.readString(); if (state === null) { return resetPointer() } return { - tp: "zustand", + tp: "zustand", mutation, - state, + state, }; } @@ -547,9 +548,9 @@ export default class RawMessageReader extends PrimitiveReader { const userOSVersion = this.readString(); if (userOSVersion === null) { return resetPointer() } const userDevice = this.readString(); if (userDevice === null) { return resetPointer() } const userDeviceType = this.readString(); if (userDeviceType === null) { return resetPointer() } - const userCountry = this.readString(); if (userCountry === null) { return resetPointer() } + const userCountry = this.readString(); if (userCountry === null) { return resetPointer() } return { - tp: "ios_session_start", + tp: "ios_session_start", timestamp, projectID, trackerVersion, @@ -559,7 +560,7 @@ export default class RawMessageReader extends PrimitiveReader { userOSVersion, userDevice, userDeviceType, - userCountry, + userCountry, }; } @@ -567,13 +568,13 @@ export default class RawMessageReader extends PrimitiveReader { const timestamp = this.readUint(); if (timestamp === null) { return resetPointer() } const length = this.readUint(); if (length === null) { return resetPointer() } const name = this.readString(); if (name === null) { return resetPointer() } - const payload = this.readString(); if (payload === null) { return resetPointer() } + const payload = this.readString(); if (payload === null) { return resetPointer() } return { - tp: "ios_custom_event", + tp: "ios_custom_event", timestamp, length, name, - payload, + payload, }; } @@ -583,15 +584,15 @@ export default class RawMessageReader extends PrimitiveReader { const x = this.readUint(); if (x === null) { return resetPointer() } const y = this.readUint(); if (y === null) { return resetPointer() } const width = this.readUint(); if (width === null) { return resetPointer() } - const height = this.readUint(); if (height === null) { return resetPointer() } + const height = this.readUint(); if (height === null) { return resetPointer() } return { - tp: "ios_screen_changes", + tp: "ios_screen_changes", timestamp, length, x, y, width, - height, + height, }; } @@ -600,14 +601,14 @@ export default class RawMessageReader extends PrimitiveReader { const length = this.readUint(); if (length === null) { return resetPointer() } const label = this.readString(); if (label === null) { return resetPointer() } const x = this.readUint(); if (x === null) { return resetPointer() } - const y = this.readUint(); if (y === null) { return resetPointer() } + const y = this.readUint(); if (y === null) { return resetPointer() } return { - tp: "ios_click_event", + tp: "ios_click_event", timestamp, length, label, x, - y, + y, }; } @@ -615,13 +616,13 @@ export default class RawMessageReader extends PrimitiveReader { const timestamp = this.readUint(); if (timestamp === null) { return resetPointer() } const length = this.readUint(); if (length === null) { return resetPointer() } const name = this.readString(); if (name === null) { return resetPointer() } - const value = this.readUint(); if (value === null) { return resetPointer() } + const value = this.readUint(); if (value === null) { return resetPointer() } return { - tp: "ios_performance_event", + tp: "ios_performance_event", timestamp, length, name, - value, + value, }; } @@ -629,13 +630,13 @@ export default class RawMessageReader extends PrimitiveReader { const timestamp = this.readUint(); if (timestamp === null) { return resetPointer() } const length = this.readUint(); if (length === null) { return resetPointer() } const severity = this.readString(); if (severity === null) { return resetPointer() } - const content = this.readString(); if (content === null) { return resetPointer() } + const content = this.readString(); if (content === null) { return resetPointer() } return { - tp: "ios_log", + tp: "ios_log", timestamp, length, severity, - content, + content, }; } @@ -648,9 +649,9 @@ export default class RawMessageReader extends PrimitiveReader { const url = this.readString(); if (url === null) { return resetPointer() } const success = this.readBoolean(); if (success === null) { return resetPointer() } const method = this.readString(); if (method === null) { return resetPointer() } - const status = this.readUint(); if (status === null) { return resetPointer() } + const status = this.readUint(); if (status === null) { return resetPointer() } return { - tp: "ios_network_call", + tp: "ios_network_call", timestamp, length, duration, @@ -659,7 +660,7 @@ export default class RawMessageReader extends PrimitiveReader { url, success, method, - status, + status, }; } diff --git a/frontend/app/player/MessageDistributor/messages/message.ts b/frontend/app/player/MessageDistributor/messages/message.ts index 397bbfaa4..4b82c27e7 100644 --- a/frontend/app/player/MessageDistributor/messages/message.ts +++ b/frontend/app/player/MessageDistributor/messages/message.ts @@ -1,8 +1,9 @@ // Auto-generated, do not edit +/* eslint-disable */ import type { Timed } from './timed' import type { RawMessage } from './raw' -import type { +import type { RawTimestamp, RawSetPageLocation, RawSetViewportSize, @@ -163,3 +164,4 @@ export type IosPerformanceEvent = RawIosPerformanceEvent & Timed export type IosLog = RawIosLog & Timed export type IosNetworkCall = RawIosNetworkCall & Timed + diff --git a/frontend/app/player/MessageDistributor/messages/raw.ts b/frontend/app/player/MessageDistributor/messages/raw.ts index c7a133440..69ef5877f 100644 --- a/frontend/app/player/MessageDistributor/messages/raw.ts +++ b/frontend/app/player/MessageDistributor/messages/raw.ts @@ -1,4 +1,5 @@ // Auto-generated, do not edit +/* eslint-disable */ export interface RawTimestamp { diff --git a/frontend/app/player/MessageDistributor/messages/tracker-legacy.ts b/frontend/app/player/MessageDistributor/messages/tracker-legacy.ts index 088731bbc..1cc6af93d 100644 --- a/frontend/app/player/MessageDistributor/messages/tracker-legacy.ts +++ b/frontend/app/player/MessageDistributor/messages/tracker-legacy.ts @@ -1,4 +1,5 @@ // @ts-nocheck +/* eslint-disable */ // Auto-generated, do not edit export const TP_MAP = { @@ -69,5 +70,3 @@ export const TP_MAP = { 103: "ios_log", 105: "ios_network_call", } as const - - diff --git a/frontend/app/player/MessageDistributor/messages/tracker.ts b/frontend/app/player/MessageDistributor/messages/tracker.ts index 865b0ce11..7381670c7 100644 --- a/frontend/app/player/MessageDistributor/messages/tracker.ts +++ b/frontend/app/player/MessageDistributor/messages/tracker.ts @@ -1,6 +1,7 @@ // Auto-generated, do not edit +/* eslint-disable */ -import type { RawMessage } from './raw' +import type { RawMessage } from './raw' type TrBatchMetadata = [ @@ -396,14 +397,14 @@ export default function translate(tMsg: TrackerMessage): RawMessage | null { case 0: { return { - tp: "timestamp", + tp: "timestamp", timestamp: tMsg[1], } } case 4: { return { - tp: "set_page_location", + tp: "set_page_location", url: tMsg[1], referrer: tMsg[2], navigationStart: tMsg[3], @@ -412,7 +413,7 @@ export default function translate(tMsg: TrackerMessage): RawMessage | null { case 5: { return { - tp: "set_viewport_size", + tp: "set_viewport_size", width: tMsg[1], height: tMsg[2], } @@ -420,7 +421,7 @@ export default function translate(tMsg: TrackerMessage): RawMessage | null { case 6: { return { - tp: "set_viewport_scroll", + tp: "set_viewport_scroll", x: tMsg[1], y: tMsg[2], } @@ -428,14 +429,14 @@ export default function translate(tMsg: TrackerMessage): RawMessage | null { case 7: { return { - tp: "create_document", + tp: "create_document", } } case 8: { return { - tp: "create_element_node", + tp: "create_element_node", id: tMsg[1], parentID: tMsg[2], index: tMsg[3], @@ -446,7 +447,7 @@ export default function translate(tMsg: TrackerMessage): RawMessage | null { case 9: { return { - tp: "create_text_node", + tp: "create_text_node", id: tMsg[1], parentID: tMsg[2], index: tMsg[3], @@ -455,7 +456,7 @@ export default function translate(tMsg: TrackerMessage): RawMessage | null { case 10: { return { - tp: "move_node", + tp: "move_node", id: tMsg[1], parentID: tMsg[2], index: tMsg[3], @@ -464,14 +465,14 @@ export default function translate(tMsg: TrackerMessage): RawMessage | null { case 11: { return { - tp: "remove_node", + tp: "remove_node", id: tMsg[1], } } case 12: { return { - tp: "set_node_attribute", + tp: "set_node_attribute", id: tMsg[1], name: tMsg[2], value: tMsg[3], @@ -480,7 +481,7 @@ export default function translate(tMsg: TrackerMessage): RawMessage | null { case 13: { return { - tp: "remove_node_attribute", + tp: "remove_node_attribute", id: tMsg[1], name: tMsg[2], } @@ -488,7 +489,7 @@ export default function translate(tMsg: TrackerMessage): RawMessage | null { case 14: { return { - tp: "set_node_data", + tp: "set_node_data", id: tMsg[1], data: tMsg[2], } @@ -496,7 +497,7 @@ export default function translate(tMsg: TrackerMessage): RawMessage | null { case 16: { return { - tp: "set_node_scroll", + tp: "set_node_scroll", id: tMsg[1], x: tMsg[2], y: tMsg[3], @@ -505,7 +506,7 @@ export default function translate(tMsg: TrackerMessage): RawMessage | null { case 18: { return { - tp: "set_input_value", + tp: "set_input_value", id: tMsg[1], value: tMsg[2], mask: tMsg[3], @@ -514,7 +515,7 @@ export default function translate(tMsg: TrackerMessage): RawMessage | null { case 19: { return { - tp: "set_input_checked", + tp: "set_input_checked", id: tMsg[1], checked: tMsg[2], } @@ -522,7 +523,7 @@ export default function translate(tMsg: TrackerMessage): RawMessage | null { case 20: { return { - tp: "mouse_move", + tp: "mouse_move", x: tMsg[1], y: tMsg[2], } @@ -530,7 +531,7 @@ export default function translate(tMsg: TrackerMessage): RawMessage | null { case 22: { return { - tp: "console_log", + tp: "console_log", level: tMsg[1], value: tMsg[2], } @@ -538,7 +539,7 @@ export default function translate(tMsg: TrackerMessage): RawMessage | null { case 37: { return { - tp: "css_insert_rule", + tp: "css_insert_rule", id: tMsg[1], rule: tMsg[2], index: tMsg[3], @@ -547,7 +548,7 @@ export default function translate(tMsg: TrackerMessage): RawMessage | null { case 38: { return { - tp: "css_delete_rule", + tp: "css_delete_rule", id: tMsg[1], index: tMsg[2], } @@ -555,7 +556,7 @@ export default function translate(tMsg: TrackerMessage): RawMessage | null { case 39: { return { - tp: "fetch", + tp: "fetch", method: tMsg[1], url: tMsg[2], request: tMsg[3], @@ -568,7 +569,7 @@ export default function translate(tMsg: TrackerMessage): RawMessage | null { case 40: { return { - tp: "profiler", + tp: "profiler", name: tMsg[1], duration: tMsg[2], args: tMsg[3], @@ -578,7 +579,7 @@ export default function translate(tMsg: TrackerMessage): RawMessage | null { case 41: { return { - tp: "o_table", + tp: "o_table", key: tMsg[1], value: tMsg[2], } @@ -586,7 +587,7 @@ export default function translate(tMsg: TrackerMessage): RawMessage | null { case 44: { return { - tp: "redux", + tp: "redux", action: tMsg[1], state: tMsg[2], duration: tMsg[3], @@ -595,7 +596,7 @@ export default function translate(tMsg: TrackerMessage): RawMessage | null { case 45: { return { - tp: "vuex", + tp: "vuex", mutation: tMsg[1], state: tMsg[2], } @@ -603,7 +604,7 @@ export default function translate(tMsg: TrackerMessage): RawMessage | null { case 46: { return { - tp: "mob_x", + tp: "mob_x", type: tMsg[1], payload: tMsg[2], } @@ -611,7 +612,7 @@ export default function translate(tMsg: TrackerMessage): RawMessage | null { case 47: { return { - tp: "ng_rx", + tp: "ng_rx", action: tMsg[1], state: tMsg[2], duration: tMsg[3], @@ -620,7 +621,7 @@ export default function translate(tMsg: TrackerMessage): RawMessage | null { case 48: { return { - tp: "graph_ql", + tp: "graph_ql", operationKind: tMsg[1], operationName: tMsg[2], variables: tMsg[3], @@ -630,7 +631,7 @@ export default function translate(tMsg: TrackerMessage): RawMessage | null { case 49: { return { - tp: "performance_track", + tp: "performance_track", frames: tMsg[1], ticks: tMsg[2], totalJSHeapSize: tMsg[3], @@ -640,7 +641,7 @@ export default function translate(tMsg: TrackerMessage): RawMessage | null { case 54: { return { - tp: "connection_information", + tp: "connection_information", downlink: tMsg[1], type: tMsg[2], } @@ -648,14 +649,14 @@ export default function translate(tMsg: TrackerMessage): RawMessage | null { case 55: { return { - tp: "set_page_visibility", + tp: "set_page_visibility", hidden: tMsg[1], } } case 59: { return { - tp: "long_task", + tp: "long_task", timestamp: tMsg[1], duration: tMsg[2], context: tMsg[3], @@ -668,7 +669,7 @@ export default function translate(tMsg: TrackerMessage): RawMessage | null { case 60: { return { - tp: "set_node_attribute_url_based", + tp: "set_node_attribute_url_based", id: tMsg[1], name: tMsg[2], value: tMsg[3], @@ -678,7 +679,7 @@ export default function translate(tMsg: TrackerMessage): RawMessage | null { case 61: { return { - tp: "set_css_data_url_based", + tp: "set_css_data_url_based", id: tMsg[1], data: tMsg[2], baseURL: tMsg[3], @@ -687,7 +688,7 @@ export default function translate(tMsg: TrackerMessage): RawMessage | null { case 67: { return { - tp: "css_insert_rule_url_based", + tp: "css_insert_rule_url_based", id: tMsg[1], rule: tMsg[2], index: tMsg[3], @@ -697,7 +698,7 @@ export default function translate(tMsg: TrackerMessage): RawMessage | null { case 69: { return { - tp: "mouse_click", + tp: "mouse_click", id: tMsg[1], hesitationTime: tMsg[2], label: tMsg[3], @@ -707,7 +708,7 @@ export default function translate(tMsg: TrackerMessage): RawMessage | null { case 70: { return { - tp: "create_i_frame_document", + tp: "create_i_frame_document", frameID: tMsg[1], id: tMsg[2], } @@ -715,7 +716,7 @@ export default function translate(tMsg: TrackerMessage): RawMessage | null { case 71: { return { - tp: "adopted_ss_replace_url_based", + tp: "adopted_ss_replace_url_based", sheetID: tMsg[1], text: tMsg[2], baseURL: tMsg[3], @@ -724,7 +725,7 @@ export default function translate(tMsg: TrackerMessage): RawMessage | null { case 73: { return { - tp: "adopted_ss_insert_rule_url_based", + tp: "adopted_ss_insert_rule_url_based", sheetID: tMsg[1], rule: tMsg[2], index: tMsg[3], @@ -734,7 +735,7 @@ export default function translate(tMsg: TrackerMessage): RawMessage | null { case 75: { return { - tp: "adopted_ss_delete_rule", + tp: "adopted_ss_delete_rule", sheetID: tMsg[1], index: tMsg[2], } @@ -742,7 +743,7 @@ export default function translate(tMsg: TrackerMessage): RawMessage | null { case 76: { return { - tp: "adopted_ss_add_owner", + tp: "adopted_ss_add_owner", sheetID: tMsg[1], id: tMsg[2], } @@ -750,7 +751,7 @@ export default function translate(tMsg: TrackerMessage): RawMessage | null { case 77: { return { - tp: "adopted_ss_remove_owner", + tp: "adopted_ss_remove_owner", sheetID: tMsg[1], id: tMsg[2], } @@ -758,7 +759,7 @@ export default function translate(tMsg: TrackerMessage): RawMessage | null { case 79: { return { - tp: "zustand", + tp: "zustand", mutation: tMsg[1], state: tMsg[2], } @@ -768,4 +769,4 @@ export default function translate(tMsg: TrackerMessage): RawMessage | null { return null } -} \ No newline at end of file +} diff --git a/mobs/messages.rb b/mobs/messages.rb index 09acdb6f2..6d21c2e05 100644 --- a/mobs/messages.rb +++ b/mobs/messages.rb @@ -44,7 +44,7 @@ message 1, 'SessionStart', :tracker => false, :replayer => false do string 'UserCountry' string 'UserID' end -# message 2, 'CreateDocument', do +## message 2, 'CreateDocument', do # end message 3, 'SessionEnd', :tracker => false, :replayer => false do uint 'Timestamp' @@ -62,7 +62,7 @@ message 6, 'SetViewportScroll' do int 'X' int 'Y' end -# Depricated sinse tracker 3.6.0 in favor of CreateDocument(id=2) +# (should be) Depricated sinse tracker ?.?.? in favor of CreateDocument(id=2) # in order to use Document as a default root node instead of the documentElement message 7, 'CreateDocument' do end @@ -238,13 +238,13 @@ message 36, 'CustomEvent', :tracker => false, :replayer => false do string 'Name' string 'Payload' end - - +# depricated since 4.0.2 in favor of AdoptedSSInsertRule + AdoptedSSAddOwner message 37, 'CSSInsertRule' do uint 'ID' string 'Rule' uint 'Index' end +# depricated since 4.0.2 message 38, 'CSSDeleteRule' do uint 'ID' uint 'Index' @@ -265,7 +265,6 @@ message 40, 'Profiler' do string 'Args' string 'Result' end - message 41, 'OTable' do string 'Key' string 'Value' @@ -278,7 +277,6 @@ message 43, 'StateActionEvent', :tracker => false, :replayer => false do uint 'Timestamp' string 'Type' end - message 44, 'Redux' do string 'Action' string 'State' @@ -363,6 +361,7 @@ message 56, 'PerformanceTrackAggr', :tracker => false, :replayer => false do uint 'AvgUsedJSHeapSize' uint 'MaxUsedJSHeapSize' end +## 57 58 message 59, 'LongTask' do uint 'Timestamp' uint 'Duration' @@ -400,6 +399,7 @@ message 64, 'CustomIssue', :replayer => false do string 'Name' string 'Payload' end +## 65 message 66, 'AssetCache', :replayer => false, :tracker => false do string 'URL' end @@ -409,6 +409,7 @@ message 67, 'CSSInsertRuleURLBased' do uint 'Index' string 'BaseURL' end +## 68 message 69, 'MouseClick' do uint 'ID' uint 'HesitationTime' @@ -416,13 +417,14 @@ message 69, 'MouseClick' do string 'Selector' end -# Since 3.4.0 +# Since 3.4.0 //also used for ShadowDom. TODO:remane to CreateRoot message 70, 'CreateIFrameDocument' do uint 'FrameID' uint 'ID' end -#Since 3.6.0 AdoptedStyleSheets +#Since 4.0.0 AdoptedStyleSheets etc +# TODO: rename to StyleSheets... message 71, 'AdoptedSSReplaceURLBased' do uint 'SheetID' string 'Text' @@ -455,8 +457,16 @@ message 77, 'AdoptedSSRemoveOwner' do uint 'SheetID' uint 'ID' end - +#Since 4.0.1 +# message 78, 'ReplaceVCSSURLBased' do +# uint 'SheetID' +# uint 'Index' +# string 'Styles' +# string 'BaseURL' +# end message 79, 'Zustand' do string 'Mutation' string 'State' end + +# 80 -- 90 reserved \ No newline at end of file diff --git a/mobs/templates/frontend~app~player~MessageDistributor~messages~RawMessageReader.ts.erb b/mobs/templates/frontend~app~player~MessageDistributor~messages~RawMessageReader.ts.erb index d1e533550..11bd38e1a 100644 --- a/mobs/templates/frontend~app~player~MessageDistributor~messages~RawMessageReader.ts.erb +++ b/mobs/templates/frontend~app~player~MessageDistributor~messages~RawMessageReader.ts.erb @@ -1,4 +1,5 @@ // Auto-generated, do not edit +/* eslint-disable */ import PrimitiveReader from './PrimitiveReader' import type { RawMessage } from './raw' @@ -18,12 +19,12 @@ export default class RawMessageReader extends PrimitiveReader { switch (tp) { <% $messages.select { |msg| msg.replayer }.each do |msg| %> case <%= msg.id %>: { -<%= msg.attributes.map { |attr| -" const #{attr.name.camel_case} = this.read#{attr.type.to_s.pascal_case}(); if (#{attr.name.camel_case} === null) { return resetPointer() }" }.join "\n" %> +<%= msg.attributes.map { |attr| +" const #{attr.name.camel_case} = this.read#{attr.type.to_s.pascal_case}(); if (#{attr.name.camel_case} === null) { return resetPointer() }" }.join "\n" %> return { - tp: "<%= msg.name.snake_case %>", -<%= msg.attributes.map { |attr| -" #{attr.name.camel_case}," }.join "\n" %> + tp: "<%= msg.name.snake_case %>", +<%= msg.attributes.map { |attr| +" #{attr.name.camel_case}," }.join "\n" %> }; } <% end %> diff --git a/mobs/templates/frontend~app~player~MessageDistributor~messages~message.ts.erb b/mobs/templates/frontend~app~player~MessageDistributor~messages~message.ts.erb index 91c2cb9a5..178fa3e44 100644 --- a/mobs/templates/frontend~app~player~MessageDistributor~messages~message.ts.erb +++ b/mobs/templates/frontend~app~player~MessageDistributor~messages~message.ts.erb @@ -1,8 +1,9 @@ // Auto-generated, do not edit +/* eslint-disable */ import type { Timed } from './timed' import type { RawMessage } from './raw' -import type { +import type { <%= $messages.select { |msg| msg.replayer }.map { |msg| " Raw#{msg.name.snake_case.pascal_case}," }.join "\n" %> } from './raw' @@ -10,4 +11,4 @@ export type Message = RawMessage & Timed <% $messages.select { |msg| msg.replayer }.each do |msg| %> export type <%= msg.name.snake_case.pascal_case %> = Raw<%= msg.name.snake_case.pascal_case %> & Timed -<% end %> \ No newline at end of file +<% end %> diff --git a/mobs/templates/frontend~app~player~MessageDistributor~messages~raw.ts.erb b/mobs/templates/frontend~app~player~MessageDistributor~messages~raw.ts.erb index b94ced335..97dc34be6 100644 --- a/mobs/templates/frontend~app~player~MessageDistributor~messages~raw.ts.erb +++ b/mobs/templates/frontend~app~player~MessageDistributor~messages~raw.ts.erb @@ -1,4 +1,5 @@ // Auto-generated, do not edit +/* eslint-disable */ <% $messages.select { |msg| msg.replayer }.each do |msg| %> export interface Raw<%= msg.name.snake_case.pascal_case %> { diff --git a/mobs/templates/frontend~app~player~MessageDistributor~messages~tracker-legacy.ts.erb b/mobs/templates/frontend~app~player~MessageDistributor~messages~tracker-legacy.ts.erb index 586ee8cf3..e0ba92069 100644 --- a/mobs/templates/frontend~app~player~MessageDistributor~messages~tracker-legacy.ts.erb +++ b/mobs/templates/frontend~app~player~MessageDistributor~messages~tracker-legacy.ts.erb @@ -1,8 +1,7 @@ // @ts-nocheck +/* eslint-disable */ // Auto-generated, do not edit export const TP_MAP = { <%= $messages.select { |msg| msg.tracker || msg.replayer }.map { |msg| " #{msg.id}: \"#{msg.name.snake_case}\"," }.join "\n" %> } as const - - diff --git a/mobs/templates/frontend~app~player~MessageDistributor~messages~tracker.ts.erb b/mobs/templates/frontend~app~player~MessageDistributor~messages~tracker.ts.erb index 0b3452b3b..f6e739c86 100644 --- a/mobs/templates/frontend~app~player~MessageDistributor~messages~tracker.ts.erb +++ b/mobs/templates/frontend~app~player~MessageDistributor~messages~tracker.ts.erb @@ -1,6 +1,7 @@ // Auto-generated, do not edit +/* eslint-disable */ -import type { RawMessage } from './raw' +import type { RawMessage } from './raw' <% $messages.select { |msg| msg.tracker }.each do |msg| %> type Tr<%= msg.name %> = [ @@ -16,7 +17,7 @@ export default function translate(tMsg: TrackerMessage): RawMessage | null { <% $messages.select { |msg| msg.replayer & msg.tracker }.each do |msg| %> case <%= msg.id %>: { return { - tp: "<%= msg.name.snake_case %>", + tp: "<%= msg.name.snake_case %>", <%= msg.attributes.map.with_index { |attr, i| "#{attr.name.camel_case}: tMsg[#{i+1}]," }.join "\n " %> } } @@ -25,4 +26,4 @@ export default function translate(tMsg: TrackerMessage): RawMessage | null { return null } -} \ No newline at end of file +} diff --git a/mobs/templates/tracker~tracker~src~common~messages.gen.ts.erb b/mobs/templates/tracker~tracker~src~common~messages.gen.ts.erb index 893e3878f..6985bcf65 100644 --- a/mobs/templates/tracker~tracker~src~common~messages.gen.ts.erb +++ b/mobs/templates/tracker~tracker~src~common~messages.gen.ts.erb @@ -1,4 +1,5 @@ // Auto-generated, do not edit +/* eslint-disable */ export declare const enum Type { <%= $messages.select { |msg| msg.tracker }.map { |msg| "#{ msg.name } = #{ msg.id }," }.join "\n " %> diff --git a/mobs/templates/tracker~tracker~src~main~app~messages.gen.ts.erb b/mobs/templates/tracker~tracker~src~main~app~messages.gen.ts.erb index 1143bc5f4..d4c132f8a 100644 --- a/mobs/templates/tracker~tracker~src~main~app~messages.gen.ts.erb +++ b/mobs/templates/tracker~tracker~src~main~app~messages.gen.ts.erb @@ -1,4 +1,5 @@ // Auto-generated, do not edit +/* eslint-disable */ import * as Messages from '../../common/messages.gen.js' export { default } from '../../common/messages.gen.js' @@ -7,7 +8,7 @@ export { default } from '../../common/messages.gen.js' export function <%= msg.name %>( <%= msg.attributes.map { |attr| "#{attr.name.camel_case}: #{attr.type_js}," }.join "\n " %> ): Messages.<%= msg.name %> { - return [ + return [ Messages.Type.<%= msg.name %>, <%= msg.attributes.map { |attr| "#{attr.name.camel_case}," }.join "\n " %> ] diff --git a/mobs/templates/tracker~tracker~src~webworker~MessageEncoder.gen.ts.erb b/mobs/templates/tracker~tracker~src~webworker~MessageEncoder.gen.ts.erb index e65bbe2f2..503865443 100644 --- a/mobs/templates/tracker~tracker~src~webworker~MessageEncoder.gen.ts.erb +++ b/mobs/templates/tracker~tracker~src~webworker~MessageEncoder.gen.ts.erb @@ -1,4 +1,5 @@ // Auto-generated, do not edit +/* eslint-disable */ import * as Messages from '../common/messages.gen.js' import Message from '../common/messages.gen.js' @@ -15,6 +16,5 @@ export default class MessageEncoder extends PrimitiveEncoder { <% end %> } } - -} +} diff --git a/tracker/tracker/.eslintrc.cjs b/tracker/tracker/.eslintrc.cjs index a5a2267bd..de1fed019 100644 --- a/tracker/tracker/.eslintrc.cjs +++ b/tracker/tracker/.eslintrc.cjs @@ -34,7 +34,7 @@ module.exports = { '@typescript-eslint/no-unsafe-member-access': 'off', '@typescript-eslint/no-unsafe-call': 'off', '@typescript-eslint/restrict-plus-operands': 'warn', - '@typescript-eslint/no-unsafe-return': 'warn', + '@typescript-eslint/no-unsafe-return': 'off', 'no-useless-escape': 'warn', 'no-control-regex': 'warn', '@typescript-eslint/restrict-template-expressions': 'warn', diff --git a/tracker/tracker/src/common/messages.gen.ts b/tracker/tracker/src/common/messages.gen.ts index 107416711..4e2afe778 100644 --- a/tracker/tracker/src/common/messages.gen.ts +++ b/tracker/tracker/src/common/messages.gen.ts @@ -1,4 +1,5 @@ // Auto-generated, do not edit +/* eslint-disable */ export declare const enum Type { BatchMetadata = 81, diff --git a/tracker/tracker/src/main/app/messages.gen.ts b/tracker/tracker/src/main/app/messages.gen.ts index 7bbbeb615..ce924a918 100644 --- a/tracker/tracker/src/main/app/messages.gen.ts +++ b/tracker/tracker/src/main/app/messages.gen.ts @@ -1,4 +1,5 @@ // Auto-generated, do not edit +/* eslint-disable */ import * as Messages from '../../common/messages.gen.js' export { default } from '../../common/messages.gen.js' @@ -11,7 +12,7 @@ export function BatchMetadata( timestamp: number, location: string, ): Messages.BatchMetadata { - return [ + return [ Messages.Type.BatchMetadata, version, pageNo, @@ -25,7 +26,7 @@ export function PartitionedMessage( partNo: number, partTotal: number, ): Messages.PartitionedMessage { - return [ + return [ Messages.Type.PartitionedMessage, partNo, partTotal, @@ -35,7 +36,7 @@ export function PartitionedMessage( export function Timestamp( timestamp: number, ): Messages.Timestamp { - return [ + return [ Messages.Type.Timestamp, timestamp, ] @@ -46,7 +47,7 @@ export function SetPageLocation( referrer: string, navigationStart: number, ): Messages.SetPageLocation { - return [ + return [ Messages.Type.SetPageLocation, url, referrer, @@ -58,7 +59,7 @@ export function SetViewportSize( width: number, height: number, ): Messages.SetViewportSize { - return [ + return [ Messages.Type.SetViewportSize, width, height, @@ -69,7 +70,7 @@ export function SetViewportScroll( x: number, y: number, ): Messages.SetViewportScroll { - return [ + return [ Messages.Type.SetViewportScroll, x, y, @@ -79,7 +80,7 @@ export function SetViewportScroll( export function CreateDocument( ): Messages.CreateDocument { - return [ + return [ Messages.Type.CreateDocument, ] @@ -92,7 +93,7 @@ export function CreateElementNode( tag: string, svg: boolean, ): Messages.CreateElementNode { - return [ + return [ Messages.Type.CreateElementNode, id, parentID, @@ -107,7 +108,7 @@ export function CreateTextNode( parentID: number, index: number, ): Messages.CreateTextNode { - return [ + return [ Messages.Type.CreateTextNode, id, parentID, @@ -120,7 +121,7 @@ export function MoveNode( parentID: number, index: number, ): Messages.MoveNode { - return [ + return [ Messages.Type.MoveNode, id, parentID, @@ -131,7 +132,7 @@ export function MoveNode( export function RemoveNode( id: number, ): Messages.RemoveNode { - return [ + return [ Messages.Type.RemoveNode, id, ] @@ -142,7 +143,7 @@ export function SetNodeAttribute( name: string, value: string, ): Messages.SetNodeAttribute { - return [ + return [ Messages.Type.SetNodeAttribute, id, name, @@ -154,7 +155,7 @@ export function RemoveNodeAttribute( id: number, name: string, ): Messages.RemoveNodeAttribute { - return [ + return [ Messages.Type.RemoveNodeAttribute, id, name, @@ -165,7 +166,7 @@ export function SetNodeData( id: number, data: string, ): Messages.SetNodeData { - return [ + return [ Messages.Type.SetNodeData, id, data, @@ -177,7 +178,7 @@ export function SetNodeScroll( x: number, y: number, ): Messages.SetNodeScroll { - return [ + return [ Messages.Type.SetNodeScroll, id, x, @@ -189,7 +190,7 @@ export function SetInputTarget( id: number, label: string, ): Messages.SetInputTarget { - return [ + return [ Messages.Type.SetInputTarget, id, label, @@ -201,7 +202,7 @@ export function SetInputValue( value: string, mask: number, ): Messages.SetInputValue { - return [ + return [ Messages.Type.SetInputValue, id, value, @@ -213,7 +214,7 @@ export function SetInputChecked( id: number, checked: boolean, ): Messages.SetInputChecked { - return [ + return [ Messages.Type.SetInputChecked, id, checked, @@ -224,7 +225,7 @@ export function MouseMove( x: number, y: number, ): Messages.MouseMove { - return [ + return [ Messages.Type.MouseMove, x, y, @@ -235,7 +236,7 @@ export function ConsoleLog( level: string, value: string, ): Messages.ConsoleLog { - return [ + return [ Messages.Type.ConsoleLog, level, value, @@ -253,7 +254,7 @@ export function PageLoadTiming( firstPaint: number, firstContentfulPaint: number, ): Messages.PageLoadTiming { - return [ + return [ Messages.Type.PageLoadTiming, requestStart, responseStart, @@ -272,7 +273,7 @@ export function PageRenderTiming( visuallyComplete: number, timeToInteractive: number, ): Messages.PageRenderTiming { - return [ + return [ Messages.Type.PageRenderTiming, speedIndex, visuallyComplete, @@ -285,7 +286,7 @@ export function JSException( message: string, payload: string, ): Messages.JSException { - return [ + return [ Messages.Type.JSException, name, message, @@ -297,7 +298,7 @@ export function RawCustomEvent( name: string, payload: string, ): Messages.RawCustomEvent { - return [ + return [ Messages.Type.RawCustomEvent, name, payload, @@ -307,7 +308,7 @@ export function RawCustomEvent( export function UserID( id: string, ): Messages.UserID { - return [ + return [ Messages.Type.UserID, id, ] @@ -316,7 +317,7 @@ export function UserID( export function UserAnonymousID( id: string, ): Messages.UserAnonymousID { - return [ + return [ Messages.Type.UserAnonymousID, id, ] @@ -326,7 +327,7 @@ export function Metadata( key: string, value: string, ): Messages.Metadata { - return [ + return [ Messages.Type.Metadata, key, value, @@ -338,7 +339,7 @@ export function CSSInsertRule( rule: string, index: number, ): Messages.CSSInsertRule { - return [ + return [ Messages.Type.CSSInsertRule, id, rule, @@ -350,7 +351,7 @@ export function CSSDeleteRule( id: number, index: number, ): Messages.CSSDeleteRule { - return [ + return [ Messages.Type.CSSDeleteRule, id, index, @@ -366,7 +367,7 @@ export function Fetch( timestamp: number, duration: number, ): Messages.Fetch { - return [ + return [ Messages.Type.Fetch, method, url, @@ -384,7 +385,7 @@ export function Profiler( args: string, result: string, ): Messages.Profiler { - return [ + return [ Messages.Type.Profiler, name, duration, @@ -397,7 +398,7 @@ export function OTable( key: string, value: string, ): Messages.OTable { - return [ + return [ Messages.Type.OTable, key, value, @@ -407,7 +408,7 @@ export function OTable( export function StateAction( type: string, ): Messages.StateAction { - return [ + return [ Messages.Type.StateAction, type, ] @@ -418,7 +419,7 @@ export function Redux( state: string, duration: number, ): Messages.Redux { - return [ + return [ Messages.Type.Redux, action, state, @@ -430,7 +431,7 @@ export function Vuex( mutation: string, state: string, ): Messages.Vuex { - return [ + return [ Messages.Type.Vuex, mutation, state, @@ -441,7 +442,7 @@ export function MobX( type: string, payload: string, ): Messages.MobX { - return [ + return [ Messages.Type.MobX, type, payload, @@ -453,7 +454,7 @@ export function NgRx( state: string, duration: number, ): Messages.NgRx { - return [ + return [ Messages.Type.NgRx, action, state, @@ -467,7 +468,7 @@ export function GraphQL( variables: string, response: string, ): Messages.GraphQL { - return [ + return [ Messages.Type.GraphQL, operationKind, operationName, @@ -482,7 +483,7 @@ export function PerformanceTrack( totalJSHeapSize: number, usedJSHeapSize: number, ): Messages.PerformanceTrack { - return [ + return [ Messages.Type.PerformanceTrack, frames, ticks, @@ -501,7 +502,7 @@ export function ResourceTiming( url: string, initiator: string, ): Messages.ResourceTiming { - return [ + return [ Messages.Type.ResourceTiming, timestamp, duration, @@ -518,7 +519,7 @@ export function ConnectionInformation( downlink: number, type: string, ): Messages.ConnectionInformation { - return [ + return [ Messages.Type.ConnectionInformation, downlink, type, @@ -528,7 +529,7 @@ export function ConnectionInformation( export function SetPageVisibility( hidden: boolean, ): Messages.SetPageVisibility { - return [ + return [ Messages.Type.SetPageVisibility, hidden, ] @@ -543,7 +544,7 @@ export function LongTask( containerId: string, containerName: string, ): Messages.LongTask { - return [ + return [ Messages.Type.LongTask, timestamp, duration, @@ -561,7 +562,7 @@ export function SetNodeAttributeURLBased( value: string, baseURL: string, ): Messages.SetNodeAttributeURLBased { - return [ + return [ Messages.Type.SetNodeAttributeURLBased, id, name, @@ -575,7 +576,7 @@ export function SetCSSDataURLBased( data: string, baseURL: string, ): Messages.SetCSSDataURLBased { - return [ + return [ Messages.Type.SetCSSDataURLBased, id, data, @@ -587,7 +588,7 @@ export function TechnicalInfo( type: string, value: string, ): Messages.TechnicalInfo { - return [ + return [ Messages.Type.TechnicalInfo, type, value, @@ -598,7 +599,7 @@ export function CustomIssue( name: string, payload: string, ): Messages.CustomIssue { - return [ + return [ Messages.Type.CustomIssue, name, payload, @@ -611,7 +612,7 @@ export function CSSInsertRuleURLBased( index: number, baseURL: string, ): Messages.CSSInsertRuleURLBased { - return [ + return [ Messages.Type.CSSInsertRuleURLBased, id, rule, @@ -626,7 +627,7 @@ export function MouseClick( label: string, selector: string, ): Messages.MouseClick { - return [ + return [ Messages.Type.MouseClick, id, hesitationTime, @@ -639,7 +640,7 @@ export function CreateIFrameDocument( frameID: number, id: number, ): Messages.CreateIFrameDocument { - return [ + return [ Messages.Type.CreateIFrameDocument, frameID, id, @@ -651,7 +652,7 @@ export function AdoptedSSReplaceURLBased( text: string, baseURL: string, ): Messages.AdoptedSSReplaceURLBased { - return [ + return [ Messages.Type.AdoptedSSReplaceURLBased, sheetID, text, @@ -665,7 +666,7 @@ export function AdoptedSSInsertRuleURLBased( index: number, baseURL: string, ): Messages.AdoptedSSInsertRuleURLBased { - return [ + return [ Messages.Type.AdoptedSSInsertRuleURLBased, sheetID, rule, @@ -678,7 +679,7 @@ export function AdoptedSSDeleteRule( sheetID: number, index: number, ): Messages.AdoptedSSDeleteRule { - return [ + return [ Messages.Type.AdoptedSSDeleteRule, sheetID, index, @@ -689,7 +690,7 @@ export function AdoptedSSAddOwner( sheetID: number, id: number, ): Messages.AdoptedSSAddOwner { - return [ + return [ Messages.Type.AdoptedSSAddOwner, sheetID, id, @@ -700,7 +701,7 @@ export function AdoptedSSRemoveOwner( sheetID: number, id: number, ): Messages.AdoptedSSRemoveOwner { - return [ + return [ Messages.Type.AdoptedSSRemoveOwner, sheetID, id, @@ -711,7 +712,7 @@ export function Zustand( mutation: string, state: string, ): Messages.Zustand { - return [ + return [ Messages.Type.Zustand, mutation, state, diff --git a/tracker/tracker/src/main/app/observer/observer.ts b/tracker/tracker/src/main/app/observer/observer.ts index babc5eae8..dec086509 100644 --- a/tracker/tracker/src/main/app/observer/observer.ts +++ b/tracker/tracker/src/main/app/observer/observer.ts @@ -291,6 +291,7 @@ export default abstract class Observer { const width = el.clientWidth const height = el.clientHeight el = node.cloneNode() as Element + // TODO: use ResizeObserver ;(el as HTMLElement | SVGElement).style.width = `${width}px` ;(el as HTMLElement | SVGElement).style.height = `${height}px` } diff --git a/tracker/tracker/src/main/index.ts b/tracker/tracker/src/main/index.ts index 0a5bc1357..af84730b0 100644 --- a/tracker/tracker/src/main/index.ts +++ b/tracker/tracker/src/main/index.ts @@ -20,7 +20,7 @@ import Performance from './modules/performance.js' import Scroll from './modules/scroll.js' import Viewport from './modules/viewport.js' import CSSRules from './modules/cssrules.js' -import AdoptedStyleSheets from './modules/adoptedStyleSheets.js' +import ConstructedStyleSheets from './modules/constructedStyleSheets.js' import { IN_BROWSER, deprecationWarn, DOCS_HOST } from './utils.js' import type { Options as AppOptions } from './app/index.js' @@ -113,7 +113,7 @@ export default class API { if (app !== null) { Viewport(app) CSSRules(app) - AdoptedStyleSheets(app) + ConstructedStyleSheets(app) Connection(app) Console(app, options) Exception(app, options) diff --git a/tracker/tracker/src/main/modules/adoptedStyleSheets.ts b/tracker/tracker/src/main/modules/constructedStyleSheets.ts similarity index 95% rename from tracker/tracker/src/main/modules/adoptedStyleSheets.ts rename to tracker/tracker/src/main/modules/constructedStyleSheets.ts index 538951f56..acc662a64 100644 --- a/tracker/tracker/src/main/modules/adoptedStyleSheets.ts +++ b/tracker/tracker/src/main/modules/constructedStyleSheets.ts @@ -19,6 +19,13 @@ function hasAdoptedSS(node: Node): node is StyleSheetOwner { ) } +// TODO: incapsulate to be init-ed on-start and join with cssrules.ts under one folder +let _id = 0xf +export function nextID(): number { + return _id++ +} +export const styleSheetIDMap: Map = new Map() + export default function (app: App | null) { if (app === null) { return @@ -31,7 +38,6 @@ export default function (app: App | null) { return } - let nextID = 0xf const styleSheetIDMap: Map = new Map() const adoptedStyleSheetsOwnings: Map = new Map() @@ -53,7 +59,7 @@ export default function (app: App | null) { let sheetID = styleSheetIDMap.get(s) const init = !sheetID if (!sheetID) { - sheetID = ++nextID + sheetID = nextID() } nowOwning.push(sheetID) if (!pastOwning.includes(sheetID)) { diff --git a/tracker/tracker/src/main/modules/cssrules.ts b/tracker/tracker/src/main/modules/cssrules.ts index b6b898788..10a072b4e 100644 --- a/tracker/tracker/src/main/modules/cssrules.ts +++ b/tracker/tracker/src/main/modules/cssrules.ts @@ -1,6 +1,12 @@ import type App from '../app/index.js' -import { CSSInsertRuleURLBased, CSSDeleteRule, TechnicalInfo } from '../app/messages.gen.js' +import { + AdoptedSSInsertRuleURLBased, // TODO: rename to common StyleSheet names + AdoptedSSDeleteRule, + AdoptedSSAddOwner, + TechnicalInfo, +} from '../app/messages.gen.js' import { hasTag } from '../app/guards.js' +import { nextID, styleSheetIDMap } from './constructedStyleSheets.js' export default function (app: App | null) { if (app === null) { @@ -11,31 +17,69 @@ export default function (app: App | null) { return } - const processOperation = app.safe((stylesheet: CSSStyleSheet, index: number, rule?: string) => { - const sendMessage = - typeof rule === 'string' - ? (nodeID: number) => - app.send(CSSInsertRuleURLBased(nodeID, rule, index, app.getBaseHref())) - : (nodeID: number) => app.send(CSSDeleteRule(nodeID, index)) - // TODO: Extend messages to maintain nested rules (CSSGroupingRule prototype, as well as CSSKeyframesRule) - if (stylesheet.ownerNode == null) { - throw new Error('Owner Node not found') + const sendInserDeleteRule = app.safe( + (stylesheet: CSSStyleSheet, index: number, rule?: string) => { + const sheetID = styleSheetIDMap.get(stylesheet) + if (!sheetID) { + app.debug.warn('No sheedID found', stylesheet, styleSheetIDMap) + return + } + if (typeof rule === 'string') { + app.send(AdoptedSSInsertRuleURLBased(sheetID, rule, index, app.getBaseHref())) + } else { + app.send(AdoptedSSDeleteRule(sheetID, index)) + } + }, + ) + + // TODO: proper rule insertion/removal (how?) + const sendReplaceGroupingRule = app.safe((rule: CSSGroupingRule) => { + let topmostRule: CSSRule = rule + while (topmostRule.parentRule) { + topmostRule = topmostRule.parentRule + } + const sheet = topmostRule.parentStyleSheet + if (!sheet) { + app.debug.warn('No parent StyleSheet found for', topmostRule, rule) + return + } + const sheetID = styleSheetIDMap.get(sheet) + if (!sheetID) { + app.debug.warn('No sheedID found for', sheet, styleSheetIDMap) + return + } + const cssText = topmostRule.cssText + const ruleList = sheet.cssRules + const idx = Array.from(ruleList).indexOf(topmostRule) + if (idx >= 0) { + app.send(AdoptedSSInsertRuleURLBased(sheetID, cssText, idx, app.getBaseHref())) + app.send(AdoptedSSDeleteRule(sheetID, idx + 1)) // Remove previous clone } - const nodeID = app.nodes.getID(stylesheet.ownerNode) - if (nodeID !== undefined) { - sendMessage(nodeID) - } // else error? }) const patchContext = (context: typeof globalThis) => { const { insertRule, deleteRule } = context.CSSStyleSheet.prototype + const { insertRule: groupInsertRule, deleteRule: groupDeleteRule } = + context.CSSGroupingRule.prototype + context.CSSStyleSheet.prototype.insertRule = function (rule: string, index = 0) { - processOperation(this, index, rule) - return insertRule.call(this, rule, index) + sendInserDeleteRule(this, index, rule) + return insertRule.call(this, rule, index) as number } context.CSSStyleSheet.prototype.deleteRule = function (index: number) { - processOperation(this, index) - return deleteRule.call(this, index) + sendInserDeleteRule(this, index) + return deleteRule.call(this, index) as number + } + + context.CSSGroupingRule.prototype.insertRule = function (rule: string, index = 0) { + const result = groupInsertRule.call(this, rule, index) as number + sendReplaceGroupingRule(this) + return result + } + context.CSSGroupingRule.prototype.deleteRule = function (index = 0) { + const result = groupDeleteRule.call(this, index) as number + sendReplaceGroupingRule(this) + return result } } @@ -47,11 +91,21 @@ export default function (app: App | null) { return } if (node.textContent !== null && node.textContent.trim().length > 0) { - return // Only fully virtual sheets maintained so far + return // Non-virtual styles captured by the observer as a text } - const rules = node.sheet.cssRules + + const nodeID = app.nodes.getID(node) + if (!nodeID) { + return + } + const sheet = node.sheet + const sheetID = nextID() + styleSheetIDMap.set(sheet, sheetID) + app.send(AdoptedSSAddOwner(sheetID, nodeID)) + + const rules = sheet.cssRules for (let i = 0; i < rules.length; i++) { - processOperation(node.sheet, i, rules[i].cssText) + sendInserDeleteRule(sheet, i, rules[i].cssText) } }) } diff --git a/tracker/tracker/src/webworker/MessageEncoder.gen.ts b/tracker/tracker/src/webworker/MessageEncoder.gen.ts index 78151ba9f..b646fd6ff 100644 --- a/tracker/tracker/src/webworker/MessageEncoder.gen.ts +++ b/tracker/tracker/src/webworker/MessageEncoder.gen.ts @@ -1,4 +1,5 @@ // Auto-generated, do not edit +/* eslint-disable */ import * as Messages from '../common/messages.gen.js' import Message from '../common/messages.gen.js' @@ -235,6 +236,5 @@ export default class MessageEncoder extends PrimitiveEncoder { } } - -} +}