@atlaskit/react-ufo 4.14.8 → 4.15.1

package/CHANGELOG.md

@@ -1,5 +1,19 @@
 # @atlaskit/ufo-interaction-ignore
 
+## 4.15.1
+
+### Patch Changes
+
+- [`30a6e92ff3dda`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/30a6e92ff3dda) -
+  disable usage of getComputedStyle in VC observer
+
+## 4.15.0
+
+### Minor Changes
+
+- [`5bd9159b5173c`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/5bd9159b5173c) -
+  Change fy25_03 media measurement to correctly exclude cursor styles
+
 ## 4.14.8
 
 ### Patch Changes

package/dist/cjs/vc/vc-observer/observers/ssr-placeholders/index.js

@@ -8,6 +8,7 @@ exports.SSRPlaceholderHandlers = void 0;
 var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
 var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var ANCESTOR_LOOKUP_LIMIT = 10;
 var PAGE_LAYOUT_ID = 'page-layout.root';
 var SSRPlaceholderHandlers = exports.SSRPlaceholderHandlers = /*#__PURE__*/function () {
@@ -290,6 +291,9 @@ var SSRPlaceholderHandlers = exports.SSRPlaceholderHandlers = /*#__PURE__*/funct
   }, {
     key: "getEffectiveBoundingRect",
     value: function getEffectiveBoundingRect(el) {
+      if ((0, _platformFeatureFlags.fg)('platform_ufo_disable_vcnext_observations')) {
+        return el.getBoundingClientRect();
+      }
       var computedStyle = window.getComputedStyle(el);
 
       // If element has display: contents, collect bounding rect from children

package/dist/cjs/vc/vc-observer-new/metric-calculator/fy25_03/index.js

@@ -65,7 +65,7 @@ var VCCalculator_FY25_03 = exports.default = /*#__PURE__*/function (_AbstractVCC
       if (entry.data.type === 'mutation:media' && (0, _platformFeatureFlags.fg)('media-perf-uplift-mutation-fix')) {
         var entryData = entry.data;
         var attributeName = entryData.attributeName;
-        if (attributeName && (/data-(test|file|context)-\S+/g.test(attributeName) || attributeName === 'alt' || (attributeName === 'localid' || attributeName === 'contenteditable' || attributeName === 'anchor-name') && (0, _expVal.expVal)('platform_editor_media_vc_fixes', 'isEnabled', false))) {
+        if (attributeName && (/data-(test|file|context|cursor)-\S+/g.test(attributeName) || attributeName === 'alt' || (attributeName === 'localid' || attributeName === 'contenteditable' || attributeName === 'anchor-name') && (0, _expVal.expVal)('platform_editor_media_vc_fixes', 'isEnabled', false))) {
           return false;
         }
 

package/dist/cjs/vc/vc-observer-new/viewport-observer/utils/get-mutated-elements.js

@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.getMutatedElements = getMutatedElements;
 var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) { t && (r = t); var _n = 0, F = function F() {}; return { s: F, n: function n() { return _n >= r.length ? { done: !0 } : { done: !1, value: r[_n++] }; }, e: function e(r) { throw r; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var o, a = !0, u = !1; return { s: function s() { t = t.call(r); }, n: function n() { var r = t.next(); return a = r.done, r; }, e: function e(r) { u = !0, o = r; }, f: function f() { try { a || null == t.return || t.return(); } finally { if (u) throw o; } } }; }
 function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
 function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
@@ -13,6 +14,12 @@ var MAX_NESTED_LEVELS_OF_DISPLAY_CONTENT_ELEMENTS_HANDLED = 3;
 function getMutatedElements(element) {
   var _window;
   var depthLevel = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
+  if ((0, _platformFeatureFlags.fg)('platform_ufo_disable_vcnext_observations')) {
+    return [{
+      element: element,
+      isDisplayContentsElementChildren: false
+    }];
+  }
   if (((_window = window) === null || _window === void 0 || (_window = _window.getComputedStyle(element)) === null || _window === void 0 ? void 0 : _window.display) === 'contents') {
     var mutatedElements = [];
     var nestedDisplayContentsElementChildren = [];

package/dist/es2019/vc/vc-observer/observers/ssr-placeholders/index.js

@@ -1,4 +1,5 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import { fg } from '@atlaskit/platform-feature-flags';
 const ANCESTOR_LOOKUP_LIMIT = 10;
 const PAGE_LAYOUT_ID = 'page-layout.root';
 export class SSRPlaceholderHandlers {
@@ -246,6 +247,9 @@ export class SSRPlaceholderHandlers {
    * by collecting dimensions from their children instead
    */
   getEffectiveBoundingRect(el) {
+    if (fg('platform_ufo_disable_vcnext_observations')) {
+      return el.getBoundingClientRect();
+    }
     const computedStyle = window.getComputedStyle(el);
 
     // If element has display: contents, collect bounding rect from children

package/dist/es2019/vc/vc-observer-new/metric-calculator/fy25_03/index.js

@@ -47,7 +47,7 @@ export default class VCCalculator_FY25_03 extends AbstractVCCalculatorBase {
     if (entry.data.type === 'mutation:media' && fg('media-perf-uplift-mutation-fix')) {
       const entryData = entry.data;
       const attributeName = entryData.attributeName;
-      if (attributeName && (/data-(test|file|context)-\S+/g.test(attributeName) || attributeName === 'alt' || (attributeName === 'localid' || attributeName === 'contenteditable' || attributeName === 'anchor-name') && expVal('platform_editor_media_vc_fixes', 'isEnabled', false))) {
+      if (attributeName && (/data-(test|file|context|cursor)-\S+/g.test(attributeName) || attributeName === 'alt' || (attributeName === 'localid' || attributeName === 'contenteditable' || attributeName === 'anchor-name') && expVal('platform_editor_media_vc_fixes', 'isEnabled', false))) {
         return false;
       }
 

package/dist/es2019/vc/vc-observer-new/viewport-observer/utils/get-mutated-elements.js

@@ -1,6 +1,13 @@
+import { fg } from '@atlaskit/platform-feature-flags';
 const MAX_NESTED_LEVELS_OF_DISPLAY_CONTENT_ELEMENTS_HANDLED = 3;
 export function getMutatedElements(element, depthLevel = 0) {
   var _window, _window$getComputedSt;
+  if (fg('platform_ufo_disable_vcnext_observations')) {
+    return [{
+      element,
+      isDisplayContentsElementChildren: false
+    }];
+  }
   if (((_window = window) === null || _window === void 0 ? void 0 : (_window$getComputedSt = _window.getComputedStyle(element)) === null || _window$getComputedSt === void 0 ? void 0 : _window$getComputedSt.display) === 'contents') {
     const mutatedElements = [];
     const nestedDisplayContentsElementChildren = [];

package/dist/esm/vc/vc-observer/observers/ssr-placeholders/index.js

@@ -1,6 +1,7 @@
 import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
 import _createClass from "@babel/runtime/helpers/createClass";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import { fg } from '@atlaskit/platform-feature-flags';
 var ANCESTOR_LOOKUP_LIMIT = 10;
 var PAGE_LAYOUT_ID = 'page-layout.root';
 export var SSRPlaceholderHandlers = /*#__PURE__*/function () {
@@ -283,6 +284,9 @@ export var SSRPlaceholderHandlers = /*#__PURE__*/function () {
   }, {
     key: "getEffectiveBoundingRect",
     value: function getEffectiveBoundingRect(el) {
+      if (fg('platform_ufo_disable_vcnext_observations')) {
+        return el.getBoundingClientRect();
+      }
       var computedStyle = window.getComputedStyle(el);
 
       // If element has display: contents, collect bounding rect from children

package/dist/esm/vc/vc-observer-new/metric-calculator/fy25_03/index.js

@@ -58,7 +58,7 @@ var VCCalculator_FY25_03 = /*#__PURE__*/function (_AbstractVCCalculator) {
       if (entry.data.type === 'mutation:media' && fg('media-perf-uplift-mutation-fix')) {
         var entryData = entry.data;
         var attributeName = entryData.attributeName;
-        if (attributeName && (/data-(test|file|context)-\S+/g.test(attributeName) || attributeName === 'alt' || (attributeName === 'localid' || attributeName === 'contenteditable' || attributeName === 'anchor-name') && expVal('platform_editor_media_vc_fixes', 'isEnabled', false))) {
+        if (attributeName && (/data-(test|file|context|cursor)-\S+/g.test(attributeName) || attributeName === 'alt' || (attributeName === 'localid' || attributeName === 'contenteditable' || attributeName === 'anchor-name') && expVal('platform_editor_media_vc_fixes', 'isEnabled', false))) {
           return false;
         }
 

package/dist/esm/vc/vc-observer-new/viewport-observer/utils/get-mutated-elements.js

@@ -2,10 +2,17 @@ import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
 function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) { t && (r = t); var _n = 0, F = function F() {}; return { s: F, n: function n() { return _n >= r.length ? { done: !0 } : { done: !1, value: r[_n++] }; }, e: function e(r) { throw r; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var o, a = !0, u = !1; return { s: function s() { t = t.call(r); }, n: function n() { var r = t.next(); return a = r.done, r; }, e: function e(r) { u = !0, o = r; }, f: function f() { try { a || null == t.return || t.return(); } finally { if (u) throw o; } } }; }
 function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
 function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
+import { fg } from '@atlaskit/platform-feature-flags';
 var MAX_NESTED_LEVELS_OF_DISPLAY_CONTENT_ELEMENTS_HANDLED = 3;
 export function getMutatedElements(element) {
   var _window;
   var depthLevel = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
+  if (fg('platform_ufo_disable_vcnext_observations')) {
+    return [{
+      element: element,
+      isDisplayContentsElementChildren: false
+    }];
+  }
   if (((_window = window) === null || _window === void 0 || (_window = _window.getComputedStyle(element)) === null || _window === void 0 ? void 0 : _window.display) === 'contents') {
     var mutatedElements = [];
     var nestedDisplayContentsElementChildren = [];

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/react-ufo",
-	"version": "4.14.8",
+	"version": "4.15.1",
 	"description": "Parts of React UFO that are publicly available",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -107,6 +107,9 @@
 		"platform_ufo_critical_metrics_payload": {
 			"type": "boolean"
 		},
+		"platform_ufo_disable_vcnext_observations": {
+			"type": "boolean"
+		},
 		"platform_ufo_remove_ssr_placeholder_in_ttvc_v4": {
 			"type": "boolean"
 		},