@atlaskit/renderer 109.10.2 → 109.10.4

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @atlaskit/renderer
 
+## 109.10.4
+
+### Patch Changes
+
+- [#81323](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/81323) [`88bfdbce168d`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/88bfdbce168d) - [EDF-426] Added special handling for dom errors in renderer to resolve DOM errors from Google translate interactions. This is behind a platform flag (platform.editor.renderer-error-boundary-for-dom-errors) and adds a new analytics event (CAUGHT_DOM_ERROR).
+
+## 109.10.3
+
+### Patch Changes
+
+- [#83164](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/83164) [`4d25a598eda2`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/4d25a598eda2) - [ux] Update alignment for summary block error text
+
 ## 109.10.2
 
 ### Patch Changes

package/dist/cjs/ui/Renderer/ErrorBoundary.js

@@ -14,9 +14,11 @@ var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/ge
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = _interopRequireDefault(require("react"));
 var _analytics = require("@atlaskit/editor-common/analytics");
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _analyticsListeners = require("@atlaskit/analytics-listeners");
 var _monitoring = require("@atlaskit/editor-common/monitoring");
 var _events = require("../../analytics/events");
+var _uuid = _interopRequireDefault(require("uuid"));
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
 function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
 var ErrorBoundary = exports.ErrorBoundary = /*#__PURE__*/function (_React$Component) {
@@ -30,7 +32,8 @@ var ErrorBoundary = exports.ErrorBoundary = /*#__PURE__*/function (_React$Compon
     }
     _this = _super.call.apply(_super, [this].concat(args));
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "state", {
-      errorCaptured: false
+      errorCaptured: false,
+      domError: false
     });
     return _this;
   }
@@ -72,6 +75,27 @@ var ErrorBoundary = exports.ErrorBoundary = /*#__PURE__*/function (_React$Compon
       (0, _monitoring.logException)(error, {
         location: 'renderer'
       });
+      if ((0, _platformFeatureFlags.getBooleanFF)('platform.editor.renderer-error-boundary-for-dom-errors')) {
+        var pattern = /Failed to execute.*on 'Node'.*/;
+        var matchesPattern = pattern.test(error.message);
+        if (matchesPattern) {
+          this.fireAnalyticsEvent({
+            action: _analytics.ACTION.CAUGHT_DOM_ERROR,
+            actionSubject: this.props.component,
+            actionSubjectId: this.props.componentId,
+            eventType: _analytics.EVENT_TYPE.OPERATIONAL,
+            attributes: {
+              platform: _events.PLATFORM.WEB,
+              errorMessage: error === null || error === void 0 ? void 0 : error.message
+            }
+          });
+          this.setState(function () {
+            return {
+              domError: true
+            };
+          });
+        }
+      }
       if (this.hasFallback()) {
         this.setState({
           errorCaptured: true
@@ -85,6 +109,13 @@ var ErrorBoundary = exports.ErrorBoundary = /*#__PURE__*/function (_React$Compon
   }, {
     key: "render",
     value: function render() {
+      if ((0, _platformFeatureFlags.getBooleanFF)('platform.editor.renderer-error-boundary-for-dom-errors')) {
+        if (this.state.domError) {
+          return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, {
+            key: (0, _uuid.default)()
+          }, this.props.children);
+        }
+      }
       if (this.shouldRecover()) {
         return this.props.fallbackComponent;
       }

package/dist/cjs/ui/Renderer/index.js

@@ -55,7 +55,7 @@ function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.
 var NORMAL_SEVERITY_THRESHOLD = exports.NORMAL_SEVERITY_THRESHOLD = 2000;
 var DEGRADED_SEVERITY_THRESHOLD = exports.DEGRADED_SEVERITY_THRESHOLD = 3000;
 var packageName = "@atlaskit/renderer";
-var packageVersion = "109.10.2";
+var packageVersion = "109.10.4";
 var Renderer = exports.Renderer = /*#__PURE__*/function (_PureComponent) {
   (0, _inherits2.default)(Renderer, _PureComponent);
   var _super = _createSuper(Renderer);

package/dist/es2019/ui/Renderer/ErrorBoundary.js

@@ -1,14 +1,17 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import React from 'react';
 import { ACTION, EVENT_TYPE } from '@atlaskit/editor-common/analytics';
+import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 import { FabricChannel } from '@atlaskit/analytics-listeners';
 import { logException } from '@atlaskit/editor-common/monitoring';
 import { PLATFORM } from '../../analytics/events';
+import uuid from 'uuid';
 export class ErrorBoundary extends React.Component {
   constructor(...args) {
     super(...args);
     _defineProperty(this, "state", {
-      errorCaptured: false
+      errorCaptured: false,
+      domError: false
     });
   }
   fireAnalyticsEvent(event) {
@@ -42,6 +45,25 @@ export class ErrorBoundary extends React.Component {
     logException(error, {
       location: 'renderer'
     });
+    if (getBooleanFF('platform.editor.renderer-error-boundary-for-dom-errors')) {
+      const pattern = /Failed to execute.*on 'Node'.*/;
+      const matchesPattern = pattern.test(error.message);
+      if (matchesPattern) {
+        this.fireAnalyticsEvent({
+          action: ACTION.CAUGHT_DOM_ERROR,
+          actionSubject: this.props.component,
+          actionSubjectId: this.props.componentId,
+          eventType: EVENT_TYPE.OPERATIONAL,
+          attributes: {
+            platform: PLATFORM.WEB,
+            errorMessage: error === null || error === void 0 ? void 0 : error.message
+          }
+        });
+        this.setState(() => ({
+          domError: true
+        }));
+      }
+    }
     if (this.hasFallback()) {
       this.setState({
         errorCaptured: true
@@ -53,6 +75,13 @@ export class ErrorBoundary extends React.Component {
     }
   }
   render() {
+    if (getBooleanFF('platform.editor.renderer-error-boundary-for-dom-errors')) {
+      if (this.state.domError) {
+        return /*#__PURE__*/React.createElement(React.Fragment, {
+          key: uuid()
+        }, this.props.children);
+      }
+    }
     if (this.shouldRecover()) {
       return this.props.fallbackComponent;
     }

package/dist/es2019/ui/Renderer/index.js

@@ -36,7 +36,7 @@ import { EditorMediaClientProvider } from '../../react/utils/EditorMediaClientPr
 export const NORMAL_SEVERITY_THRESHOLD = 2000;
 export const DEGRADED_SEVERITY_THRESHOLD = 3000;
 const packageName = "@atlaskit/renderer";
-const packageVersion = "109.10.2";
+const packageVersion = "109.10.4";
 export class Renderer extends PureComponent {
   constructor(props) {
     super(props);

package/dist/esm/ui/Renderer/ErrorBoundary.js

@@ -9,9 +9,11 @@ function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflec
 function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
 import React from 'react';
 import { ACTION, EVENT_TYPE } from '@atlaskit/editor-common/analytics';
+import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 import { FabricChannel } from '@atlaskit/analytics-listeners';
 import { logException } from '@atlaskit/editor-common/monitoring';
 import { PLATFORM } from '../../analytics/events';
+import uuid from 'uuid';
 export var ErrorBoundary = /*#__PURE__*/function (_React$Component) {
   _inherits(ErrorBoundary, _React$Component);
   var _super = _createSuper(ErrorBoundary);
@@ -23,7 +25,8 @@ export var ErrorBoundary = /*#__PURE__*/function (_React$Component) {
     }
     _this = _super.call.apply(_super, [this].concat(args));
     _defineProperty(_assertThisInitialized(_this), "state", {
-      errorCaptured: false
+      errorCaptured: false,
+      domError: false
     });
     return _this;
   }
@@ -65,6 +68,27 @@ export var ErrorBoundary = /*#__PURE__*/function (_React$Component) {
       logException(error, {
         location: 'renderer'
       });
+      if (getBooleanFF('platform.editor.renderer-error-boundary-for-dom-errors')) {
+        var pattern = /Failed to execute.*on 'Node'.*/;
+        var matchesPattern = pattern.test(error.message);
+        if (matchesPattern) {
+          this.fireAnalyticsEvent({
+            action: ACTION.CAUGHT_DOM_ERROR,
+            actionSubject: this.props.component,
+            actionSubjectId: this.props.componentId,
+            eventType: EVENT_TYPE.OPERATIONAL,
+            attributes: {
+              platform: PLATFORM.WEB,
+              errorMessage: error === null || error === void 0 ? void 0 : error.message
+            }
+          });
+          this.setState(function () {
+            return {
+              domError: true
+            };
+          });
+        }
+      }
       if (this.hasFallback()) {
         this.setState({
           errorCaptured: true
@@ -78,6 +102,13 @@ export var ErrorBoundary = /*#__PURE__*/function (_React$Component) {
   }, {
     key: "render",
     value: function render() {
+      if (getBooleanFF('platform.editor.renderer-error-boundary-for-dom-errors')) {
+        if (this.state.domError) {
+          return /*#__PURE__*/React.createElement(React.Fragment, {
+            key: uuid()
+          }, this.props.children);
+        }
+      }
       if (this.shouldRecover()) {
         return this.props.fallbackComponent;
       }

package/dist/esm/ui/Renderer/index.js

@@ -46,7 +46,7 @@ import { EditorMediaClientProvider } from '../../react/utils/EditorMediaClientPr
 export var NORMAL_SEVERITY_THRESHOLD = 2000;
 export var DEGRADED_SEVERITY_THRESHOLD = 3000;
 var packageName = "@atlaskit/renderer";
-var packageVersion = "109.10.2";
+var packageVersion = "109.10.4";
 export var Renderer = /*#__PURE__*/function (_PureComponent) {
   _inherits(Renderer, _PureComponent);
   var _super = _createSuper(Renderer);

package/dist/types/analytics/events.d.ts

@@ -35,6 +35,10 @@ export type ComponentCrashErrorAEP = OperationalAEP<ACTION.CRASHED, ACTION_SUBJE
     componentStack?: string;
     errorRethrown?: boolean;
 }>;
+export type ComponentCaughtDomErrorAEP = OperationalAEP<ACTION.CAUGHT_DOM_ERROR, ACTION_SUBJECT.RENDERER, ACTION_SUBJECT_ID, {
+    errorMessage: string;
+    platform: PLATFORM.WEB;
+}>;
 type InvalidProsemirrorDocumentErrorAEP = AEP<ACTION.INVALID_PROSEMIRROR_DOCUMENT, ACTION_SUBJECT.RENDERER, ACTION_SUBJECT_ID, {
     platform: PLATFORM.WEB;
     errorStack?: string;

package/dist/types/ui/Renderer/ErrorBoundary.d.ts

@@ -11,10 +11,12 @@ interface ErrorBoundaryProps {
 }
 interface ErrorBoundaryState {
     errorCaptured: boolean;
+    domError: boolean;
 }
 export declare class ErrorBoundary extends React.Component<ErrorBoundaryProps, ErrorBoundaryState> {
     state: {
         errorCaptured: boolean;
+        domError: boolean;
     };
     private fireAnalyticsEvent;
     private hasFallback;

package/dist/types-ts4.5/analytics/events.d.ts

@@ -35,6 +35,10 @@ export type ComponentCrashErrorAEP = OperationalAEP<ACTION.CRASHED, ACTION_SUBJE
     componentStack?: string;
     errorRethrown?: boolean;
 }>;
+export type ComponentCaughtDomErrorAEP = OperationalAEP<ACTION.CAUGHT_DOM_ERROR, ACTION_SUBJECT.RENDERER, ACTION_SUBJECT_ID, {
+    errorMessage: string;
+    platform: PLATFORM.WEB;
+}>;
 type InvalidProsemirrorDocumentErrorAEP = AEP<ACTION.INVALID_PROSEMIRROR_DOCUMENT, ACTION_SUBJECT.RENDERER, ACTION_SUBJECT_ID, {
     platform: PLATFORM.WEB;
     errorStack?: string;

package/dist/types-ts4.5/ui/Renderer/ErrorBoundary.d.ts

@@ -11,10 +11,12 @@ interface ErrorBoundaryProps {
 }
 interface ErrorBoundaryState {
     errorCaptured: boolean;
+    domError: boolean;
 }
 export declare class ErrorBoundary extends React.Component<ErrorBoundaryProps, ErrorBoundaryState> {
     state: {
         errorCaptured: boolean;
+        domError: boolean;
     };
     private fireAnalyticsEvent;
     private hasFallback;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/renderer",
-  "version": "109.10.2",
+  "version": "109.10.4",
   "description": "Renderer component",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -136,6 +136,9 @@
     },
     "platform.editor.allow-inline-comments-for-inline-nodes": {
       "type": "boolean"
+    },
+    "platform.editor.renderer-error-boundary-for-dom-errors": {
+      "type": "boolean"
     }
   },
   "af:exports": {