clarity-js 0.8.42 → 0.8.44

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.
Files changed (116) hide show
  1. package/README.md +26 -26
  2. package/build/clarity.extended.js +1 -1
  3. package/build/clarity.insight.js +1 -1
  4. package/build/clarity.js +6101 -6071
  5. package/build/clarity.min.js +1 -1
  6. package/build/clarity.module.js +6101 -6071
  7. package/build/clarity.performance.js +1 -1
  8. package/package.json +70 -70
  9. package/rollup.config.ts +161 -161
  10. package/src/clarity.ts +65 -65
  11. package/src/core/api.ts +8 -8
  12. package/src/core/config.ts +29 -29
  13. package/src/core/copy.ts +3 -3
  14. package/src/core/dynamic.ts +13 -7
  15. package/src/core/event.ts +53 -53
  16. package/src/core/hash.ts +19 -19
  17. package/src/core/history.ts +71 -71
  18. package/src/core/index.ts +81 -81
  19. package/src/core/measure.ts +19 -19
  20. package/src/core/report.ts +28 -28
  21. package/src/core/scrub.ts +204 -202
  22. package/src/core/task.ts +181 -181
  23. package/src/core/throttle.ts +46 -46
  24. package/src/core/time.ts +26 -26
  25. package/src/core/timeout.ts +10 -10
  26. package/src/core/version.ts +2 -2
  27. package/src/data/baseline.ts +162 -162
  28. package/src/data/compress.ts +31 -31
  29. package/src/data/consent.ts +77 -77
  30. package/src/data/cookie.ts +90 -0
  31. package/src/data/custom.ts +23 -23
  32. package/src/data/dimension.ts +53 -53
  33. package/src/data/encode.ts +155 -155
  34. package/src/data/envelope.ts +53 -53
  35. package/src/data/extract.ts +211 -211
  36. package/src/data/index.ts +51 -50
  37. package/src/data/limit.ts +44 -44
  38. package/src/data/metadata.ts +321 -408
  39. package/src/data/metric.ts +51 -51
  40. package/src/data/ping.ts +36 -36
  41. package/src/data/signal.ts +30 -30
  42. package/src/data/summary.ts +34 -34
  43. package/src/data/token.ts +39 -39
  44. package/src/data/upgrade.ts +44 -44
  45. package/src/data/upload.ts +333 -333
  46. package/src/data/util.ts +18 -0
  47. package/src/data/variable.ts +83 -83
  48. package/src/diagnostic/encode.ts +40 -40
  49. package/src/diagnostic/fraud.ts +36 -36
  50. package/src/diagnostic/index.ts +13 -13
  51. package/src/diagnostic/internal.ts +28 -28
  52. package/src/diagnostic/script.ts +35 -35
  53. package/src/dynamic/agent/blank.ts +2 -2
  54. package/src/dynamic/agent/crisp.ts +40 -40
  55. package/src/dynamic/agent/encode.ts +25 -25
  56. package/src/dynamic/agent/index.ts +8 -8
  57. package/src/dynamic/agent/livechat.ts +58 -58
  58. package/src/dynamic/agent/tidio.ts +44 -44
  59. package/src/global.ts +6 -6
  60. package/src/index.ts +9 -9
  61. package/src/insight/blank.ts +14 -14
  62. package/src/insight/encode.ts +60 -60
  63. package/src/insight/snapshot.ts +114 -114
  64. package/src/interaction/change.ts +38 -38
  65. package/src/interaction/click.ts +173 -173
  66. package/src/interaction/clipboard.ts +32 -32
  67. package/src/interaction/encode.ts +210 -210
  68. package/src/interaction/index.ts +60 -60
  69. package/src/interaction/input.ts +57 -57
  70. package/src/interaction/pointer.ts +137 -137
  71. package/src/interaction/resize.ts +50 -50
  72. package/src/interaction/scroll.ts +129 -129
  73. package/src/interaction/selection.ts +66 -66
  74. package/src/interaction/submit.ts +30 -30
  75. package/src/interaction/timeline.ts +69 -69
  76. package/src/interaction/unload.ts +26 -26
  77. package/src/interaction/visibility.ts +27 -27
  78. package/src/layout/animation.ts +133 -133
  79. package/src/layout/custom.ts +42 -42
  80. package/src/layout/discover.ts +31 -31
  81. package/src/layout/document.ts +46 -46
  82. package/src/layout/dom.ts +439 -439
  83. package/src/layout/encode.ts +154 -154
  84. package/src/layout/index.ts +42 -42
  85. package/src/layout/mutation.ts +411 -411
  86. package/src/layout/node.ts +294 -294
  87. package/src/layout/offset.ts +19 -19
  88. package/src/layout/region.ts +151 -151
  89. package/src/layout/schema.ts +63 -63
  90. package/src/layout/selector.ts +82 -82
  91. package/src/layout/style.ts +159 -159
  92. package/src/layout/target.ts +32 -32
  93. package/src/layout/traverse.ts +27 -27
  94. package/src/performance/blank.ts +9 -9
  95. package/src/performance/encode.ts +31 -31
  96. package/src/performance/index.ts +12 -12
  97. package/src/performance/interaction.ts +125 -125
  98. package/src/performance/navigation.ts +31 -31
  99. package/src/performance/observer.ts +112 -112
  100. package/src/queue.ts +33 -33
  101. package/test/core.test.ts +139 -139
  102. package/test/helper.ts +162 -162
  103. package/test/html/core.html +27 -27
  104. package/test/stub.test.ts +7 -7
  105. package/test/tsconfig.test.json +5 -5
  106. package/tsconfig.json +21 -21
  107. package/tslint.json +32 -32
  108. package/types/agent.d.ts +39 -39
  109. package/types/core.d.ts +150 -150
  110. package/types/data.d.ts +572 -571
  111. package/types/diagnostic.d.ts +24 -24
  112. package/types/global.d.ts +30 -30
  113. package/types/index.d.ts +40 -40
  114. package/types/interaction.d.ts +177 -177
  115. package/types/layout.d.ts +276 -276
  116. package/types/performance.d.ts +31 -31
@@ -1,154 +1,154 @@
1
- import { Privacy, Task, Timer } from "@clarity-types/core";
2
- import { Event, Setting, Token } from "@clarity-types/data";
3
- import { Constant, NodeInfo, NodeValue } from "@clarity-types/layout";
4
- import config from "@src/core/config";
5
- import * as scrub from "@src/core/scrub";
6
- import * as task from "@src/core/task";
7
- import { time } from "@src/core/time";
8
- import tokenize from "@src/data/token";
9
- import * as baseline from "@src/data/baseline";
10
- import { queue } from "@src/data/upload";
11
- import * as fraud from "@src/diagnostic/fraud";
12
- import * as doc from "@src/layout/document";
13
- import * as dom from "@src/layout/dom";
14
- import * as region from "@src/layout/region";
15
- import * as style from "@src/layout/style";
16
- import * as animation from "@src/layout/animation";
17
- import * as custom from "@src/layout/custom";
18
-
19
- export default async function (type: Event, timer: Timer = null, ts: number = null): Promise<void> {
20
- let eventTime = ts || time()
21
- let tokens: Token[] = [eventTime, type];
22
- switch (type) {
23
- case Event.Document:
24
- let d = doc.data;
25
- tokens.push(d.width);
26
- tokens.push(d.height);
27
- baseline.track(type, d.width, d.height);
28
- queue(tokens);
29
- break;
30
- case Event.Region:
31
- for (let r of region.state) {
32
- tokens = [r.time, Event.Region];
33
- tokens.push(r.data.id);
34
- tokens.push(r.data.interaction);
35
- tokens.push(r.data.visibility);
36
- tokens.push(r.data.name);
37
- queue(tokens, false);
38
- }
39
- region.reset();
40
- break;
41
- case Event.StyleSheetAdoption:
42
- case Event.StyleSheetUpdate:
43
- for (let entry of style.sheetAdoptionState) {
44
- tokens = [entry.time, entry.event];
45
- tokens.push(entry.data.id);
46
- tokens.push(entry.data.operation);
47
- tokens.push(entry.data.newIds);
48
- queue(tokens);
49
- }
50
- for (let entry of style.sheetUpdateState) {
51
- tokens = [entry.time, entry.event];
52
- tokens.push(entry.data.id);
53
- tokens.push(entry.data.operation);
54
- tokens.push(entry.data.cssRules);
55
- queue(tokens, false);
56
- }
57
- style.reset();
58
- break;
59
- case Event.Animation:
60
- for (let entry of animation.state) {
61
- tokens = [entry.time, entry.event];
62
- tokens.push(entry.data.id);
63
- tokens.push(entry.data.operation);
64
- tokens.push(entry.data.keyFrames);
65
- tokens.push(entry.data.timing);
66
- tokens.push(entry.data.timeline);
67
- tokens.push(entry.data.targetId);
68
- queue(tokens);
69
- }
70
- animation.reset();
71
- break;
72
- case Event.Discover:
73
- case Event.Mutation:
74
- // Check if we are operating within the context of the current page
75
- if (task.state(timer) === Task.Stop) { break; }
76
- let values = dom.updates();
77
- // Only encode and queue DOM updates if we have valid updates to report back
78
- if (values.length > 0) {
79
- for (let value of values) {
80
- let state = task.state(timer);
81
- if (state === Task.Wait) { state = await task.suspend(timer); }
82
- if (state === Task.Stop) { break; }
83
- let data: NodeInfo = value.data;
84
- let active = value.metadata.active;
85
- let suspend = value.metadata.suspend;
86
- let privacy = value.metadata.privacy;
87
- let mangle = shouldMangle(value);
88
- let keys = active ? ["tag", "attributes", "value"] : ["tag"];
89
- for (let key of keys) {
90
- // we check for data[key] === '' because we want to encode empty strings as well, especially for value - which if skipped can cause our decoder to assume the final
91
- // attribute was the value for the node
92
- if (data[key] || data[key] === '') {
93
- switch (key) {
94
- case "tag":
95
- let box = size(value);
96
- let factor = mangle ? -1 : 1;
97
- tokens.push(value.id * factor);
98
- if (value.parent && active) {
99
- tokens.push(value.parent);
100
- if (value.previous) { tokens.push(value.previous); }
101
- }
102
- tokens.push(suspend ? Constant.SuspendMutationTag : data[key]);
103
- if (box && box.length === 2) { tokens.push(`${Constant.Hash}${str(box[0])}.${str(box[1])}`); }
104
- break;
105
- case "attributes":
106
- for (let attr in data[key]) {
107
- if (data[key][attr] !== undefined) {
108
- tokens.push(attribute(attr, data[key][attr], privacy));
109
- }
110
- }
111
- break;
112
- case "value":
113
- fraud.check(value.metadata.fraud, value.id, data[key]);
114
- tokens.push(scrub.text(data[key], data.tag, privacy, mangle));
115
- break;
116
- }
117
- }
118
- }
119
- }
120
- if (type === Event.Mutation) { baseline.activity(eventTime); }
121
- queue(tokenize(tokens), !config.lean);
122
- }
123
- break;
124
- case Event.CustomElement:
125
- for (let element of custom.elements) {
126
- queue([eventTime, Event.CustomElement, element]);
127
- }
128
- custom.reset();
129
- break;
130
- }
131
- }
132
-
133
- function shouldMangle(value: NodeValue): boolean {
134
- let privacy = value.metadata.privacy;
135
- return value.data.tag === Constant.TextTag && !(privacy === Privacy.None || privacy === Privacy.Sensitive);
136
- }
137
-
138
- function size(value: NodeValue): number[] {
139
- if (value.metadata.size !== null && value.metadata.size.length === 0) {
140
- let img = dom.getNode(value.id) as HTMLImageElement;
141
- if (img) {
142
- return [Math.floor(img.offsetWidth * Setting.BoxPrecision), Math.floor(img.offsetHeight * Setting.BoxPrecision)];
143
- }
144
- }
145
- return value.metadata.size;
146
- }
147
-
148
- function str(input: number): string {
149
- return input.toString(36);
150
- }
151
-
152
- function attribute(key: string, value: string, privacy: Privacy): string {
153
- return `${key}=${scrub.text(value, key.indexOf(Constant.DataAttribute) === 0 ? Constant.DataAttribute : key, privacy)}`;
154
- }
1
+ import { Privacy, Task, Timer } from "@clarity-types/core";
2
+ import { Event, Setting, Token } from "@clarity-types/data";
3
+ import { Constant, NodeInfo, NodeValue } from "@clarity-types/layout";
4
+ import config from "@src/core/config";
5
+ import * as scrub from "@src/core/scrub";
6
+ import * as task from "@src/core/task";
7
+ import { time } from "@src/core/time";
8
+ import tokenize from "@src/data/token";
9
+ import * as baseline from "@src/data/baseline";
10
+ import { queue } from "@src/data/upload";
11
+ import * as fraud from "@src/diagnostic/fraud";
12
+ import * as doc from "@src/layout/document";
13
+ import * as dom from "@src/layout/dom";
14
+ import * as region from "@src/layout/region";
15
+ import * as style from "@src/layout/style";
16
+ import * as animation from "@src/layout/animation";
17
+ import * as custom from "@src/layout/custom";
18
+
19
+ export default async function (type: Event, timer: Timer = null, ts: number = null): Promise<void> {
20
+ let eventTime = ts || time()
21
+ let tokens: Token[] = [eventTime, type];
22
+ switch (type) {
23
+ case Event.Document:
24
+ let d = doc.data;
25
+ tokens.push(d.width);
26
+ tokens.push(d.height);
27
+ baseline.track(type, d.width, d.height);
28
+ queue(tokens);
29
+ break;
30
+ case Event.Region:
31
+ for (let r of region.state) {
32
+ tokens = [r.time, Event.Region];
33
+ tokens.push(r.data.id);
34
+ tokens.push(r.data.interaction);
35
+ tokens.push(r.data.visibility);
36
+ tokens.push(r.data.name);
37
+ queue(tokens, false);
38
+ }
39
+ region.reset();
40
+ break;
41
+ case Event.StyleSheetAdoption:
42
+ case Event.StyleSheetUpdate:
43
+ for (let entry of style.sheetAdoptionState) {
44
+ tokens = [entry.time, entry.event];
45
+ tokens.push(entry.data.id);
46
+ tokens.push(entry.data.operation);
47
+ tokens.push(entry.data.newIds);
48
+ queue(tokens);
49
+ }
50
+ for (let entry of style.sheetUpdateState) {
51
+ tokens = [entry.time, entry.event];
52
+ tokens.push(entry.data.id);
53
+ tokens.push(entry.data.operation);
54
+ tokens.push(entry.data.cssRules);
55
+ queue(tokens, false);
56
+ }
57
+ style.reset();
58
+ break;
59
+ case Event.Animation:
60
+ for (let entry of animation.state) {
61
+ tokens = [entry.time, entry.event];
62
+ tokens.push(entry.data.id);
63
+ tokens.push(entry.data.operation);
64
+ tokens.push(entry.data.keyFrames);
65
+ tokens.push(entry.data.timing);
66
+ tokens.push(entry.data.timeline);
67
+ tokens.push(entry.data.targetId);
68
+ queue(tokens);
69
+ }
70
+ animation.reset();
71
+ break;
72
+ case Event.Discover:
73
+ case Event.Mutation:
74
+ // Check if we are operating within the context of the current page
75
+ if (task.state(timer) === Task.Stop) { break; }
76
+ let values = dom.updates();
77
+ // Only encode and queue DOM updates if we have valid updates to report back
78
+ if (values.length > 0) {
79
+ for (let value of values) {
80
+ let state = task.state(timer);
81
+ if (state === Task.Wait) { state = await task.suspend(timer); }
82
+ if (state === Task.Stop) { break; }
83
+ let data: NodeInfo = value.data;
84
+ let active = value.metadata.active;
85
+ let suspend = value.metadata.suspend;
86
+ let privacy = value.metadata.privacy;
87
+ let mangle = shouldMangle(value);
88
+ let keys = active ? ["tag", "attributes", "value"] : ["tag"];
89
+ for (let key of keys) {
90
+ // we check for data[key] === '' because we want to encode empty strings as well, especially for value - which if skipped can cause our decoder to assume the final
91
+ // attribute was the value for the node
92
+ if (data[key] || data[key] === '') {
93
+ switch (key) {
94
+ case "tag":
95
+ let box = size(value);
96
+ let factor = mangle ? -1 : 1;
97
+ tokens.push(value.id * factor);
98
+ if (value.parent && active) {
99
+ tokens.push(value.parent);
100
+ if (value.previous) { tokens.push(value.previous); }
101
+ }
102
+ tokens.push(suspend ? Constant.SuspendMutationTag : data[key]);
103
+ if (box && box.length === 2) { tokens.push(`${Constant.Hash}${str(box[0])}.${str(box[1])}`); }
104
+ break;
105
+ case "attributes":
106
+ for (let attr in data[key]) {
107
+ if (data[key][attr] !== undefined) {
108
+ tokens.push(attribute(attr, data[key][attr], privacy));
109
+ }
110
+ }
111
+ break;
112
+ case "value":
113
+ fraud.check(value.metadata.fraud, value.id, data[key]);
114
+ tokens.push(scrub.text(data[key], data.tag, privacy, mangle));
115
+ break;
116
+ }
117
+ }
118
+ }
119
+ }
120
+ if (type === Event.Mutation) { baseline.activity(eventTime); }
121
+ queue(tokenize(tokens), !config.lean);
122
+ }
123
+ break;
124
+ case Event.CustomElement:
125
+ for (let element of custom.elements) {
126
+ queue([eventTime, Event.CustomElement, element]);
127
+ }
128
+ custom.reset();
129
+ break;
130
+ }
131
+ }
132
+
133
+ function shouldMangle(value: NodeValue): boolean {
134
+ let privacy = value.metadata.privacy;
135
+ return value.data.tag === Constant.TextTag && !(privacy === Privacy.None || privacy === Privacy.Sensitive);
136
+ }
137
+
138
+ function size(value: NodeValue): number[] {
139
+ if (value.metadata.size !== null && value.metadata.size.length === 0) {
140
+ let img = dom.getNode(value.id) as HTMLImageElement;
141
+ if (img) {
142
+ return [Math.floor(img.offsetWidth * Setting.BoxPrecision), Math.floor(img.offsetHeight * Setting.BoxPrecision)];
143
+ }
144
+ }
145
+ return value.metadata.size;
146
+ }
147
+
148
+ function str(input: number): string {
149
+ return input.toString(36);
150
+ }
151
+
152
+ function attribute(key: string, value: string, privacy: Privacy): string {
153
+ return `${key}=${scrub.text(value, key.indexOf(Constant.DataAttribute) === 0 ? Constant.DataAttribute : key, privacy)}`;
154
+ }
@@ -1,42 +1,42 @@
1
- import * as discover from "@src/layout/discover";
2
- import * as doc from "@src/layout/document";
3
- import * as dom from "@src/layout/dom";
4
- import * as mutation from "@src/layout/mutation";
5
- import * as region from "@src/layout/region";
6
- import * as style from "@src/layout/style";
7
- import * as animation from "@src/layout/animation";
8
- import * as custom from "@src/layout/custom";
9
- import { bind } from "@src/core/event";
10
- import config from "@src/core/config";
11
-
12
- export { hashText } from "@src/layout/dom";
13
-
14
- export function start(): void {
15
- // The order below is important
16
- // and is determined by interdependencies of modules
17
- doc.start();
18
- region.start();
19
- dom.start();
20
- if (config.delayDom) {
21
- // Lazy load layout module as part of page load time performance improvements experiment
22
- bind(window, 'load', () => {
23
- mutation.start();
24
- });
25
- } else {
26
- mutation.start();
27
- }
28
- discover.start();
29
- style.start();
30
- animation.start();
31
- custom.start();
32
- }
33
-
34
- export function stop(): void {
35
- region.stop();
36
- dom.stop();
37
- mutation.stop();
38
- doc.stop();
39
- style.stop();
40
- animation.stop();
41
- custom.stop();
42
- }
1
+ import * as discover from "@src/layout/discover";
2
+ import * as doc from "@src/layout/document";
3
+ import * as dom from "@src/layout/dom";
4
+ import * as mutation from "@src/layout/mutation";
5
+ import * as region from "@src/layout/region";
6
+ import * as style from "@src/layout/style";
7
+ import * as animation from "@src/layout/animation";
8
+ import * as custom from "@src/layout/custom";
9
+ import { bind } from "@src/core/event";
10
+ import config from "@src/core/config";
11
+
12
+ export { hashText } from "@src/layout/dom";
13
+
14
+ export function start(): void {
15
+ // The order below is important
16
+ // and is determined by interdependencies of modules
17
+ doc.start();
18
+ region.start();
19
+ dom.start();
20
+ if (config.delayDom) {
21
+ // Lazy load layout module as part of page load time performance improvements experiment
22
+ bind(window, 'load', () => {
23
+ mutation.start();
24
+ });
25
+ } else {
26
+ mutation.start();
27
+ }
28
+ discover.start();
29
+ style.start();
30
+ animation.start();
31
+ custom.start();
32
+ }
33
+
34
+ export function stop(): void {
35
+ region.stop();
36
+ dom.stop();
37
+ mutation.stop();
38
+ doc.stop();
39
+ style.stop();
40
+ animation.stop();
41
+ custom.stop();
42
+ }