@openreplay/tracker 3.5.16 → 3.5.17-beta.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.eslintignore +8 -0
- package/cjs/app/guards.js +1 -2
- package/cjs/app/index.d.ts +14 -14
- package/cjs/app/index.js +51 -44
- package/cjs/app/logger.js +6 -3
- package/cjs/app/observer/iframe_observer.d.ts +1 -1
- package/cjs/app/observer/iframe_observer.js +1 -1
- package/cjs/app/observer/observer.d.ts +1 -1
- package/cjs/app/observer/observer.js +12 -15
- package/cjs/app/observer/shadow_root_observer.d.ts +1 -1
- package/cjs/app/observer/shadow_root_observer.js +1 -1
- package/cjs/app/observer/top_observer.d.ts +2 -2
- package/cjs/app/observer/top_observer.js +12 -11
- package/cjs/app/sanitizer.d.ts +1 -1
- package/cjs/app/sanitizer.js +5 -5
- package/cjs/app/session.d.ts +1 -1
- package/cjs/app/session.js +4 -3
- package/cjs/app/ticker.d.ts +1 -1
- package/cjs/common/webworker.d.ts +3 -3
- package/cjs/index.d.ts +8 -8
- package/cjs/index.js +27 -27
- package/cjs/modules/connection.d.ts +1 -1
- package/cjs/modules/console.d.ts +1 -1
- package/cjs/modules/console.js +5 -5
- package/cjs/modules/cssrules.d.ts +1 -1
- package/cjs/modules/cssrules.js +3 -3
- package/cjs/modules/exception.d.ts +2 -2
- package/cjs/modules/exception.js +7 -6
- package/cjs/modules/img.d.ts +1 -1
- package/cjs/modules/img.js +15 -12
- package/cjs/modules/input.d.ts +1 -1
- package/cjs/modules/input.js +15 -15
- package/cjs/modules/longtasks.d.ts +1 -1
- package/cjs/modules/longtasks.js +13 -5
- package/cjs/modules/mouse.d.ts +1 -1
- package/cjs/modules/mouse.js +10 -12
- package/cjs/modules/performance.d.ts +1 -1
- package/cjs/modules/scroll.d.ts +1 -1
- package/cjs/modules/timing.d.ts +1 -1
- package/cjs/modules/timing.js +12 -24
- package/cjs/modules/viewport.d.ts +1 -1
- package/cjs/utils.js +7 -7
- package/cjs/vendors/finder/finder.js +53 -48
- package/lib/app/guards.js +1 -2
- package/lib/app/index.d.ts +14 -14
- package/lib/app/index.js +60 -53
- package/lib/app/logger.js +6 -3
- package/lib/app/observer/iframe_observer.d.ts +1 -1
- package/lib/app/observer/iframe_observer.js +3 -3
- package/lib/app/observer/observer.d.ts +1 -1
- package/lib/app/observer/observer.js +14 -17
- package/lib/app/observer/shadow_root_observer.d.ts +1 -1
- package/lib/app/observer/shadow_root_observer.js +3 -3
- package/lib/app/observer/top_observer.d.ts +2 -2
- package/lib/app/observer/top_observer.js +17 -16
- package/lib/app/sanitizer.d.ts +1 -1
- package/lib/app/sanitizer.js +7 -7
- package/lib/app/session.d.ts +1 -1
- package/lib/app/session.js +4 -3
- package/lib/app/ticker.d.ts +1 -1
- package/lib/common/tsconfig.tsbuildinfo +1 -1
- package/lib/common/webworker.d.ts +3 -3
- package/lib/index.d.ts +8 -8
- package/lib/index.js +42 -42
- package/lib/modules/connection.d.ts +1 -1
- package/lib/modules/connection.js +1 -1
- package/lib/modules/console.d.ts +1 -1
- package/lib/modules/console.js +8 -8
- package/lib/modules/cssrules.d.ts +1 -1
- package/lib/modules/cssrules.js +5 -5
- package/lib/modules/exception.d.ts +2 -2
- package/lib/modules/exception.js +8 -7
- package/lib/modules/img.d.ts +1 -1
- package/lib/modules/img.js +18 -15
- package/lib/modules/input.d.ts +1 -1
- package/lib/modules/input.js +18 -18
- package/lib/modules/longtasks.d.ts +1 -1
- package/lib/modules/longtasks.js +14 -6
- package/lib/modules/mouse.d.ts +1 -1
- package/lib/modules/mouse.js +14 -16
- package/lib/modules/performance.d.ts +1 -1
- package/lib/modules/performance.js +2 -2
- package/lib/modules/scroll.d.ts +1 -1
- package/lib/modules/scroll.js +2 -2
- package/lib/modules/timing.d.ts +1 -1
- package/lib/modules/timing.js +15 -27
- package/lib/modules/viewport.d.ts +1 -1
- package/lib/modules/viewport.js +1 -1
- package/lib/utils.js +7 -7
- package/lib/vendors/finder/finder.js +53 -48
- package/package.json +27 -10
package/cjs/app/sanitizer.js
CHANGED
|
@@ -14,20 +14,20 @@ class Sanitizer {
|
|
|
14
14
|
}
|
|
15
15
|
handleNode(id, parentID, node) {
|
|
16
16
|
if (this.masked.has(parentID) ||
|
|
17
|
-
((0, guards_js_1.isElementNode)(node) &&
|
|
18
|
-
(0, utils_js_1.hasOpenreplayAttribute)(node, 'masked'))) {
|
|
17
|
+
((0, guards_js_1.isElementNode)(node) && (0, utils_js_1.hasOpenreplayAttribute)(node, 'masked'))) {
|
|
19
18
|
this.masked.add(id);
|
|
20
19
|
}
|
|
21
20
|
if (this.maskedContainers.has(parentID) ||
|
|
22
|
-
((0, guards_js_1.isElementNode)(node) &&
|
|
23
|
-
(0, utils_js_1.hasOpenreplayAttribute)(node, 'htmlmasked'))) {
|
|
21
|
+
((0, guards_js_1.isElementNode)(node) && (0, utils_js_1.hasOpenreplayAttribute)(node, 'htmlmasked'))) {
|
|
24
22
|
this.maskedContainers.add(id);
|
|
25
23
|
}
|
|
26
24
|
}
|
|
27
25
|
sanitize(id, data) {
|
|
28
26
|
if (this.masked.has(id)) {
|
|
29
27
|
// TODO: is it the best place to put trim() ? Might trimmed spaces be considered in layout in certain cases?
|
|
30
|
-
return data
|
|
28
|
+
return data
|
|
29
|
+
.trim()
|
|
30
|
+
.replace(/[^\f\n\r\t\v\u00a0\u1680\u2000-\u200a\u2028\u2029\u202f\u205f\u3000\ufeff]/g, '█');
|
|
31
31
|
}
|
|
32
32
|
if (this.options.obscureTextNumbers) {
|
|
33
33
|
data = data.replace(/\d/g, '0');
|
package/cjs/app/session.d.ts
CHANGED
|
@@ -8,7 +8,7 @@ export default class Session {
|
|
|
8
8
|
private metadata;
|
|
9
9
|
private userID;
|
|
10
10
|
private sessionID;
|
|
11
|
-
private callbacks;
|
|
11
|
+
private readonly callbacks;
|
|
12
12
|
attachUpdateCallback(cb: OnUpdateCallback): void;
|
|
13
13
|
private handleUpdate;
|
|
14
14
|
update(newInfo: Partial<SessionInfo>): void;
|
package/cjs/app/session.js
CHANGED
|
@@ -17,14 +17,15 @@ class Session {
|
|
|
17
17
|
if (newInfo.sessionID == null) {
|
|
18
18
|
delete newInfo.sessionID;
|
|
19
19
|
}
|
|
20
|
-
this.callbacks.forEach(cb => cb(newInfo));
|
|
20
|
+
this.callbacks.forEach((cb) => cb(newInfo));
|
|
21
21
|
}
|
|
22
22
|
update(newInfo) {
|
|
23
|
-
if (newInfo.userID !== undefined) {
|
|
23
|
+
if (newInfo.userID !== undefined) {
|
|
24
|
+
// TODO clear nullable/undefinable types
|
|
24
25
|
this.userID = newInfo.userID;
|
|
25
26
|
}
|
|
26
27
|
if (newInfo.metadata !== undefined) {
|
|
27
|
-
Object.entries(newInfo.metadata).forEach(([k, v]) => this.metadata[k] = v);
|
|
28
|
+
Object.entries(newInfo.metadata).forEach(([k, v]) => (this.metadata[k] = v));
|
|
28
29
|
}
|
|
29
30
|
if (newInfo.sessionID !== undefined) {
|
|
30
31
|
this.sessionID = newInfo.sessionID;
|
package/cjs/app/ticker.d.ts
CHANGED
|
@@ -3,17 +3,17 @@ export interface Options {
|
|
|
3
3
|
connAttemptGap?: number;
|
|
4
4
|
}
|
|
5
5
|
declare type Start = {
|
|
6
|
-
type:
|
|
6
|
+
type: 'start';
|
|
7
7
|
ingestPoint: string;
|
|
8
8
|
pageNo: number;
|
|
9
9
|
timestamp: number;
|
|
10
10
|
} & Options;
|
|
11
11
|
declare type Auth = {
|
|
12
|
-
type:
|
|
12
|
+
type: 'auth';
|
|
13
13
|
token: string;
|
|
14
14
|
beaconSizeLimit?: number;
|
|
15
15
|
};
|
|
16
|
-
export declare type WorkerMessageData = null |
|
|
16
|
+
export declare type WorkerMessageData = null | 'stop' | Start | Auth | Array<{
|
|
17
17
|
_id: number;
|
|
18
18
|
}>;
|
|
19
19
|
export {};
|
package/cjs/index.d.ts
CHANGED
|
@@ -1,13 +1,13 @@
|
|
|
1
|
-
import App from
|
|
1
|
+
import App from './app/index.js';
|
|
2
2
|
export { default as App } from './app/index.js';
|
|
3
|
-
import * as _Messages from
|
|
3
|
+
import * as _Messages from './common/messages.js';
|
|
4
4
|
export declare const Messages: typeof _Messages;
|
|
5
|
-
import type { Options as AppOptions } from
|
|
6
|
-
import type { Options as ConsoleOptions } from
|
|
7
|
-
import type { Options as ExceptionOptions } from
|
|
8
|
-
import type { Options as InputOptions } from
|
|
9
|
-
import type { Options as PerformanceOptions } from
|
|
10
|
-
import type { Options as TimingOptions } from
|
|
5
|
+
import type { Options as AppOptions } from './app/index.js';
|
|
6
|
+
import type { Options as ConsoleOptions } from './modules/console.js';
|
|
7
|
+
import type { Options as ExceptionOptions } from './modules/exception.js';
|
|
8
|
+
import type { Options as InputOptions } from './modules/input.js';
|
|
9
|
+
import type { Options as PerformanceOptions } from './modules/performance.js';
|
|
10
|
+
import type { Options as TimingOptions } from './modules/timing.js';
|
|
11
11
|
import type { StartOptions } from './app/index.js';
|
|
12
12
|
import type { StartPromiseReturn } from './app/index.js';
|
|
13
13
|
export declare type Options = Partial<AppOptions & ConsoleOptions & ExceptionOptions & InputOptions & PerformanceOptions & TimingOptions> & {
|
package/cjs/index.js
CHANGED
|
@@ -27,17 +27,18 @@ function processOptions(obj) {
|
|
|
27
27
|
}
|
|
28
28
|
if (typeof obj.projectKey !== 'string') {
|
|
29
29
|
if (typeof obj.projectKey !== 'number') {
|
|
30
|
-
if (typeof obj.projectID !== 'number') {
|
|
30
|
+
if (typeof obj.projectID !== 'number') {
|
|
31
|
+
// Back compatability
|
|
31
32
|
console.error(`OpenReplay: projectKey is missing or wrong type (string is expected). Please, check ${utils_js_1.DOCS_HOST}${DOCS_SETUP} for more information.`);
|
|
32
33
|
return false;
|
|
33
34
|
}
|
|
34
35
|
else {
|
|
35
36
|
obj.projectKey = obj.projectID.toString();
|
|
36
|
-
(0, utils_js_1.deprecationWarn)(
|
|
37
|
+
(0, utils_js_1.deprecationWarn)('`projectID` option', '`projectKey` option', DOCS_SETUP);
|
|
37
38
|
}
|
|
38
39
|
}
|
|
39
40
|
else {
|
|
40
|
-
console.warn(
|
|
41
|
+
console.warn('OpenReplay: projectKey is expected to have a string type.');
|
|
41
42
|
obj.projectKey = obj.projectKey.toString();
|
|
42
43
|
}
|
|
43
44
|
}
|
|
@@ -69,28 +70,29 @@ class API {
|
|
|
69
70
|
return;
|
|
70
71
|
}
|
|
71
72
|
if (window.__OPENREPLAY__) {
|
|
72
|
-
console.error(
|
|
73
|
+
console.error('OpenReplay: one tracker instance has been initialised already');
|
|
73
74
|
return;
|
|
74
75
|
}
|
|
75
76
|
if (!options.__DISABLE_SECURE_MODE && location.protocol !== 'https:') {
|
|
76
|
-
console.error(
|
|
77
|
+
console.error('OpenReplay: Your website must be publicly accessible and running on SSL in order for OpenReplay to properly capture and replay the user session. You can disable this check by setting `__DISABLE_SECURE_MODE` option to `true` if you are testing in localhost. Keep in mind, that asset files on a local machine are not available to the outside world. This might affect tracking if you use css files.');
|
|
77
78
|
return;
|
|
78
79
|
}
|
|
79
80
|
const doNotTrack = options.respectDoNotTrack &&
|
|
80
|
-
(navigator.doNotTrack == '1'
|
|
81
|
+
(navigator.doNotTrack == '1' ||
|
|
81
82
|
// @ts-ignore
|
|
82
|
-
|
|
83
|
-
const app = this.app =
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
83
|
+
window.doNotTrack == '1');
|
|
84
|
+
const app = (this.app =
|
|
85
|
+
doNotTrack ||
|
|
86
|
+
!('Map' in window) ||
|
|
87
|
+
!('Set' in window) ||
|
|
88
|
+
!('MutationObserver' in window) ||
|
|
89
|
+
!('performance' in window) ||
|
|
90
|
+
!('timing' in performance) ||
|
|
91
|
+
!('startsWith' in String.prototype) ||
|
|
92
|
+
!('Blob' in window) ||
|
|
93
|
+
!('Worker' in window)
|
|
94
|
+
? null
|
|
95
|
+
: new index_js_1.default(options.projectKey, options.sessionToken, options));
|
|
94
96
|
if (app !== null) {
|
|
95
97
|
(0, viewport_js_1.default)(app);
|
|
96
98
|
(0, cssrules_js_1.default)(app);
|
|
@@ -123,7 +125,7 @@ class API {
|
|
|
123
125
|
console.log("OpenReplay: browser doesn't support API required for tracking or doNotTrack is set to 1.");
|
|
124
126
|
const req = new XMLHttpRequest();
|
|
125
127
|
const orig = options.ingestPoint || index_js_1.DEFAULT_INGEST_POINT;
|
|
126
|
-
req.open(
|
|
128
|
+
req.open('POST', orig + '/v1/web/not-started');
|
|
127
129
|
// no-cors issue only with text/plain or not-set Content-Type
|
|
128
130
|
// req.setRequestHeader("Content-Type", "application/json;charset=UTF-8");
|
|
129
131
|
req.send(JSON.stringify({
|
|
@@ -146,7 +148,7 @@ class API {
|
|
|
146
148
|
start(startOpts) {
|
|
147
149
|
if (!utils_js_1.IN_BROWSER) {
|
|
148
150
|
console.error(`OpenReplay: you are trying to start Tracker on a node.js environment. If you want to use OpenReplay with SSR, please, use componentDidMount or useEffect API for placing the \`tracker.start()\` line. Check documentation on ${utils_js_1.DOCS_HOST}${DOCS_SETUP}`);
|
|
149
|
-
return Promise.reject(
|
|
151
|
+
return Promise.reject('Trying to start not in browser.');
|
|
150
152
|
}
|
|
151
153
|
if (this.app === null) {
|
|
152
154
|
return Promise.reject("Browser doesn't support required api, or doNotTrack is active.");
|
|
@@ -173,7 +175,7 @@ class API {
|
|
|
173
175
|
return this.app.getSessionID();
|
|
174
176
|
}
|
|
175
177
|
sessionID() {
|
|
176
|
-
(0, utils_js_1.deprecationWarn)("'sessionID' method", "'getSessionID' method",
|
|
178
|
+
(0, utils_js_1.deprecationWarn)("'sessionID' method", "'getSessionID' method", '/');
|
|
177
179
|
return this.getSessionID();
|
|
178
180
|
}
|
|
179
181
|
setUserID(id) {
|
|
@@ -182,7 +184,7 @@ class API {
|
|
|
182
184
|
}
|
|
183
185
|
}
|
|
184
186
|
userID(id) {
|
|
185
|
-
(0, utils_js_1.deprecationWarn)("'userID' method", "'setUserID' method",
|
|
187
|
+
(0, utils_js_1.deprecationWarn)("'userID' method", "'setUserID' method", '/');
|
|
186
188
|
this.setUserID(id);
|
|
187
189
|
}
|
|
188
190
|
setUserAnonymousID(id) {
|
|
@@ -191,18 +193,16 @@ class API {
|
|
|
191
193
|
}
|
|
192
194
|
}
|
|
193
195
|
userAnonymousID(id) {
|
|
194
|
-
(0, utils_js_1.deprecationWarn)("'userAnonymousID' method", "'setUserAnonymousID' method",
|
|
196
|
+
(0, utils_js_1.deprecationWarn)("'userAnonymousID' method", "'setUserAnonymousID' method", '/');
|
|
195
197
|
this.setUserAnonymousID(id);
|
|
196
198
|
}
|
|
197
199
|
setMetadata(key, value) {
|
|
198
|
-
if (typeof key === 'string' &&
|
|
199
|
-
typeof value === 'string' &&
|
|
200
|
-
this.app !== null) {
|
|
200
|
+
if (typeof key === 'string' && typeof value === 'string' && this.app !== null) {
|
|
201
201
|
this.app.session.setMetadata(key, value);
|
|
202
202
|
}
|
|
203
203
|
}
|
|
204
204
|
metadata(key, value) {
|
|
205
|
-
(0, utils_js_1.deprecationWarn)("'metadata' method", "'setMetadata' method",
|
|
205
|
+
(0, utils_js_1.deprecationWarn)("'metadata' method", "'setMetadata' method", '/');
|
|
206
206
|
this.setMetadata(key, value);
|
|
207
207
|
}
|
|
208
208
|
event(key, payload, issue = false) {
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import App from
|
|
1
|
+
import App from '../app/index.js';
|
|
2
2
|
export default function (app: App): void;
|
package/cjs/modules/console.d.ts
CHANGED
package/cjs/modules/console.js
CHANGED
|
@@ -89,8 +89,7 @@ function default_1(app, opts) {
|
|
|
89
89
|
consoleMethods,
|
|
90
90
|
consoleThrottling: 30,
|
|
91
91
|
}, opts);
|
|
92
|
-
if (!Array.isArray(options.consoleMethods) ||
|
|
93
|
-
options.consoleMethods.length === 0) {
|
|
92
|
+
if (!Array.isArray(options.consoleMethods) || options.consoleMethods.length === 0) {
|
|
94
93
|
return;
|
|
95
94
|
}
|
|
96
95
|
const sendConsoleLog = app.safe((level, args) => app.send(new messages_js_1.ConsoleLog(level, printf(args))));
|
|
@@ -115,13 +114,14 @@ function default_1(app, opts) {
|
|
|
115
114
|
};
|
|
116
115
|
});
|
|
117
116
|
patchConsole(window.console);
|
|
118
|
-
app.nodes.attachNodeCallback(app.safe(node => {
|
|
119
|
-
if ((0, guards_js_1.hasTag)(node,
|
|
117
|
+
app.nodes.attachNodeCallback(app.safe((node) => {
|
|
118
|
+
if ((0, guards_js_1.hasTag)(node, 'IFRAME')) {
|
|
119
|
+
// TODO: newContextCallback
|
|
120
120
|
let context = node.contentWindow;
|
|
121
121
|
if (context) {
|
|
122
122
|
patchConsole(context.console);
|
|
123
123
|
}
|
|
124
|
-
app.attachEventListener(node,
|
|
124
|
+
app.attachEventListener(node, 'load', () => {
|
|
125
125
|
if (node.contentWindow !== context) {
|
|
126
126
|
context = node.contentWindow;
|
|
127
127
|
patchConsole(context.console);
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import type App from
|
|
1
|
+
import type App from '../app/index.js';
|
|
2
2
|
export default function (app: App | null): void;
|
package/cjs/modules/cssrules.js
CHANGED
|
@@ -7,7 +7,7 @@ function default_1(app) {
|
|
|
7
7
|
return;
|
|
8
8
|
}
|
|
9
9
|
if (!window.CSSStyleSheet) {
|
|
10
|
-
app.send(new messages_js_1.TechnicalInfo(
|
|
10
|
+
app.send(new messages_js_1.TechnicalInfo('no_stylesheet_prototype_in_window', ''));
|
|
11
11
|
return;
|
|
12
12
|
}
|
|
13
13
|
const processOperation = app.safe((stylesheet, index, rule) => {
|
|
@@ -16,7 +16,7 @@ function default_1(app) {
|
|
|
16
16
|
: (nodeID) => app.send(new messages_js_1.CSSDeleteRule(nodeID, index));
|
|
17
17
|
// TODO: Extend messages to maintain nested rules (CSSGroupingRule prototype, as well as CSSKeyframesRule)
|
|
18
18
|
if (stylesheet.ownerNode == null) {
|
|
19
|
-
throw new Error(
|
|
19
|
+
throw new Error('Owner Node not found');
|
|
20
20
|
}
|
|
21
21
|
const nodeID = app.nodes.getID(stylesheet.ownerNode);
|
|
22
22
|
if (nodeID !== undefined) {
|
|
@@ -33,7 +33,7 @@ function default_1(app) {
|
|
|
33
33
|
return deleteRule.call(this, index);
|
|
34
34
|
};
|
|
35
35
|
app.nodes.attachNodeCallback((node) => {
|
|
36
|
-
if (!(0, guards_js_1.hasTag)(node,
|
|
36
|
+
if (!(0, guards_js_1.hasTag)(node, 'STYLE') || !node.sheet) {
|
|
37
37
|
return;
|
|
38
38
|
}
|
|
39
39
|
if (node.textContent !== null && node.textContent.trim().length > 0) {
|
package/cjs/modules/exception.js
CHANGED
|
@@ -4,21 +4,22 @@ exports.getExceptionMessageFromEvent = exports.getExceptionMessage = void 0;
|
|
|
4
4
|
const messages_js_1 = require("../common/messages.js");
|
|
5
5
|
const error_stack_parser_1 = require("error-stack-parser");
|
|
6
6
|
function getDefaultStack(e) {
|
|
7
|
-
return [
|
|
7
|
+
return [
|
|
8
|
+
{
|
|
8
9
|
columnNumber: e.colno,
|
|
9
10
|
lineNumber: e.lineno,
|
|
10
11
|
fileName: e.filename,
|
|
11
|
-
functionName:
|
|
12
|
-
source:
|
|
13
|
-
}
|
|
12
|
+
functionName: '',
|
|
13
|
+
source: '',
|
|
14
|
+
},
|
|
15
|
+
];
|
|
14
16
|
}
|
|
15
17
|
function getExceptionMessage(error, fallbackStack) {
|
|
16
18
|
let stack = fallbackStack;
|
|
17
19
|
try {
|
|
18
20
|
stack = error_stack_parser_1.default.parse(error);
|
|
19
21
|
}
|
|
20
|
-
catch (e) {
|
|
21
|
-
}
|
|
22
|
+
catch (e) { }
|
|
22
23
|
return new messages_js_1.JSException(error.name, error.message, JSON.stringify(stack));
|
|
23
24
|
}
|
|
24
25
|
exports.getExceptionMessage = getExceptionMessage;
|
package/cjs/modules/img.d.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import type App from
|
|
1
|
+
import type App from '../app/index.js';
|
|
2
2
|
export default function (app: App): void;
|
package/cjs/modules/img.js
CHANGED
|
@@ -18,16 +18,16 @@ function resolveURL(url, location = document.location) {
|
|
|
18
18
|
return location.origin + location.pathname + url;
|
|
19
19
|
}
|
|
20
20
|
}
|
|
21
|
-
const PLACEHOLDER_SRC =
|
|
21
|
+
const PLACEHOLDER_SRC = 'https://static.openreplay.com/tracker/placeholder.jpeg';
|
|
22
22
|
function default_1(app) {
|
|
23
23
|
function sendPlaceholder(id, node) {
|
|
24
|
-
app.send(new messages_js_1.SetNodeAttribute(id,
|
|
24
|
+
app.send(new messages_js_1.SetNodeAttribute(id, 'src', PLACEHOLDER_SRC));
|
|
25
25
|
const { width, height } = node.getBoundingClientRect();
|
|
26
|
-
if (!node.hasAttribute(
|
|
27
|
-
app.send(new messages_js_1.SetNodeAttribute(id,
|
|
26
|
+
if (!node.hasAttribute('width')) {
|
|
27
|
+
app.send(new messages_js_1.SetNodeAttribute(id, 'width', String(width)));
|
|
28
28
|
}
|
|
29
|
-
if (!node.hasAttribute(
|
|
30
|
-
app.send(new messages_js_1.SetNodeAttribute(id,
|
|
29
|
+
if (!node.hasAttribute('height')) {
|
|
30
|
+
app.send(new messages_js_1.SetNodeAttribute(id, 'height', String(height)));
|
|
31
31
|
}
|
|
32
32
|
}
|
|
33
33
|
const sendImgSrc = app.safe(function () {
|
|
@@ -51,24 +51,27 @@ function default_1(app) {
|
|
|
51
51
|
else {
|
|
52
52
|
app.send(new messages_js_1.SetNodeAttribute(id, 'src', resolvedSrc));
|
|
53
53
|
if (srcset) {
|
|
54
|
-
const resolvedSrcset = srcset
|
|
54
|
+
const resolvedSrcset = srcset
|
|
55
|
+
.split(',')
|
|
56
|
+
.map((str) => resolveURL(str))
|
|
57
|
+
.join(',');
|
|
55
58
|
app.send(new messages_js_1.SetNodeAttribute(id, 'srcset', resolvedSrcset));
|
|
56
59
|
}
|
|
57
60
|
}
|
|
58
61
|
});
|
|
59
62
|
const observer = new MutationObserver((mutations) => {
|
|
60
63
|
for (const mutation of mutations) {
|
|
61
|
-
if (mutation.type ===
|
|
64
|
+
if (mutation.type === 'attributes') {
|
|
62
65
|
const target = mutation.target;
|
|
63
66
|
const id = app.nodes.getID(target);
|
|
64
67
|
if (id === undefined) {
|
|
65
68
|
return;
|
|
66
69
|
}
|
|
67
|
-
if (mutation.attributeName ===
|
|
70
|
+
if (mutation.attributeName === 'src') {
|
|
68
71
|
const src = target.src;
|
|
69
72
|
app.send(new messages_js_1.SetNodeAttributeURLBased(id, 'src', src, app.getBaseHref()));
|
|
70
73
|
}
|
|
71
|
-
if (mutation.attributeName ===
|
|
74
|
+
if (mutation.attributeName === 'srcset') {
|
|
72
75
|
const srcset = target.srcset;
|
|
73
76
|
app.send(new messages_js_1.SetNodeAttribute(id, 'srcset', srcset));
|
|
74
77
|
}
|
|
@@ -76,13 +79,13 @@ function default_1(app) {
|
|
|
76
79
|
}
|
|
77
80
|
});
|
|
78
81
|
app.nodes.attachNodeCallback((node) => {
|
|
79
|
-
if (!(0, guards_js_1.hasTag)(node,
|
|
82
|
+
if (!(0, guards_js_1.hasTag)(node, 'IMG')) {
|
|
80
83
|
return;
|
|
81
84
|
}
|
|
82
85
|
app.nodes.attachElementListener('error', node, sendImgSrc);
|
|
83
86
|
app.nodes.attachElementListener('load', node, sendImgSrc);
|
|
84
87
|
sendImgSrc.call(node);
|
|
85
|
-
observer.observe(node, { attributes: true, attributeFilter: [
|
|
88
|
+
observer.observe(node, { attributes: true, attributeFilter: ['src', 'srcset'] });
|
|
86
89
|
});
|
|
87
90
|
}
|
|
88
91
|
exports.default = default_1;
|
package/cjs/modules/input.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import type App from
|
|
1
|
+
import type App from '../app/index.js';
|
|
2
2
|
declare type TextEditableElement = HTMLInputElement | HTMLTextAreaElement;
|
|
3
3
|
export declare function getInputLabel(node: TextEditableElement): string;
|
|
4
4
|
export declare const enum InputMode {
|
package/cjs/modules/input.js
CHANGED
|
@@ -6,16 +6,16 @@ const guards_js_1 = require("../app/guards.js");
|
|
|
6
6
|
const messages_js_1 = require("../common/messages.js");
|
|
7
7
|
const INPUT_TYPES = ['text', 'password', 'email', 'search', 'number', 'range', 'date'];
|
|
8
8
|
function isTextEditable(node) {
|
|
9
|
-
if ((0, guards_js_1.hasTag)(node,
|
|
9
|
+
if ((0, guards_js_1.hasTag)(node, 'TEXTAREA')) {
|
|
10
10
|
return true;
|
|
11
11
|
}
|
|
12
|
-
if (!(0, guards_js_1.hasTag)(node,
|
|
12
|
+
if (!(0, guards_js_1.hasTag)(node, 'INPUT')) {
|
|
13
13
|
return false;
|
|
14
14
|
}
|
|
15
15
|
return INPUT_TYPES.includes(node.type);
|
|
16
16
|
}
|
|
17
17
|
function isCheckable(node) {
|
|
18
|
-
if (!(0, guards_js_1.hasTag)(node,
|
|
18
|
+
if (!(0, guards_js_1.hasTag)(node, 'INPUT')) {
|
|
19
19
|
return false;
|
|
20
20
|
}
|
|
21
21
|
const type = node.type;
|
|
@@ -25,7 +25,7 @@ const labelElementFor = utils_js_1.IN_BROWSER && 'labels' in HTMLInputElement.pr
|
|
|
25
25
|
? (node) => {
|
|
26
26
|
let p = node;
|
|
27
27
|
while ((p = p.parentNode) !== null) {
|
|
28
|
-
if ((0, guards_js_1.hasTag)(p,
|
|
28
|
+
if ((0, guards_js_1.hasTag)(p, 'LABEL')) {
|
|
29
29
|
return p;
|
|
30
30
|
}
|
|
31
31
|
}
|
|
@@ -37,7 +37,7 @@ const labelElementFor = utils_js_1.IN_BROWSER && 'labels' in HTMLInputElement.pr
|
|
|
37
37
|
: (node) => {
|
|
38
38
|
let p = node;
|
|
39
39
|
while ((p = p.parentNode) !== null) {
|
|
40
|
-
if ((0, guards_js_1.hasTag)(p,
|
|
40
|
+
if ((0, guards_js_1.hasTag)(p, 'LABEL')) {
|
|
41
41
|
return p;
|
|
42
42
|
}
|
|
43
43
|
}
|
|
@@ -53,12 +53,13 @@ function getInputLabel(node) {
|
|
|
53
53
|
let label = (0, utils_js_1.getLabelAttribute)(node);
|
|
54
54
|
if (label === null) {
|
|
55
55
|
const labelElement = labelElementFor(node);
|
|
56
|
-
label =
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
56
|
+
label =
|
|
57
|
+
(labelElement && labelElement.innerText) ||
|
|
58
|
+
node.placeholder ||
|
|
59
|
+
node.name ||
|
|
60
|
+
node.id ||
|
|
61
|
+
node.className ||
|
|
62
|
+
node.type;
|
|
62
63
|
}
|
|
63
64
|
return (0, utils_js_1.normSpaces)(label).slice(0, 100);
|
|
64
65
|
}
|
|
@@ -86,8 +87,7 @@ function default_1(app, opts) {
|
|
|
86
87
|
(inputMode === 0 /* Plain */ &&
|
|
87
88
|
((options.obscureInputNumbers && node.type !== 'date' && /\d\d\d\d/.test(value)) ||
|
|
88
89
|
(options.obscureInputDates && node.type === 'date') ||
|
|
89
|
-
(options.obscureInputEmails &&
|
|
90
|
-
(node.type === 'email' || !!~value.indexOf('@')))))) {
|
|
90
|
+
(options.obscureInputEmails && (node.type === 'email' || !!~value.indexOf('@')))))) {
|
|
91
91
|
inputMode = 1 /* Obscured */;
|
|
92
92
|
}
|
|
93
93
|
let mask = 0;
|
|
@@ -150,9 +150,9 @@ function default_1(app, opts) {
|
|
|
150
150
|
return;
|
|
151
151
|
}
|
|
152
152
|
// TODO: support multiple select (?): use selectedOptions; Need send target?
|
|
153
|
-
if ((0, guards_js_1.hasTag)(node,
|
|
153
|
+
if ((0, guards_js_1.hasTag)(node, 'SELECT')) {
|
|
154
154
|
sendInputValue(id, node);
|
|
155
|
-
app.attachEventListener(node,
|
|
155
|
+
app.attachEventListener(node, 'change', () => {
|
|
156
156
|
sendInputValue(id, node);
|
|
157
157
|
});
|
|
158
158
|
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import type App from
|
|
1
|
+
import type App from '../app/index.js';
|
|
2
2
|
export default function (app: App): void;
|
package/cjs/modules/longtasks.js
CHANGED
|
@@ -1,16 +1,24 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
const messages_js_1 = require("../common/messages.js");
|
|
4
|
-
;
|
|
5
|
-
;
|
|
6
4
|
function default_1(app) {
|
|
7
5
|
if (!('PerformanceObserver' in window) || !('PerformanceLongTaskTiming' in window)) {
|
|
8
6
|
return;
|
|
9
7
|
}
|
|
10
|
-
const contexts = [
|
|
11
|
-
|
|
8
|
+
const contexts = [
|
|
9
|
+
'unknown',
|
|
10
|
+
'self',
|
|
11
|
+
'same-origin-ancestor',
|
|
12
|
+
'same-origin-descendant',
|
|
13
|
+
'same-origin',
|
|
14
|
+
'cross-origin-ancestor',
|
|
15
|
+
'cross-origin-descendant',
|
|
16
|
+
'cross-origin-unreachable',
|
|
17
|
+
'multiple-contexts',
|
|
18
|
+
];
|
|
19
|
+
const containerTypes = ['window', 'iframe', 'embed', 'object'];
|
|
12
20
|
function longTask(entry) {
|
|
13
|
-
let type =
|
|
21
|
+
let type = '', src = '', id = '', name = '';
|
|
14
22
|
const container = entry.attribution[0];
|
|
15
23
|
if (container != null) {
|
|
16
24
|
type = container.containerType;
|
package/cjs/modules/mouse.d.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import type App from
|
|
1
|
+
import type App from '../app/index.js';
|
|
2
2
|
export default function (app: App): void;
|
package/cjs/modules/mouse.js
CHANGED
|
@@ -12,9 +12,10 @@ function _getSelector(target) {
|
|
|
12
12
|
return `#${el.id}` + (selector ? ` > ${selector}` : '');
|
|
13
13
|
}
|
|
14
14
|
selector =
|
|
15
|
-
el.className
|
|
16
|
-
.
|
|
17
|
-
.
|
|
15
|
+
el.className
|
|
16
|
+
.split(' ')
|
|
17
|
+
.map((cn) => cn.trim())
|
|
18
|
+
.filter((cn) => cn !== '')
|
|
18
19
|
.reduce((sel, cn) => `${sel}.${cn}`, el.tagName.toLowerCase()) +
|
|
19
20
|
(selector ? ` > ${selector}` : '');
|
|
20
21
|
if (el === document.body) {
|
|
@@ -26,12 +27,12 @@ function _getSelector(target) {
|
|
|
26
27
|
}
|
|
27
28
|
function isClickable(element) {
|
|
28
29
|
const tag = element.tagName.toUpperCase();
|
|
29
|
-
return tag === 'BUTTON' ||
|
|
30
|
+
return (tag === 'BUTTON' ||
|
|
30
31
|
tag === 'A' ||
|
|
31
32
|
tag === 'LI' ||
|
|
32
33
|
tag === 'SELECT' ||
|
|
33
34
|
element.onclick != null ||
|
|
34
|
-
element.getAttribute('role') === 'button';
|
|
35
|
+
element.getAttribute('role') === 'button');
|
|
35
36
|
//|| element.className.includes("btn")
|
|
36
37
|
// MBTODO: intersect addEventListener
|
|
37
38
|
}
|
|
@@ -66,8 +67,7 @@ function _getTarget(target) {
|
|
|
66
67
|
if (tag === 'INPUT') {
|
|
67
68
|
return element;
|
|
68
69
|
}
|
|
69
|
-
if (isClickable(element) ||
|
|
70
|
-
(0, utils_js_1.getLabelAttribute)(element) !== null) {
|
|
70
|
+
if (isClickable(element) || (0, utils_js_1.getLabelAttribute)(element) !== null) {
|
|
71
71
|
return element;
|
|
72
72
|
}
|
|
73
73
|
element = element.parentElement;
|
|
@@ -80,7 +80,7 @@ function default_1(app) {
|
|
|
80
80
|
if (dl !== null) {
|
|
81
81
|
return dl;
|
|
82
82
|
}
|
|
83
|
-
if ((0, guards_js_1.hasTag)(target,
|
|
83
|
+
if ((0, guards_js_1.hasTag)(target, 'INPUT')) {
|
|
84
84
|
return (0, input_js_1.getInputLabel)(target);
|
|
85
85
|
}
|
|
86
86
|
if (isClickable(target)) {
|
|
@@ -112,7 +112,7 @@ function default_1(app) {
|
|
|
112
112
|
};
|
|
113
113
|
const selectorMap = {};
|
|
114
114
|
function getSelector(id, target) {
|
|
115
|
-
return selectorMap[id] = selectorMap[id] || _getSelector(target);
|
|
115
|
+
return (selectorMap[id] = selectorMap[id] || _getSelector(target));
|
|
116
116
|
}
|
|
117
117
|
app.attachEventListener(document.documentElement, 'mouseover', (e) => {
|
|
118
118
|
const target = getTarget(e.target);
|
|
@@ -134,9 +134,7 @@ function default_1(app) {
|
|
|
134
134
|
const id = app.nodes.getID(target);
|
|
135
135
|
if (id !== undefined) {
|
|
136
136
|
sendMouseMove();
|
|
137
|
-
app.send(new messages_js_1.MouseClick(id, mouseTarget === target
|
|
138
|
-
? Math.round(performance.now() - mouseTargetTime)
|
|
139
|
-
: 0, getTargetLabel(target), getSelector(id, target)), true);
|
|
137
|
+
app.send(new messages_js_1.MouseClick(id, mouseTarget === target ? Math.round(performance.now() - mouseTargetTime) : 0, getTargetLabel(target), getSelector(id, target)), true);
|
|
140
138
|
}
|
|
141
139
|
mouseTarget = null;
|
|
142
140
|
});
|
package/cjs/modules/scroll.d.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import type App from
|
|
1
|
+
import type App from '../app/index.js';
|
|
2
2
|
export default function (app: App): void;
|
package/cjs/modules/timing.d.ts
CHANGED