@atlaskit/editor-plugin-block-controls 3.15.12 → 3.16.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.
Files changed (5) hide show
  1. package/CHANGELOG.md +12 -0
  2. package/dist/cjs/pm-plugins/main.js +55 -14
  3. package/dist/es2019/pm-plugins/main.js +58 -16
  4. package/dist/esm/pm-plugins/main.js +55 -14
  5. package/package.json +6 -3
package/CHANGELOG.md CHANGED
@@ -1,5 +1,17 @@
1
1
  # @atlaskit/editor-plugin-block-controls
2
2
 
3
+ ## 3.16.0
4
+
5
+ ### Minor Changes
6
+
7
+ - [#164171](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/164171)
8
+ [`6e761beb64a85`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/6e761beb64a85) -
9
+ ED-28155 add dnd performance tracker
10
+
11
+ ### Patch Changes
12
+
13
+ - Updated dependencies
14
+
3
15
  ## 3.15.12
4
16
 
5
17
  ### Patch Changes
package/dist/cjs/pm-plugins/main.js CHANGED
@@ -38,6 +38,12 @@ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbol
38
38
  function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
39
39
  var key = exports.key = new _state.PluginKey('blockControls');
40
40
  var EDITOR_BLOCKS_DRAG_INIT = 'Editor Blocks Drag Initialization Time';
41
+ var EDITOR_BLOCKS_DROP_INIT = 'Editor Blocks Drop Initialization Time';
42
+ var scheduleCallback = function scheduleCallback(cb, options) {
43
+ return 'requestIdleCallback' in window ? requestIdleCallback(cb, _objectSpread({
44
+ timeout: 5000
45
+ }, options)) : requestAnimationFrame(cb);
46
+ };
41
47
  var isHTMLElement = function isHTMLElement(element) {
42
48
  return element instanceof HTMLElement;
43
49
  };
@@ -49,27 +55,36 @@ var destroyFn = function destroyFn(api, editorView) {
49
55
  element: scrollable
50
56
  }));
51
57
  }
58
+ var dragInitializationDuration = 0;
52
59
  cleanupFn.push((0, _adapter.monitorForElements)({
53
60
  canMonitor: function canMonitor(_ref) {
54
61
  var source = _ref.source;
55
62
  return source.data.type === 'element';
56
63
  },
57
64
  onDrag: function onDrag() {
58
- if ((0, _performanceMeasures.isMeasuring)(EDITOR_BLOCKS_DRAG_INIT)) {
59
- (0, _performanceMeasures.stopMeasure)(EDITOR_BLOCKS_DRAG_INIT, function (duration, startTime) {
60
- var _api$analytics;
61
- var state = editorView.state;
62
- api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 || _api$analytics.actions.fireAnalyticsEvent({
63
- action: _analytics.ACTION.BLOCKS_DRAG_INIT,
64
- actionSubject: _analytics.ACTION_SUBJECT.EDITOR,
65
- eventType: _analytics.EVENT_TYPE.OPERATIONAL,
66
- attributes: {
67
- duration: duration,
68
- startTime: startTime,
69
- nodesCount: state.doc.nodeSize
70
- }
65
+ if ((0, _platformFeatureFlags.fg)('platform_editor_drag_and_drop_perf_analytics')) {
66
+ if ((0, _performanceMeasures.isMeasuring)(EDITOR_BLOCKS_DRAG_INIT)) {
67
+ (0, _performanceMeasures.stopMeasure)(EDITOR_BLOCKS_DRAG_INIT, function (duration) {
68
+ dragInitializationDuration = duration;
71
69
  });
72
- });
70
+ }
71
+ } else {
72
+ if ((0, _performanceMeasures.isMeasuring)(EDITOR_BLOCKS_DRAG_INIT)) {
73
+ (0, _performanceMeasures.stopMeasure)(EDITOR_BLOCKS_DRAG_INIT, function (duration, startTime) {
74
+ var _api$analytics;
75
+ var state = editorView.state;
76
+ api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 || _api$analytics.actions.fireAnalyticsEvent({
77
+ action: _analytics.ACTION.BLOCKS_DRAG_INIT,
78
+ actionSubject: _analytics.ACTION_SUBJECT.EDITOR,
79
+ eventType: _analytics.EVENT_TYPE.OPERATIONAL,
80
+ attributes: {
81
+ duration: duration,
82
+ startTime: startTime,
83
+ nodesCount: state.doc.nodeSize
84
+ }
85
+ });
86
+ });
87
+ }
73
88
  }
74
89
  },
75
90
  onDragStart: function onDragStart() {
@@ -84,6 +99,9 @@ var destroyFn = function destroyFn(api, editorView) {
84
99
  if (isHTMLElement(scrollable)) {
85
100
  scrollable.style.setProperty('scroll-behavior', null);
86
101
  }
102
+ if ((0, _platformFeatureFlags.fg)('platform_editor_drag_and_drop_perf_analytics')) {
103
+ (0, _performanceMeasures.startMeasure)(EDITOR_BLOCKS_DROP_INIT);
104
+ }
87
105
  if (!api) {
88
106
  return;
89
107
  }
@@ -160,6 +178,29 @@ var destroyFn = function destroyFn(api, editorView) {
160
178
  lastDragCancelled: lastDragCancelled
161
179
  }));
162
180
  });
181
+ if ((0, _platformFeatureFlags.fg)('platform_editor_drag_and_drop_perf_analytics')) {
182
+ // wait for the idle callback to ensure that the drag operation has completed
183
+ scheduleCallback(function () {
184
+ if ((0, _performanceMeasures.isMeasuring)(EDITOR_BLOCKS_DROP_INIT)) {
185
+ (0, _performanceMeasures.stopMeasure)(EDITOR_BLOCKS_DROP_INIT, function (duration) {
186
+ var _api$analytics3;
187
+ var isCancelled = location.current.dropTargets.length === 0;
188
+ api === null || api === void 0 || (_api$analytics3 = api.analytics) === null || _api$analytics3 === void 0 || _api$analytics3.actions.fireAnalyticsEvent({
189
+ action: _analytics.ACTION.ENDED,
190
+ eventType: _analytics.EVENT_TYPE.TRACK,
191
+ actionSubject: _analytics.ACTION_SUBJECT.DRAG,
192
+ actionSubjectId: _analytics.ACTION_SUBJECT_ID.ELEMENT_DRAG_HANDLE,
193
+ attributes: {
194
+ dragInitializationDuration: dragInitializationDuration,
195
+ dropProcessingDuration: duration,
196
+ isCancelled: isCancelled,
197
+ nodesCount: editorView.state.doc.nodeSize
198
+ }
199
+ });
200
+ });
201
+ }
202
+ });
203
+ }
163
204
  }
164
205
  }));
165
206
  return _combine.combine.apply(void 0, cleanupFn);
package/dist/es2019/pm-plugins/main.js CHANGED
@@ -28,6 +28,13 @@ import { getSelectedSlicePosition } from './utils/selection';
28
28
  import { getTrMetadata } from './utils/transactions';
29
29
  export const key = new PluginKey('blockControls');
30
30
  const EDITOR_BLOCKS_DRAG_INIT = 'Editor Blocks Drag Initialization Time';
31
+ const EDITOR_BLOCKS_DROP_INIT = 'Editor Blocks Drop Initialization Time';
32
+ const scheduleCallback = (cb, options) => {
33
+ return 'requestIdleCallback' in window ? requestIdleCallback(cb, {
34
+ timeout: 5000,
35
+ ...options
36
+ }) : requestAnimationFrame(cb);
37
+ };
31
38
  const isHTMLElement = element => {
32
39
  return element instanceof HTMLElement;
33
40
  };
@@ -39,28 +46,37 @@ const destroyFn = (api, editorView) => {
39
46
  element: scrollable
40
47
  }));
41
48
  }
49
+ let dragInitializationDuration = 0;
42
50
  cleanupFn.push(monitorForElements({
43
51
  canMonitor: ({
44
52
  source
45
53
  }) => source.data.type === 'element',
46
54
  onDrag: () => {
47
- if (isMeasuring(EDITOR_BLOCKS_DRAG_INIT)) {
48
- stopMeasure(EDITOR_BLOCKS_DRAG_INIT, (duration, startTime) => {
49
- var _api$analytics;
50
- const {
51
- state
52
- } = editorView;
53
- api === null || api === void 0 ? void 0 : (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions.fireAnalyticsEvent({
54
- action: ACTION.BLOCKS_DRAG_INIT,
55
- actionSubject: ACTION_SUBJECT.EDITOR,
56
- eventType: EVENT_TYPE.OPERATIONAL,
57
- attributes: {
58
- duration,
59
- startTime,
60
- nodesCount: state.doc.nodeSize
61
- }
55
+ if (fg('platform_editor_drag_and_drop_perf_analytics')) {
56
+ if (isMeasuring(EDITOR_BLOCKS_DRAG_INIT)) {
57
+ stopMeasure(EDITOR_BLOCKS_DRAG_INIT, duration => {
58
+ dragInitializationDuration = duration;
62
59
  });
63
- });
60
+ }
61
+ } else {
62
+ if (isMeasuring(EDITOR_BLOCKS_DRAG_INIT)) {
63
+ stopMeasure(EDITOR_BLOCKS_DRAG_INIT, (duration, startTime) => {
64
+ var _api$analytics;
65
+ const {
66
+ state
67
+ } = editorView;
68
+ api === null || api === void 0 ? void 0 : (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions.fireAnalyticsEvent({
69
+ action: ACTION.BLOCKS_DRAG_INIT,
70
+ actionSubject: ACTION_SUBJECT.EDITOR,
71
+ eventType: EVENT_TYPE.OPERATIONAL,
72
+ attributes: {
73
+ duration,
74
+ startTime,
75
+ nodesCount: state.doc.nodeSize
76
+ }
77
+ });
78
+ });
79
+ }
64
80
  }
65
81
  },
66
82
  onDragStart: () => {
@@ -76,6 +92,9 @@ const destroyFn = (api, editorView) => {
76
92
  if (isHTMLElement(scrollable)) {
77
93
  scrollable.style.setProperty('scroll-behavior', null);
78
94
  }
95
+ if (fg('platform_editor_drag_and_drop_perf_analytics')) {
96
+ startMeasure(EDITOR_BLOCKS_DROP_INIT);
97
+ }
79
98
  if (!api) {
80
99
  return;
81
100
  }
@@ -157,6 +176,29 @@ const destroyFn = (api, editorView) => {
157
176
  lastDragCancelled
158
177
  });
159
178
  });
179
+ if (fg('platform_editor_drag_and_drop_perf_analytics')) {
180
+ // wait for the idle callback to ensure that the drag operation has completed
181
+ scheduleCallback(() => {
182
+ if (isMeasuring(EDITOR_BLOCKS_DROP_INIT)) {
183
+ stopMeasure(EDITOR_BLOCKS_DROP_INIT, duration => {
184
+ var _api$analytics3;
185
+ const isCancelled = location.current.dropTargets.length === 0;
186
+ api === null || api === void 0 ? void 0 : (_api$analytics3 = api.analytics) === null || _api$analytics3 === void 0 ? void 0 : _api$analytics3.actions.fireAnalyticsEvent({
187
+ action: ACTION.ENDED,
188
+ eventType: EVENT_TYPE.TRACK,
189
+ actionSubject: ACTION_SUBJECT.DRAG,
190
+ actionSubjectId: ACTION_SUBJECT_ID.ELEMENT_DRAG_HANDLE,
191
+ attributes: {
192
+ dragInitializationDuration,
193
+ dropProcessingDuration: duration,
194
+ isCancelled,
195
+ nodesCount: editorView.state.doc.nodeSize
196
+ }
197
+ });
198
+ });
199
+ }
200
+ });
201
+ }
160
202
  }
161
203
  }));
162
204
  return combine(...cleanupFn);
package/dist/esm/pm-plugins/main.js CHANGED
@@ -31,6 +31,12 @@ import { getSelectedSlicePosition } from './utils/selection';
31
31
  import { getTrMetadata } from './utils/transactions';
32
32
  export var key = new PluginKey('blockControls');
33
33
  var EDITOR_BLOCKS_DRAG_INIT = 'Editor Blocks Drag Initialization Time';
34
+ var EDITOR_BLOCKS_DROP_INIT = 'Editor Blocks Drop Initialization Time';
35
+ var scheduleCallback = function scheduleCallback(cb, options) {
36
+ return 'requestIdleCallback' in window ? requestIdleCallback(cb, _objectSpread({
37
+ timeout: 5000
38
+ }, options)) : requestAnimationFrame(cb);
39
+ };
34
40
  var isHTMLElement = function isHTMLElement(element) {
35
41
  return element instanceof HTMLElement;
36
42
  };
@@ -42,27 +48,36 @@ var destroyFn = function destroyFn(api, editorView) {
42
48
  element: scrollable
43
49
  }));
44
50
  }
51
+ var dragInitializationDuration = 0;
45
52
  cleanupFn.push(monitorForElements({
46
53
  canMonitor: function canMonitor(_ref) {
47
54
  var source = _ref.source;
48
55
  return source.data.type === 'element';
49
56
  },
50
57
  onDrag: function onDrag() {
51
- if (isMeasuring(EDITOR_BLOCKS_DRAG_INIT)) {
52
- stopMeasure(EDITOR_BLOCKS_DRAG_INIT, function (duration, startTime) {
53
- var _api$analytics;
54
- var state = editorView.state;
55
- api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 || _api$analytics.actions.fireAnalyticsEvent({
56
- action: ACTION.BLOCKS_DRAG_INIT,
57
- actionSubject: ACTION_SUBJECT.EDITOR,
58
- eventType: EVENT_TYPE.OPERATIONAL,
59
- attributes: {
60
- duration: duration,
61
- startTime: startTime,
62
- nodesCount: state.doc.nodeSize
63
- }
58
+ if (fg('platform_editor_drag_and_drop_perf_analytics')) {
59
+ if (isMeasuring(EDITOR_BLOCKS_DRAG_INIT)) {
60
+ stopMeasure(EDITOR_BLOCKS_DRAG_INIT, function (duration) {
61
+ dragInitializationDuration = duration;
64
62
  });
65
- });
63
+ }
64
+ } else {
65
+ if (isMeasuring(EDITOR_BLOCKS_DRAG_INIT)) {
66
+ stopMeasure(EDITOR_BLOCKS_DRAG_INIT, function (duration, startTime) {
67
+ var _api$analytics;
68
+ var state = editorView.state;
69
+ api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 || _api$analytics.actions.fireAnalyticsEvent({
70
+ action: ACTION.BLOCKS_DRAG_INIT,
71
+ actionSubject: ACTION_SUBJECT.EDITOR,
72
+ eventType: EVENT_TYPE.OPERATIONAL,
73
+ attributes: {
74
+ duration: duration,
75
+ startTime: startTime,
76
+ nodesCount: state.doc.nodeSize
77
+ }
78
+ });
79
+ });
80
+ }
66
81
  }
67
82
  },
68
83
  onDragStart: function onDragStart() {
@@ -77,6 +92,9 @@ var destroyFn = function destroyFn(api, editorView) {
77
92
  if (isHTMLElement(scrollable)) {
78
93
  scrollable.style.setProperty('scroll-behavior', null);
79
94
  }
95
+ if (fg('platform_editor_drag_and_drop_perf_analytics')) {
96
+ startMeasure(EDITOR_BLOCKS_DROP_INIT);
97
+ }
80
98
  if (!api) {
81
99
  return;
82
100
  }
@@ -153,6 +171,29 @@ var destroyFn = function destroyFn(api, editorView) {
153
171
  lastDragCancelled: lastDragCancelled
154
172
  }));
155
173
  });
174
+ if (fg('platform_editor_drag_and_drop_perf_analytics')) {
175
+ // wait for the idle callback to ensure that the drag operation has completed
176
+ scheduleCallback(function () {
177
+ if (isMeasuring(EDITOR_BLOCKS_DROP_INIT)) {
178
+ stopMeasure(EDITOR_BLOCKS_DROP_INIT, function (duration) {
179
+ var _api$analytics3;
180
+ var isCancelled = location.current.dropTargets.length === 0;
181
+ api === null || api === void 0 || (_api$analytics3 = api.analytics) === null || _api$analytics3 === void 0 || _api$analytics3.actions.fireAnalyticsEvent({
182
+ action: ACTION.ENDED,
183
+ eventType: EVENT_TYPE.TRACK,
184
+ actionSubject: ACTION_SUBJECT.DRAG,
185
+ actionSubjectId: ACTION_SUBJECT_ID.ELEMENT_DRAG_HANDLE,
186
+ attributes: {
187
+ dragInitializationDuration: dragInitializationDuration,
188
+ dropProcessingDuration: duration,
189
+ isCancelled: isCancelled,
190
+ nodesCount: editorView.state.doc.nodeSize
191
+ }
192
+ });
193
+ });
194
+ }
195
+ });
196
+ }
156
197
  }
157
198
  }));
158
199
  return combine.apply(void 0, cleanupFn);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-block-controls",
3
- "version": "3.15.12",
3
+ "version": "3.16.0",
4
4
  "description": "Block controls plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -33,7 +33,7 @@
33
33
  },
34
34
  "dependencies": {
35
35
  "@atlaskit/adf-schema": "^47.6.0",
36
- "@atlaskit/editor-common": "^106.3.0",
36
+ "@atlaskit/editor-common": "^106.4.0",
37
37
  "@atlaskit/editor-plugin-accessibility-utils": "^2.0.0",
38
38
  "@atlaskit/editor-plugin-analytics": "^2.3.0",
39
39
  "@atlaskit/editor-plugin-editor-disabled": "^2.0.0",
@@ -56,7 +56,7 @@
56
56
  "@atlaskit/pragmatic-drag-and-drop-react-drop-indicator": "^3.2.0",
57
57
  "@atlaskit/primitives": "^14.8.0",
58
58
  "@atlaskit/theme": "^18.0.0",
59
- "@atlaskit/tmp-editor-statsig": "^5.13.0",
59
+ "@atlaskit/tmp-editor-statsig": "^5.14.0",
60
60
  "@atlaskit/tokens": "^5.1.0",
61
61
  "@atlaskit/tooltip": "^20.3.0",
62
62
  "@babel/runtime": "^7.0.0",
@@ -180,6 +180,9 @@
180
180
  "platform_editor_no_cursor_on_live_doc_init": {
181
181
  "type": "boolean"
182
182
  },
183
+ "platform_editor_drag_and_drop_perf_analytics": {
184
+ "type": "boolean"
185
+ },
183
186
  "platform_editor_column_count_analytics": {
184
187
  "type": "boolean"
185
188
  },