@atlaskit/editor-plugin-base 1.12.1 → 1.12.2
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/CHANGELOG.md +9 -0
- package/dist/cjs/plugin.js +2 -2
- package/dist/cjs/pm-plugins/frozen-editor.js +53 -85
- package/dist/cjs/utils/inputTrackingConfig.js +17 -0
- package/dist/es2019/plugin.js +2 -2
- package/dist/es2019/pm-plugins/frozen-editor.js +58 -90
- package/dist/es2019/utils/inputTrackingConfig.js +11 -0
- package/dist/esm/plugin.js +2 -2
- package/dist/esm/pm-plugins/frozen-editor.js +53 -85
- package/dist/esm/utils/inputTrackingConfig.js +11 -0
- package/dist/types/plugin.d.ts +6 -0
- package/dist/types/utils/inputTrackingConfig.d.ts +2 -0
- package/dist/types-ts4.5/plugin.d.ts +6 -0
- package/dist/types-ts4.5/utils/inputTrackingConfig.d.ts +2 -0
- package/package.json +3 -3
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,14 @@
|
|
|
1
1
|
# @atlaskit/editor-plugin-base
|
|
2
2
|
|
|
3
|
+
## 1.12.2
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [#154162](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/154162)
|
|
8
|
+
[`5982815965267`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/5982815965267) -
|
|
9
|
+
Updated performanceTracking and inputSampling props to hardcoded values as we're removing this
|
|
10
|
+
feature flag
|
|
11
|
+
|
|
3
12
|
## 1.12.1
|
|
4
13
|
|
|
5
14
|
### Patch Changes
|
package/dist/cjs/plugin.js
CHANGED
|
@@ -20,6 +20,7 @@ var _inlineCursorTarget = _interopRequireDefault(require("./pm-plugins/inline-cu
|
|
|
20
20
|
var _lazyNodeViewDecoration = require("./pm-plugins/lazy-node-view-decoration");
|
|
21
21
|
var _newlinePreserveMarks = _interopRequireDefault(require("./pm-plugins/newline-preserve-marks"));
|
|
22
22
|
var _scrollGutter = _interopRequireWildcard(require("./pm-plugins/scroll-gutter"));
|
|
23
|
+
var _inputTrackingConfig = require("./utils/inputTrackingConfig");
|
|
23
24
|
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
|
24
25
|
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
|
25
26
|
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
@@ -81,9 +82,8 @@ var basePlugin = function basePlugin(_ref) {
|
|
|
81
82
|
}, {
|
|
82
83
|
name: 'frozenEditor',
|
|
83
84
|
plugin: function plugin(_ref3) {
|
|
84
|
-
var _options$inputTrackin;
|
|
85
85
|
var dispatchAnalyticsEvent = _ref3.dispatchAnalyticsEvent;
|
|
86
|
-
return
|
|
86
|
+
return (0, _frozenEditor.default)(api === null || api === void 0 ? void 0 : api.contextIdentifier)(dispatchAnalyticsEvent, _inputTrackingConfig.inputTracking, undefined, undefined);
|
|
87
87
|
}
|
|
88
88
|
}, {
|
|
89
89
|
name: 'history',
|
|
@@ -50,14 +50,15 @@ var _default = exports.default = function _default(contextIdentifierPlugin) {
|
|
|
50
50
|
return function (dispatchAnalyticsEvent, inputTracking, browserFreezeTracking, ufo) {
|
|
51
51
|
var interactionType;
|
|
52
52
|
var inputLatencyTracker = null;
|
|
53
|
-
var inputLatencySingleKeyTracker = null;
|
|
54
|
-
var inputLatencyRenderedTracker = null;
|
|
55
53
|
if (browserFreezeTracking !== null && browserFreezeTracking !== void 0 && browserFreezeTracking.trackInteractionType) {
|
|
56
54
|
interactionType = (0, _frozenEditor.setInteractionType)(_analytics.BROWSER_FREEZE_INTERACTION_TYPE.LOADING);
|
|
57
55
|
}
|
|
58
56
|
var samplingRate = inputTracking && typeof inputTracking.samplingRate === 'number' ? inputTracking.samplingRate : DEFAULT_KEYSTROKE_SAMPLING_LIMIT;
|
|
59
|
-
|
|
60
|
-
|
|
57
|
+
|
|
58
|
+
//TODO: get right values here based on appearance
|
|
59
|
+
var slowThreshold = DEFAULT_SLOW_THRESHOLD;
|
|
60
|
+
//TODO: get right values here based on appearance
|
|
61
|
+
var freezeThreshold = DEFAULT_FREEZE_THRESHOLD;
|
|
61
62
|
var allowCountNodes = inputTracking && inputTracking.countNodes;
|
|
62
63
|
var prevNodeCountState = null;
|
|
63
64
|
var prevNodeCount = {};
|
|
@@ -134,19 +135,6 @@ var _default = exports.default = function _default(contextIdentifierPlugin) {
|
|
|
134
135
|
// Also this is called before browser rendering so it doesn't count it.
|
|
135
136
|
requestAnimationFrame(end);
|
|
136
137
|
}
|
|
137
|
-
if (inputLatencySingleKeyTracker) {
|
|
138
|
-
var _end = inputLatencySingleKeyTracker.start();
|
|
139
|
-
|
|
140
|
-
// This is executed before next handleTextInput when multiple keypress events are in one animation frame
|
|
141
|
-
// so it tracks individual keypress processing time
|
|
142
|
-
Promise.resolve().then(_end);
|
|
143
|
-
}
|
|
144
|
-
if (inputLatencyRenderedTracker) {
|
|
145
|
-
var _end2 = inputLatencyRenderedTracker.start();
|
|
146
|
-
|
|
147
|
-
// This is called at the next event loop so it counts browser rendering time.
|
|
148
|
-
setTimeout(_end2);
|
|
149
|
-
}
|
|
150
138
|
return false;
|
|
151
139
|
},
|
|
152
140
|
handleDOMEvents: browserFreezeTracking !== null && browserFreezeTracking !== void 0 && browserFreezeTracking.trackInteractionType ? {
|
|
@@ -164,75 +152,53 @@ var _default = exports.default = function _default(contextIdentifierPlugin) {
|
|
|
164
152
|
if (!(0, _isPerformanceApiAvailable.isPerformanceObserverAvailable)()) {
|
|
165
153
|
return {};
|
|
166
154
|
}
|
|
167
|
-
var experienceStore =
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
slowInput: true
|
|
186
|
-
});
|
|
187
|
-
}
|
|
188
|
-
experienceStore === null || experienceStore === void 0 || experienceStore.success(_ufo.EditorExperience.typing, _objectSpread(_objectSpread({
|
|
189
|
-
nodeSize: state.doc.nodeSize
|
|
190
|
-
}, nodesCount), {}, {
|
|
191
|
-
objectId: contextIdentifierPlugin === null || contextIdentifierPlugin === void 0 || (_contextIdentifierPlu4 = contextIdentifierPlugin.sharedState.currentState()) === null || _contextIdentifierPlu4 === void 0 || (_contextIdentifierPlu4 = _contextIdentifierPlu4.contextIdentifierProvider) === null || _contextIdentifierPlu4 === void 0 ? void 0 : _contextIdentifierPlu4.objectId,
|
|
192
|
-
time: time,
|
|
193
|
-
severity: shouldTrackSeverity ? severity : undefined
|
|
194
|
-
}));
|
|
195
|
-
},
|
|
196
|
-
dispatchSample: createDispatchSample(_analytics.ACTION.INPUT_PERF_SAMPLING, _view),
|
|
197
|
-
dispatchAverage: createDispatchAverage(_analytics.ACTION.INPUT_PERF_SAMPLING_AVG, _view),
|
|
198
|
-
onSlowInput: function onSlowInput(time) {
|
|
199
|
-
var _contextIdentifierPlu5;
|
|
200
|
-
var state = _view.state;
|
|
201
|
-
var nodesCount = getNodeCount(state);
|
|
202
|
-
dispatchAnalyticsEvent({
|
|
203
|
-
action: _analytics.ACTION.SLOW_INPUT,
|
|
204
|
-
actionSubject: _analytics.ACTION_SUBJECT.EDITOR,
|
|
205
|
-
attributes: _objectSpread(_objectSpread({
|
|
206
|
-
time: time,
|
|
207
|
-
nodeSize: state.doc.nodeSize
|
|
208
|
-
}, nodesCount), {}, {
|
|
209
|
-
objectId: contextIdentifierPlugin === null || contextIdentifierPlugin === void 0 || (_contextIdentifierPlu5 = contextIdentifierPlugin.sharedState.currentState()) === null || _contextIdentifierPlu5 === void 0 || (_contextIdentifierPlu5 = _contextIdentifierPlu5.contextIdentifierProvider) === null || _contextIdentifierPlu5 === void 0 ? void 0 : _contextIdentifierPlu5.objectId
|
|
210
|
-
}),
|
|
211
|
-
eventType: _analytics.EVENT_TYPE.OPERATIONAL
|
|
155
|
+
var experienceStore = _ufo.ExperienceStore.getInstance(_view);
|
|
156
|
+
inputLatencyTracker = new _inputLatencyTracking.default({
|
|
157
|
+
samplingRate: samplingRate,
|
|
158
|
+
slowThreshold: slowThreshold,
|
|
159
|
+
normalThreshold: severityThresholdNormal,
|
|
160
|
+
degradedThreshold: severityThresholdDegraded,
|
|
161
|
+
onSampleStart: function onSampleStart() {
|
|
162
|
+
experienceStore === null || experienceStore === void 0 || experienceStore.start(_ufo.EditorExperience.typing);
|
|
163
|
+
},
|
|
164
|
+
onSampleEnd: function onSampleEnd(time, _ref2) {
|
|
165
|
+
var _contextIdentifierPlu4;
|
|
166
|
+
var isSlow = _ref2.isSlow,
|
|
167
|
+
severity = _ref2.severity;
|
|
168
|
+
var state = _view.state;
|
|
169
|
+
var nodesCount = getNodeCount(state);
|
|
170
|
+
if (isSlow) {
|
|
171
|
+
experienceStore === null || experienceStore === void 0 || experienceStore.addMetadata(_ufo.EditorExperience.typing, {
|
|
172
|
+
slowInput: true
|
|
212
173
|
});
|
|
213
174
|
}
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
175
|
+
experienceStore === null || experienceStore === void 0 || experienceStore.success(_ufo.EditorExperience.typing, _objectSpread(_objectSpread({
|
|
176
|
+
nodeSize: state.doc.nodeSize
|
|
177
|
+
}, nodesCount), {}, {
|
|
178
|
+
objectId: contextIdentifierPlugin === null || contextIdentifierPlugin === void 0 || (_contextIdentifierPlu4 = contextIdentifierPlugin.sharedState.currentState()) === null || _contextIdentifierPlu4 === void 0 || (_contextIdentifierPlu4 = _contextIdentifierPlu4.contextIdentifierProvider) === null || _contextIdentifierPlu4 === void 0 ? void 0 : _contextIdentifierPlu4.objectId,
|
|
179
|
+
time: time,
|
|
180
|
+
severity: shouldTrackSeverity ? severity : undefined
|
|
181
|
+
}));
|
|
182
|
+
},
|
|
183
|
+
dispatchSample: createDispatchSample(_analytics.ACTION.INPUT_PERF_SAMPLING, _view),
|
|
184
|
+
dispatchAverage: createDispatchAverage(_analytics.ACTION.INPUT_PERF_SAMPLING_AVG, _view),
|
|
185
|
+
onSlowInput: function onSlowInput(time) {
|
|
186
|
+
var _contextIdentifierPlu5;
|
|
187
|
+
var state = _view.state;
|
|
188
|
+
var nodesCount = getNodeCount(state);
|
|
189
|
+
dispatchAnalyticsEvent({
|
|
190
|
+
action: _analytics.ACTION.SLOW_INPUT,
|
|
191
|
+
actionSubject: _analytics.ACTION_SUBJECT.EDITOR,
|
|
192
|
+
attributes: _objectSpread(_objectSpread({
|
|
193
|
+
time: time,
|
|
194
|
+
nodeSize: state.doc.nodeSize
|
|
195
|
+
}, nodesCount), {}, {
|
|
196
|
+
objectId: contextIdentifierPlugin === null || contextIdentifierPlugin === void 0 || (_contextIdentifierPlu5 = contextIdentifierPlugin.sharedState.currentState()) === null || _contextIdentifierPlu5 === void 0 || (_contextIdentifierPlu5 = _contextIdentifierPlu5.contextIdentifierProvider) === null || _contextIdentifierPlu5 === void 0 ? void 0 : _contextIdentifierPlu5.objectId
|
|
197
|
+
}),
|
|
198
|
+
eventType: _analytics.EVENT_TYPE.OPERATIONAL
|
|
199
|
+
});
|
|
200
|
+
}
|
|
201
|
+
});
|
|
236
202
|
var observer;
|
|
237
203
|
try {
|
|
238
204
|
observer = new PerformanceObserver(function (list) {
|
|
@@ -240,7 +206,9 @@ var _default = exports.default = function _default(contextIdentifierPlugin) {
|
|
|
240
206
|
for (var i = 0; i < perfEntries.length; i++) {
|
|
241
207
|
var duration = perfEntries[i].duration;
|
|
242
208
|
if (duration > freezeThreshold) {
|
|
243
|
-
dispatchLongTaskEvent(contextIdentifierPlugin)(dispatchAnalyticsEvent, _view, duration, getNodeCount, browserFreezeTracking !== null && browserFreezeTracking !== void 0 && browserFreezeTracking.trackInteractionType ? interactionType : undefined,
|
|
209
|
+
dispatchLongTaskEvent(contextIdentifierPlugin)(dispatchAnalyticsEvent, _view, duration, getNodeCount, browserFreezeTracking !== null && browserFreezeTracking !== void 0 && browserFreezeTracking.trackInteractionType ? interactionType : undefined, (0, _analytics2.getAnalyticsEventSeverity)(duration,
|
|
210
|
+
//TODO: get right values here
|
|
211
|
+
severityThresholdNormal, severityThresholdDegraded));
|
|
244
212
|
}
|
|
245
213
|
}
|
|
246
214
|
});
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.inputTracking = void 0;
|
|
7
|
+
var inputTracking = exports.inputTracking = {
|
|
8
|
+
enabled: true,
|
|
9
|
+
samplingRate: 100,
|
|
10
|
+
countNodes: true,
|
|
11
|
+
trackSeverity: true,
|
|
12
|
+
trackRenderingTime: false,
|
|
13
|
+
trackSingleKeypress: false,
|
|
14
|
+
// TODO: change this based on appearance due to SLOs - need to make ticket for both
|
|
15
|
+
severityDegradedThreshold: 273,
|
|
16
|
+
severityNormalThreshold: 143
|
|
17
|
+
};
|
package/dist/es2019/plugin.js
CHANGED
|
@@ -11,6 +11,7 @@ import inlineCursorTargetPlugin from './pm-plugins/inline-cursor-target';
|
|
|
11
11
|
import { createLazyNodeViewDecorationPlugin } from './pm-plugins/lazy-node-view-decoration';
|
|
12
12
|
import newlinePreserveMarksPlugin from './pm-plugins/newline-preserve-marks';
|
|
13
13
|
import scrollGutter, { getKeyboardHeight } from './pm-plugins/scroll-gutter';
|
|
14
|
+
import { inputTracking } from './utils/inputTrackingConfig';
|
|
14
15
|
const basePlugin = ({
|
|
15
16
|
config: options,
|
|
16
17
|
api
|
|
@@ -66,8 +67,7 @@ const basePlugin = ({
|
|
|
66
67
|
plugin: ({
|
|
67
68
|
dispatchAnalyticsEvent
|
|
68
69
|
}) => {
|
|
69
|
-
|
|
70
|
-
return options !== null && options !== void 0 && (_options$inputTrackin = options.inputTracking) !== null && _options$inputTrackin !== void 0 && _options$inputTrackin.enabled || options !== null && options !== void 0 && options.ufo ? frozenEditor(api === null || api === void 0 ? void 0 : api.contextIdentifier)(dispatchAnalyticsEvent, options.inputTracking, options.browserFreezeTracking, options.ufo) : undefined;
|
|
70
|
+
return frozenEditor(api === null || api === void 0 ? void 0 : api.contextIdentifier)(dispatchAnalyticsEvent, inputTracking, undefined, undefined);
|
|
71
71
|
}
|
|
72
72
|
}, {
|
|
73
73
|
name: 'history',
|
|
@@ -39,14 +39,15 @@ const dispatchLongTaskEvent = contextIdentifierPlugin => (dispatchAnalyticsEvent
|
|
|
39
39
|
export default (contextIdentifierPlugin => (dispatchAnalyticsEvent, inputTracking, browserFreezeTracking, ufo) => {
|
|
40
40
|
let interactionType;
|
|
41
41
|
let inputLatencyTracker = null;
|
|
42
|
-
let inputLatencySingleKeyTracker = null;
|
|
43
|
-
let inputLatencyRenderedTracker = null;
|
|
44
42
|
if (browserFreezeTracking !== null && browserFreezeTracking !== void 0 && browserFreezeTracking.trackInteractionType) {
|
|
45
43
|
interactionType = setInteractionType(BROWSER_FREEZE_INTERACTION_TYPE.LOADING);
|
|
46
44
|
}
|
|
47
45
|
const samplingRate = inputTracking && typeof inputTracking.samplingRate === 'number' ? inputTracking.samplingRate : DEFAULT_KEYSTROKE_SAMPLING_LIMIT;
|
|
48
|
-
|
|
49
|
-
|
|
46
|
+
|
|
47
|
+
//TODO: get right values here based on appearance
|
|
48
|
+
const slowThreshold = DEFAULT_SLOW_THRESHOLD;
|
|
49
|
+
//TODO: get right values here based on appearance
|
|
50
|
+
const freezeThreshold = DEFAULT_FREEZE_THRESHOLD;
|
|
50
51
|
const allowCountNodes = inputTracking && inputTracking.countNodes;
|
|
51
52
|
let prevNodeCountState = null;
|
|
52
53
|
let prevNodeCount = {};
|
|
@@ -124,19 +125,6 @@ export default (contextIdentifierPlugin => (dispatchAnalyticsEvent, inputTrackin
|
|
|
124
125
|
// Also this is called before browser rendering so it doesn't count it.
|
|
125
126
|
requestAnimationFrame(end);
|
|
126
127
|
}
|
|
127
|
-
if (inputLatencySingleKeyTracker) {
|
|
128
|
-
const end = inputLatencySingleKeyTracker.start();
|
|
129
|
-
|
|
130
|
-
// This is executed before next handleTextInput when multiple keypress events are in one animation frame
|
|
131
|
-
// so it tracks individual keypress processing time
|
|
132
|
-
Promise.resolve().then(end);
|
|
133
|
-
}
|
|
134
|
-
if (inputLatencyRenderedTracker) {
|
|
135
|
-
const end = inputLatencyRenderedTracker.start();
|
|
136
|
-
|
|
137
|
-
// This is called at the next event loop so it counts browser rendering time.
|
|
138
|
-
setTimeout(end);
|
|
139
|
-
}
|
|
140
128
|
return false;
|
|
141
129
|
},
|
|
142
130
|
handleDOMEvents: browserFreezeTracking !== null && browserFreezeTracking !== void 0 && browserFreezeTracking.trackInteractionType ? {
|
|
@@ -154,80 +142,58 @@ export default (contextIdentifierPlugin => (dispatchAnalyticsEvent, inputTrackin
|
|
|
154
142
|
if (!isPerformanceObserverAvailable()) {
|
|
155
143
|
return {};
|
|
156
144
|
}
|
|
157
|
-
const experienceStore =
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
slowInput: true
|
|
179
|
-
});
|
|
180
|
-
}
|
|
181
|
-
experienceStore === null || experienceStore === void 0 ? void 0 : experienceStore.success(EditorExperience.typing, {
|
|
182
|
-
nodeSize: state.doc.nodeSize,
|
|
183
|
-
...nodesCount,
|
|
184
|
-
objectId: contextIdentifierPlugin === null || contextIdentifierPlugin === void 0 ? void 0 : (_contextIdentifierPlu7 = contextIdentifierPlugin.sharedState.currentState()) === null || _contextIdentifierPlu7 === void 0 ? void 0 : (_contextIdentifierPlu8 = _contextIdentifierPlu7.contextIdentifierProvider) === null || _contextIdentifierPlu8 === void 0 ? void 0 : _contextIdentifierPlu8.objectId,
|
|
185
|
-
time,
|
|
186
|
-
severity: shouldTrackSeverity ? severity : undefined
|
|
187
|
-
});
|
|
188
|
-
},
|
|
189
|
-
dispatchSample: createDispatchSample(ACTION.INPUT_PERF_SAMPLING, view),
|
|
190
|
-
dispatchAverage: createDispatchAverage(ACTION.INPUT_PERF_SAMPLING_AVG, view),
|
|
191
|
-
onSlowInput: time => {
|
|
192
|
-
var _contextIdentifierPlu9, _contextIdentifierPlu10;
|
|
193
|
-
const {
|
|
194
|
-
state
|
|
195
|
-
} = view;
|
|
196
|
-
const nodesCount = getNodeCount(state);
|
|
197
|
-
dispatchAnalyticsEvent({
|
|
198
|
-
action: ACTION.SLOW_INPUT,
|
|
199
|
-
actionSubject: ACTION_SUBJECT.EDITOR,
|
|
200
|
-
attributes: {
|
|
201
|
-
time,
|
|
202
|
-
nodeSize: state.doc.nodeSize,
|
|
203
|
-
...nodesCount,
|
|
204
|
-
objectId: contextIdentifierPlugin === null || contextIdentifierPlugin === void 0 ? void 0 : (_contextIdentifierPlu9 = contextIdentifierPlugin.sharedState.currentState()) === null || _contextIdentifierPlu9 === void 0 ? void 0 : (_contextIdentifierPlu10 = _contextIdentifierPlu9.contextIdentifierProvider) === null || _contextIdentifierPlu10 === void 0 ? void 0 : _contextIdentifierPlu10.objectId
|
|
205
|
-
},
|
|
206
|
-
eventType: EVENT_TYPE.OPERATIONAL
|
|
145
|
+
const experienceStore = ExperienceStore.getInstance(view);
|
|
146
|
+
inputLatencyTracker = new InputLatencyTracker({
|
|
147
|
+
samplingRate,
|
|
148
|
+
slowThreshold,
|
|
149
|
+
normalThreshold: severityThresholdNormal,
|
|
150
|
+
degradedThreshold: severityThresholdDegraded,
|
|
151
|
+
onSampleStart: () => {
|
|
152
|
+
experienceStore === null || experienceStore === void 0 ? void 0 : experienceStore.start(EditorExperience.typing);
|
|
153
|
+
},
|
|
154
|
+
onSampleEnd: (time, {
|
|
155
|
+
isSlow,
|
|
156
|
+
severity
|
|
157
|
+
}) => {
|
|
158
|
+
var _contextIdentifierPlu7, _contextIdentifierPlu8;
|
|
159
|
+
const {
|
|
160
|
+
state
|
|
161
|
+
} = view;
|
|
162
|
+
const nodesCount = getNodeCount(state);
|
|
163
|
+
if (isSlow) {
|
|
164
|
+
experienceStore === null || experienceStore === void 0 ? void 0 : experienceStore.addMetadata(EditorExperience.typing, {
|
|
165
|
+
slowInput: true
|
|
207
166
|
});
|
|
208
167
|
}
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
168
|
+
experienceStore === null || experienceStore === void 0 ? void 0 : experienceStore.success(EditorExperience.typing, {
|
|
169
|
+
nodeSize: state.doc.nodeSize,
|
|
170
|
+
...nodesCount,
|
|
171
|
+
objectId: contextIdentifierPlugin === null || contextIdentifierPlugin === void 0 ? void 0 : (_contextIdentifierPlu7 = contextIdentifierPlugin.sharedState.currentState()) === null || _contextIdentifierPlu7 === void 0 ? void 0 : (_contextIdentifierPlu8 = _contextIdentifierPlu7.contextIdentifierProvider) === null || _contextIdentifierPlu8 === void 0 ? void 0 : _contextIdentifierPlu8.objectId,
|
|
172
|
+
time,
|
|
173
|
+
severity: shouldTrackSeverity ? severity : undefined
|
|
174
|
+
});
|
|
175
|
+
},
|
|
176
|
+
dispatchSample: createDispatchSample(ACTION.INPUT_PERF_SAMPLING, view),
|
|
177
|
+
dispatchAverage: createDispatchAverage(ACTION.INPUT_PERF_SAMPLING_AVG, view),
|
|
178
|
+
onSlowInput: time => {
|
|
179
|
+
var _contextIdentifierPlu9, _contextIdentifierPlu10;
|
|
180
|
+
const {
|
|
181
|
+
state
|
|
182
|
+
} = view;
|
|
183
|
+
const nodesCount = getNodeCount(state);
|
|
184
|
+
dispatchAnalyticsEvent({
|
|
185
|
+
action: ACTION.SLOW_INPUT,
|
|
186
|
+
actionSubject: ACTION_SUBJECT.EDITOR,
|
|
187
|
+
attributes: {
|
|
188
|
+
time,
|
|
189
|
+
nodeSize: state.doc.nodeSize,
|
|
190
|
+
...nodesCount,
|
|
191
|
+
objectId: contextIdentifierPlugin === null || contextIdentifierPlugin === void 0 ? void 0 : (_contextIdentifierPlu9 = contextIdentifierPlugin.sharedState.currentState()) === null || _contextIdentifierPlu9 === void 0 ? void 0 : (_contextIdentifierPlu10 = _contextIdentifierPlu9.contextIdentifierProvider) === null || _contextIdentifierPlu10 === void 0 ? void 0 : _contextIdentifierPlu10.objectId
|
|
192
|
+
},
|
|
193
|
+
eventType: EVENT_TYPE.OPERATIONAL
|
|
194
|
+
});
|
|
195
|
+
}
|
|
196
|
+
});
|
|
231
197
|
let observer;
|
|
232
198
|
try {
|
|
233
199
|
observer = new PerformanceObserver(list => {
|
|
@@ -237,7 +203,9 @@ export default (contextIdentifierPlugin => (dispatchAnalyticsEvent, inputTrackin
|
|
|
237
203
|
duration
|
|
238
204
|
} = perfEntries[i];
|
|
239
205
|
if (duration > freezeThreshold) {
|
|
240
|
-
dispatchLongTaskEvent(contextIdentifierPlugin)(dispatchAnalyticsEvent, view, duration, getNodeCount, browserFreezeTracking !== null && browserFreezeTracking !== void 0 && browserFreezeTracking.trackInteractionType ? interactionType : undefined,
|
|
206
|
+
dispatchLongTaskEvent(contextIdentifierPlugin)(dispatchAnalyticsEvent, view, duration, getNodeCount, browserFreezeTracking !== null && browserFreezeTracking !== void 0 && browserFreezeTracking.trackInteractionType ? interactionType : undefined, getAnalyticsEventSeverity(duration,
|
|
207
|
+
//TODO: get right values here
|
|
208
|
+
severityThresholdNormal, severityThresholdDegraded));
|
|
241
209
|
}
|
|
242
210
|
}
|
|
243
211
|
});
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
export const inputTracking = {
|
|
2
|
+
enabled: true,
|
|
3
|
+
samplingRate: 100,
|
|
4
|
+
countNodes: true,
|
|
5
|
+
trackSeverity: true,
|
|
6
|
+
trackRenderingTime: false,
|
|
7
|
+
trackSingleKeypress: false,
|
|
8
|
+
// TODO: change this based on appearance due to SLOs - need to make ticket for both
|
|
9
|
+
severityDegradedThreshold: 273,
|
|
10
|
+
severityNormalThreshold: 143
|
|
11
|
+
};
|
package/dist/esm/plugin.js
CHANGED
|
@@ -14,6 +14,7 @@ import inlineCursorTargetPlugin from './pm-plugins/inline-cursor-target';
|
|
|
14
14
|
import { createLazyNodeViewDecorationPlugin } from './pm-plugins/lazy-node-view-decoration';
|
|
15
15
|
import newlinePreserveMarksPlugin from './pm-plugins/newline-preserve-marks';
|
|
16
16
|
import scrollGutter, { getKeyboardHeight } from './pm-plugins/scroll-gutter';
|
|
17
|
+
import { inputTracking } from './utils/inputTrackingConfig';
|
|
17
18
|
var basePlugin = function basePlugin(_ref) {
|
|
18
19
|
var _api$featureFlags;
|
|
19
20
|
var options = _ref.config,
|
|
@@ -71,9 +72,8 @@ var basePlugin = function basePlugin(_ref) {
|
|
|
71
72
|
}, {
|
|
72
73
|
name: 'frozenEditor',
|
|
73
74
|
plugin: function plugin(_ref3) {
|
|
74
|
-
var _options$inputTrackin;
|
|
75
75
|
var dispatchAnalyticsEvent = _ref3.dispatchAnalyticsEvent;
|
|
76
|
-
return
|
|
76
|
+
return frozenEditor(api === null || api === void 0 ? void 0 : api.contextIdentifier)(dispatchAnalyticsEvent, inputTracking, undefined, undefined);
|
|
77
77
|
}
|
|
78
78
|
}, {
|
|
79
79
|
name: 'history',
|
|
@@ -43,14 +43,15 @@ export default (function (contextIdentifierPlugin) {
|
|
|
43
43
|
return function (dispatchAnalyticsEvent, inputTracking, browserFreezeTracking, ufo) {
|
|
44
44
|
var interactionType;
|
|
45
45
|
var inputLatencyTracker = null;
|
|
46
|
-
var inputLatencySingleKeyTracker = null;
|
|
47
|
-
var inputLatencyRenderedTracker = null;
|
|
48
46
|
if (browserFreezeTracking !== null && browserFreezeTracking !== void 0 && browserFreezeTracking.trackInteractionType) {
|
|
49
47
|
interactionType = setInteractionType(BROWSER_FREEZE_INTERACTION_TYPE.LOADING);
|
|
50
48
|
}
|
|
51
49
|
var samplingRate = inputTracking && typeof inputTracking.samplingRate === 'number' ? inputTracking.samplingRate : DEFAULT_KEYSTROKE_SAMPLING_LIMIT;
|
|
52
|
-
|
|
53
|
-
|
|
50
|
+
|
|
51
|
+
//TODO: get right values here based on appearance
|
|
52
|
+
var slowThreshold = DEFAULT_SLOW_THRESHOLD;
|
|
53
|
+
//TODO: get right values here based on appearance
|
|
54
|
+
var freezeThreshold = DEFAULT_FREEZE_THRESHOLD;
|
|
54
55
|
var allowCountNodes = inputTracking && inputTracking.countNodes;
|
|
55
56
|
var prevNodeCountState = null;
|
|
56
57
|
var prevNodeCount = {};
|
|
@@ -127,19 +128,6 @@ export default (function (contextIdentifierPlugin) {
|
|
|
127
128
|
// Also this is called before browser rendering so it doesn't count it.
|
|
128
129
|
requestAnimationFrame(end);
|
|
129
130
|
}
|
|
130
|
-
if (inputLatencySingleKeyTracker) {
|
|
131
|
-
var _end = inputLatencySingleKeyTracker.start();
|
|
132
|
-
|
|
133
|
-
// This is executed before next handleTextInput when multiple keypress events are in one animation frame
|
|
134
|
-
// so it tracks individual keypress processing time
|
|
135
|
-
Promise.resolve().then(_end);
|
|
136
|
-
}
|
|
137
|
-
if (inputLatencyRenderedTracker) {
|
|
138
|
-
var _end2 = inputLatencyRenderedTracker.start();
|
|
139
|
-
|
|
140
|
-
// This is called at the next event loop so it counts browser rendering time.
|
|
141
|
-
setTimeout(_end2);
|
|
142
|
-
}
|
|
143
131
|
return false;
|
|
144
132
|
},
|
|
145
133
|
handleDOMEvents: browserFreezeTracking !== null && browserFreezeTracking !== void 0 && browserFreezeTracking.trackInteractionType ? {
|
|
@@ -157,75 +145,53 @@ export default (function (contextIdentifierPlugin) {
|
|
|
157
145
|
if (!isPerformanceObserverAvailable()) {
|
|
158
146
|
return {};
|
|
159
147
|
}
|
|
160
|
-
var experienceStore =
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
slowInput: true
|
|
179
|
-
});
|
|
180
|
-
}
|
|
181
|
-
experienceStore === null || experienceStore === void 0 || experienceStore.success(EditorExperience.typing, _objectSpread(_objectSpread({
|
|
182
|
-
nodeSize: state.doc.nodeSize
|
|
183
|
-
}, nodesCount), {}, {
|
|
184
|
-
objectId: contextIdentifierPlugin === null || contextIdentifierPlugin === void 0 || (_contextIdentifierPlu4 = contextIdentifierPlugin.sharedState.currentState()) === null || _contextIdentifierPlu4 === void 0 || (_contextIdentifierPlu4 = _contextIdentifierPlu4.contextIdentifierProvider) === null || _contextIdentifierPlu4 === void 0 ? void 0 : _contextIdentifierPlu4.objectId,
|
|
185
|
-
time: time,
|
|
186
|
-
severity: shouldTrackSeverity ? severity : undefined
|
|
187
|
-
}));
|
|
188
|
-
},
|
|
189
|
-
dispatchSample: createDispatchSample(ACTION.INPUT_PERF_SAMPLING, _view),
|
|
190
|
-
dispatchAverage: createDispatchAverage(ACTION.INPUT_PERF_SAMPLING_AVG, _view),
|
|
191
|
-
onSlowInput: function onSlowInput(time) {
|
|
192
|
-
var _contextIdentifierPlu5;
|
|
193
|
-
var state = _view.state;
|
|
194
|
-
var nodesCount = getNodeCount(state);
|
|
195
|
-
dispatchAnalyticsEvent({
|
|
196
|
-
action: ACTION.SLOW_INPUT,
|
|
197
|
-
actionSubject: ACTION_SUBJECT.EDITOR,
|
|
198
|
-
attributes: _objectSpread(_objectSpread({
|
|
199
|
-
time: time,
|
|
200
|
-
nodeSize: state.doc.nodeSize
|
|
201
|
-
}, nodesCount), {}, {
|
|
202
|
-
objectId: contextIdentifierPlugin === null || contextIdentifierPlugin === void 0 || (_contextIdentifierPlu5 = contextIdentifierPlugin.sharedState.currentState()) === null || _contextIdentifierPlu5 === void 0 || (_contextIdentifierPlu5 = _contextIdentifierPlu5.contextIdentifierProvider) === null || _contextIdentifierPlu5 === void 0 ? void 0 : _contextIdentifierPlu5.objectId
|
|
203
|
-
}),
|
|
204
|
-
eventType: EVENT_TYPE.OPERATIONAL
|
|
148
|
+
var experienceStore = ExperienceStore.getInstance(_view);
|
|
149
|
+
inputLatencyTracker = new InputLatencyTracker({
|
|
150
|
+
samplingRate: samplingRate,
|
|
151
|
+
slowThreshold: slowThreshold,
|
|
152
|
+
normalThreshold: severityThresholdNormal,
|
|
153
|
+
degradedThreshold: severityThresholdDegraded,
|
|
154
|
+
onSampleStart: function onSampleStart() {
|
|
155
|
+
experienceStore === null || experienceStore === void 0 || experienceStore.start(EditorExperience.typing);
|
|
156
|
+
},
|
|
157
|
+
onSampleEnd: function onSampleEnd(time, _ref2) {
|
|
158
|
+
var _contextIdentifierPlu4;
|
|
159
|
+
var isSlow = _ref2.isSlow,
|
|
160
|
+
severity = _ref2.severity;
|
|
161
|
+
var state = _view.state;
|
|
162
|
+
var nodesCount = getNodeCount(state);
|
|
163
|
+
if (isSlow) {
|
|
164
|
+
experienceStore === null || experienceStore === void 0 || experienceStore.addMetadata(EditorExperience.typing, {
|
|
165
|
+
slowInput: true
|
|
205
166
|
});
|
|
206
167
|
}
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
168
|
+
experienceStore === null || experienceStore === void 0 || experienceStore.success(EditorExperience.typing, _objectSpread(_objectSpread({
|
|
169
|
+
nodeSize: state.doc.nodeSize
|
|
170
|
+
}, nodesCount), {}, {
|
|
171
|
+
objectId: contextIdentifierPlugin === null || contextIdentifierPlugin === void 0 || (_contextIdentifierPlu4 = contextIdentifierPlugin.sharedState.currentState()) === null || _contextIdentifierPlu4 === void 0 || (_contextIdentifierPlu4 = _contextIdentifierPlu4.contextIdentifierProvider) === null || _contextIdentifierPlu4 === void 0 ? void 0 : _contextIdentifierPlu4.objectId,
|
|
172
|
+
time: time,
|
|
173
|
+
severity: shouldTrackSeverity ? severity : undefined
|
|
174
|
+
}));
|
|
175
|
+
},
|
|
176
|
+
dispatchSample: createDispatchSample(ACTION.INPUT_PERF_SAMPLING, _view),
|
|
177
|
+
dispatchAverage: createDispatchAverage(ACTION.INPUT_PERF_SAMPLING_AVG, _view),
|
|
178
|
+
onSlowInput: function onSlowInput(time) {
|
|
179
|
+
var _contextIdentifierPlu5;
|
|
180
|
+
var state = _view.state;
|
|
181
|
+
var nodesCount = getNodeCount(state);
|
|
182
|
+
dispatchAnalyticsEvent({
|
|
183
|
+
action: ACTION.SLOW_INPUT,
|
|
184
|
+
actionSubject: ACTION_SUBJECT.EDITOR,
|
|
185
|
+
attributes: _objectSpread(_objectSpread({
|
|
186
|
+
time: time,
|
|
187
|
+
nodeSize: state.doc.nodeSize
|
|
188
|
+
}, nodesCount), {}, {
|
|
189
|
+
objectId: contextIdentifierPlugin === null || contextIdentifierPlugin === void 0 || (_contextIdentifierPlu5 = contextIdentifierPlugin.sharedState.currentState()) === null || _contextIdentifierPlu5 === void 0 || (_contextIdentifierPlu5 = _contextIdentifierPlu5.contextIdentifierProvider) === null || _contextIdentifierPlu5 === void 0 ? void 0 : _contextIdentifierPlu5.objectId
|
|
190
|
+
}),
|
|
191
|
+
eventType: EVENT_TYPE.OPERATIONAL
|
|
192
|
+
});
|
|
193
|
+
}
|
|
194
|
+
});
|
|
229
195
|
var observer;
|
|
230
196
|
try {
|
|
231
197
|
observer = new PerformanceObserver(function (list) {
|
|
@@ -233,7 +199,9 @@ export default (function (contextIdentifierPlugin) {
|
|
|
233
199
|
for (var i = 0; i < perfEntries.length; i++) {
|
|
234
200
|
var duration = perfEntries[i].duration;
|
|
235
201
|
if (duration > freezeThreshold) {
|
|
236
|
-
dispatchLongTaskEvent(contextIdentifierPlugin)(dispatchAnalyticsEvent, _view, duration, getNodeCount, browserFreezeTracking !== null && browserFreezeTracking !== void 0 && browserFreezeTracking.trackInteractionType ? interactionType : undefined,
|
|
202
|
+
dispatchLongTaskEvent(contextIdentifierPlugin)(dispatchAnalyticsEvent, _view, duration, getNodeCount, browserFreezeTracking !== null && browserFreezeTracking !== void 0 && browserFreezeTracking.trackInteractionType ? interactionType : undefined, getAnalyticsEventSeverity(duration,
|
|
203
|
+
//TODO: get right values here
|
|
204
|
+
severityThresholdNormal, severityThresholdDegraded));
|
|
237
205
|
}
|
|
238
206
|
}
|
|
239
207
|
});
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
export var inputTracking = {
|
|
2
|
+
enabled: true,
|
|
3
|
+
samplingRate: 100,
|
|
4
|
+
countNodes: true,
|
|
5
|
+
trackSeverity: true,
|
|
6
|
+
trackRenderingTime: false,
|
|
7
|
+
trackSingleKeypress: false,
|
|
8
|
+
// TODO: change this based on appearance due to SLOs - need to make ticket for both
|
|
9
|
+
severityDegradedThreshold: 273,
|
|
10
|
+
severityNormalThreshold: 143
|
|
11
|
+
};
|
package/dist/types/plugin.d.ts
CHANGED
|
@@ -6,7 +6,13 @@ import type { ScrollGutterPluginOptions } from './pm-plugins/scroll-gutter';
|
|
|
6
6
|
export interface BasePluginOptions {
|
|
7
7
|
allowScrollGutter?: ScrollGutterPluginOptions;
|
|
8
8
|
allowInlineCursorTarget?: boolean;
|
|
9
|
+
/**
|
|
10
|
+
* @deprecated do not use
|
|
11
|
+
*/
|
|
9
12
|
inputTracking?: InputTracking;
|
|
13
|
+
/**
|
|
14
|
+
* @deprecated do not use
|
|
15
|
+
*/
|
|
10
16
|
browserFreezeTracking?: BrowserFreezetracking;
|
|
11
17
|
ufo?: boolean;
|
|
12
18
|
}
|
|
@@ -6,7 +6,13 @@ import type { ScrollGutterPluginOptions } from './pm-plugins/scroll-gutter';
|
|
|
6
6
|
export interface BasePluginOptions {
|
|
7
7
|
allowScrollGutter?: ScrollGutterPluginOptions;
|
|
8
8
|
allowInlineCursorTarget?: boolean;
|
|
9
|
+
/**
|
|
10
|
+
* @deprecated do not use
|
|
11
|
+
*/
|
|
9
12
|
inputTracking?: InputTracking;
|
|
13
|
+
/**
|
|
14
|
+
* @deprecated do not use
|
|
15
|
+
*/
|
|
10
16
|
browserFreezeTracking?: BrowserFreezetracking;
|
|
11
17
|
ufo?: boolean;
|
|
12
18
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/editor-plugin-base",
|
|
3
|
-
"version": "1.12.
|
|
3
|
+
"version": "1.12.2",
|
|
4
4
|
"description": "Base plugin for @atlaskit/editor-core",
|
|
5
5
|
"author": "Atlassian Pty Ltd",
|
|
6
6
|
"license": "Apache-2.0",
|
|
@@ -32,11 +32,11 @@
|
|
|
32
32
|
},
|
|
33
33
|
"dependencies": {
|
|
34
34
|
"@atlaskit/adf-schema": "^42.0.2",
|
|
35
|
-
"@atlaskit/editor-common": "^93.
|
|
35
|
+
"@atlaskit/editor-common": "^93.6.0",
|
|
36
36
|
"@atlaskit/editor-plugin-context-identifier": "^1.3.0",
|
|
37
37
|
"@atlaskit/editor-plugin-feature-flags": "^1.2.0",
|
|
38
38
|
"@atlaskit/editor-prosemirror": "6.0.0",
|
|
39
|
-
"@atlaskit/tmp-editor-statsig": "^2.
|
|
39
|
+
"@atlaskit/tmp-editor-statsig": "^2.6.0",
|
|
40
40
|
"@babel/runtime": "^7.0.0"
|
|
41
41
|
},
|
|
42
42
|
"techstack": {
|