@lwc/synthetic-shadow 2.32.0 → 2.32.1

package/dist/synthetic-shadow.js

@@ -148,7 +148,7 @@ const KEY__SYNTHETIC_MODE = '$$lwc-synthetic-mode';
 // We use this to detect symbol support in order to avoid the expensive symbol polyfill. Note that
 // we can't use typeof since it will fail when transpiling.
 const hasNativeSymbolSupport = /*@__PURE__*/ (() => Symbol('x').toString() === 'Symbol(x)')();
-/** version: 2.32.0 */
+/** version: 2.32.1 */
 
 /*
  * Copyright (c) 2018, salesforce.com, inc.
@@ -422,7 +422,8 @@ function getOwnerWindow(node) {
     return win;
 }
 let skipGlobalPatching;
-// TODO [#1222]: remove global bypass
+// Note: we deviate from native shadow here, but are not fixing
+// due to backwards compat: https://github.com/salesforce/lwc/pull/3103
 function isGlobalPatchingSkipped(node) {
     // we lazily compute this value instead of doing it during evaluation, this helps
     // for apps that are setting this after the engine code is evaluated.
@@ -462,7 +463,7 @@ if (!_globalThis.lwcRuntimeFlags) {
     Object.defineProperty(_globalThis, 'lwcRuntimeFlags', { value: create(null) });
 }
 const lwcRuntimeFlags = _globalThis.lwcRuntimeFlags;
-/** version: 2.32.0 */
+/** version: 2.32.1 */
 
 /*
  * Copyright (c) 2018, salesforce.com, inc.
@@ -1156,119 +1157,125 @@ function createStaticHTMLCollection(items) {
  * because we don't want to patch the children getters for those elements.
  */
 function hasMountedChildren(node) {
-  return isSyntheticSlotElement(node) || isSyntheticShadowHost(node);
+    return isSyntheticSlotElement(node) || isSyntheticShadowHost(node);
 }
 function getShadowParent(node, value) {
-  const owner = getNodeOwner(node);
-  if (value === owner) {
-    // walking up via parent chain might end up in the shadow root element
-    return getShadowRoot(owner);
-  } else if (value instanceof Element) {
-    if (getNodeNearestOwnerKey(node) === getNodeNearestOwnerKey(value)) {
-      // the element and its parent node belong to the same shadow root
-      return value;
-    } else if (!isNull(owner) && isSlotElement(value)) {
-      // slotted elements must be top level childNodes of the slot element
-      // where they slotted into, but its shadowed parent is always the
-      // owner of the slot.
-      const slotOwner = getNodeOwner(value);
-      if (!isNull(slotOwner) && isNodeOwnedBy(owner, slotOwner)) {
-        // it is a slotted element, and therefore its parent is always going to be the host of the slot
-        return slotOwner;
-      }
+    const owner = getNodeOwner(node);
+    if (value === owner) {
+        // walking up via parent chain might end up in the shadow root element
+        return getShadowRoot(owner);
+    }
+    else if (value instanceof Element) {
+        if (getNodeNearestOwnerKey(node) === getNodeNearestOwnerKey(value)) {
+            // the element and its parent node belong to the same shadow root
+            return value;
+        }
+        else if (!isNull(owner) && isSlotElement(value)) {
+            // slotted elements must be top level childNodes of the slot element
+            // where they slotted into, but its shadowed parent is always the
+            // owner of the slot.
+            const slotOwner = getNodeOwner(value);
+            if (!isNull(slotOwner) && isNodeOwnedBy(owner, slotOwner)) {
+                // it is a slotted element, and therefore its parent is always going to be the host of the slot
+                return slotOwner;
+            }
+        }
     }
-  }
-  return null;
+    return null;
 }
 function hasChildNodesPatched() {
-  return getInternalChildNodes(this).length > 0;
+    return getInternalChildNodes(this).length > 0;
 }
 function firstChildGetterPatched() {
-  const childNodes = getInternalChildNodes(this);
-  return childNodes[0] || null;
+    const childNodes = getInternalChildNodes(this);
+    return childNodes[0] || null;
 }
 function lastChildGetterPatched() {
-  const childNodes = getInternalChildNodes(this);
-  return childNodes[childNodes.length - 1] || null;
+    const childNodes = getInternalChildNodes(this);
+    return childNodes[childNodes.length - 1] || null;
 }
 function textContentGetterPatched() {
-  return getTextContent(this);
+    return getTextContent(this);
 }
 function textContentSetterPatched(value) {
-  textContextSetter.call(this, value);
+    textContextSetter.call(this, value);
 }
 function parentNodeGetterPatched() {
-  const value = parentNodeGetter.call(this);
-  if (isNull(value)) {
-    return value;
-  }
-  // TODO [#1635]: this needs optimization, maybe implementing it based on this.assignedSlot
-  return getShadowParent(this, value);
+    const value = parentNodeGetter.call(this);
+    if (isNull(value)) {
+        return value;
+    }
+    // TODO [#1635]: this needs optimization, maybe implementing it based on this.assignedSlot
+    return getShadowParent(this, value);
 }
 function parentElementGetterPatched() {
-  const value = parentNodeGetter.call(this);
-  if (isNull(value)) {
-    return null;
-  }
-  const parentNode = getShadowParent(this, value);
-  // it could be that the parentNode is the shadowRoot, in which case
-  // we need to return null.
-  // TODO [#1635]: this needs optimization, maybe implementing it based on this.assignedSlot
-  return parentNode instanceof Element ? parentNode : null;
+    const value = parentNodeGetter.call(this);
+    if (isNull(value)) {
+        return null;
+    }
+    const parentNode = getShadowParent(this, value);
+    // it could be that the parentNode is the shadowRoot, in which case
+    // we need to return null.
+    // TODO [#1635]: this needs optimization, maybe implementing it based on this.assignedSlot
+    return parentNode instanceof Element ? parentNode : null;
 }
 function compareDocumentPositionPatched(otherNode) {
-  if (this === otherNode) {
-    return 0;
-  } else if (this.getRootNode() === otherNode) {
-    // "this" is in a shadow tree where the shadow root is the "otherNode".
-    return 10; // Node.DOCUMENT_POSITION_CONTAINS | Node.DOCUMENT_POSITION_PRECEDING
-  } else if (getNodeOwnerKey(this) !== getNodeOwnerKey(otherNode)) {
-    // "this" and "otherNode" belongs to 2 different shadow tree.
-    return 35; // Node.DOCUMENT_POSITION_DISCONNECTED | Node.DOCUMENT_POSITION_IMPLEMENTATION_SPECIFIC | Node.DOCUMENT_POSITION_PRECEDING
-  }
-  // Since "this" and "otherNode" are part of the same shadow tree we can safely rely to the native
-  // Node.compareDocumentPosition implementation.
-  return compareDocumentPosition.call(this, otherNode);
+    if (this === otherNode) {
+        return 0;
+    }
+    else if (this.getRootNode() === otherNode) {
+        // "this" is in a shadow tree where the shadow root is the "otherNode".
+        return 10; // Node.DOCUMENT_POSITION_CONTAINS | Node.DOCUMENT_POSITION_PRECEDING
+    }
+    else if (getNodeOwnerKey(this) !== getNodeOwnerKey(otherNode)) {
+        // "this" and "otherNode" belongs to 2 different shadow tree.
+        return 35; // Node.DOCUMENT_POSITION_DISCONNECTED | Node.DOCUMENT_POSITION_IMPLEMENTATION_SPECIFIC | Node.DOCUMENT_POSITION_PRECEDING
+    }
+    // Since "this" and "otherNode" are part of the same shadow tree we can safely rely to the native
+    // Node.compareDocumentPosition implementation.
+    return compareDocumentPosition.call(this, otherNode);
 }
 function containsPatched(otherNode) {
-  if (otherNode == null || getNodeOwnerKey(this) !== getNodeOwnerKey(otherNode)) {
-    // it is from another shadow
-    return false;
-  }
-  return (compareDocumentPosition.call(this, otherNode) & DOCUMENT_POSITION_CONTAINED_BY) !== 0;
+    if (otherNode == null || getNodeOwnerKey(this) !== getNodeOwnerKey(otherNode)) {
+        // it is from another shadow
+        return false;
+    }
+    return (compareDocumentPosition.call(this, otherNode) & DOCUMENT_POSITION_CONTAINED_BY) !== 0;
 }
 function cloneNodePatched(deep) {
-  const clone = cloneNode.call(this, false);
-  // Per spec, browsers only care about truthy values
-  // Not strict true or false
-  if (!deep) {
+    const clone = cloneNode.call(this, false);
+    // Per spec, browsers only care about truthy values
+    // Not strict true or false
+    if (!deep) {
+        return clone;
+    }
+    const childNodes = getInternalChildNodes(this);
+    for (let i = 0, len = childNodes.length; i < len; i += 1) {
+        clone.appendChild(childNodes[i].cloneNode(true));
+    }
     return clone;
-  }
-  const childNodes = getInternalChildNodes(this);
-  for (let i = 0, len = childNodes.length; i < len; i += 1) {
-    clone.appendChild(childNodes[i].cloneNode(true));
-  }
-  return clone;
 }
 /**
  * This method only applies to elements with a shadow or slots
  */
 function childNodesGetterPatched() {
-  if (isSyntheticShadowHost(this)) {
-    const owner = getNodeOwner(this);
-    const childNodes = isNull(owner) ? [] : getAllMatches(owner, getFilteredChildNodes(this));
-    if (process.env.NODE_ENV !== 'production' && isFalse(hasNativeSymbolSupport) && isExternalChildNodeAccessorFlagOn()) {
-      // inserting a comment node as the first childNode to trick the IE11
-      // DevTool to show the content of the shadowRoot, this should only happen
-      // in dev-mode and in IE11 (which we detect by looking at the symbol).
-      // Plus it should only be in place if we know it is an external invoker.
-      ArrayUnshift.call(childNodes, getIE11FakeShadowRootPlaceholder(this));
-    }
-    return createStaticNodeList(childNodes);
-  }
-  // nothing to do here since this does not have a synthetic shadow attached to it
-  // TODO [#1636]: what about slot elements?
-  return childNodesGetter.call(this);
+    if (isSyntheticShadowHost(this)) {
+        const owner = getNodeOwner(this);
+        const childNodes = isNull(owner) ? [] : getAllMatches(owner, getFilteredChildNodes(this));
+        if (process.env.NODE_ENV !== 'production' &&
+            isFalse(hasNativeSymbolSupport) &&
+            isExternalChildNodeAccessorFlagOn()) {
+            // inserting a comment node as the first childNode to trick the IE11
+            // DevTool to show the content of the shadowRoot, this should only happen
+            // in dev-mode and in IE11 (which we detect by looking at the symbol).
+            // Plus it should only be in place if we know it is an external invoker.
+            ArrayUnshift.call(childNodes, getIE11FakeShadowRootPlaceholder(this));
+        }
+        return createStaticNodeList(childNodes);
+    }
+    // nothing to do here since this does not have a synthetic shadow attached to it
+    // TODO [#1636]: what about slot elements?
+    return childNodesGetter.call(this);
 }
 const nativeGetRootNode = _Node.prototype.getRootNode;
 /**
@@ -1276,14 +1283,16 @@ const nativeGetRootNode = _Node.prototype.getRootNode;
  * If Node.prototype.getRootNode is supported, use it
  * else, assume we are working in non-native shadow mode and climb using parentNode
  */
-const getDocumentOrRootNode = !isUndefined(nativeGetRootNode) ? nativeGetRootNode : function () {
-  let node = this;
-  let nodeParent;
-  while (!isNull(nodeParent = parentNodeGetter.call(node))) {
-    node = nodeParent;
-  }
-  return node;
-};
+const getDocumentOrRootNode = !isUndefined(nativeGetRootNode)
+    ? nativeGetRootNode
+    : function () {
+        let node = this;
+        let nodeParent;
+        while (!isNull((nodeParent = parentNodeGetter.call(node)))) {
+            node = nodeParent;
+        }
+        return node;
+    };
 /**
  * Get the shadow root
  * getNodeOwner() returns the host element that owns the given node
@@ -1294,12 +1303,12 @@ const getDocumentOrRootNode = !isUndefined(nativeGetRootNode) ? nativeGetRootNod
  * @param {Node} node
  */
 function getNearestRoot(node) {
-  const ownerNode = getNodeOwner(node);
-  if (isNull(ownerNode)) {
-    // we hit a wall, either we are in native shadow mode or the node is not in lwc boundary.
-    return getDocumentOrRootNode.call(node);
-  }
-  return getShadowRoot(ownerNode);
+    const ownerNode = getNodeOwner(node);
+    if (isNull(ownerNode)) {
+        // we hit a wall, either we are in native shadow mode or the node is not in lwc boundary.
+        return getDocumentOrRootNode.call(node);
+    }
+    return getShadowRoot(ownerNode);
 }
 /**
  * If looking for a root node beyond shadow root by calling `node.getRootNode({composed: true})`, use the original `Node.prototype.getRootNode` method
@@ -1321,177 +1330,160 @@ function getNearestRoot(node) {
  *
  **/
 function getRootNodePatched(options) {
-  const composed = isUndefined(options) ? false : !!options.composed;
-  return isTrue(composed) ? getDocumentOrRootNode.call(this, options) : getNearestRoot(this);
+    const composed = isUndefined(options) ? false : !!options.composed;
+    return isTrue(composed) ? getDocumentOrRootNode.call(this, options) : getNearestRoot(this);
 }
 // Non-deep-traversing patches: this descriptor map includes all descriptors that
 // do not give access to nodes beyond the immediate children.
 defineProperties(_Node.prototype, {
-  firstChild: {
-    get() {
-      if (hasMountedChildren(this)) {
-        return firstChildGetterPatched.call(this);
-      }
-      return firstChildGetter.call(this);
+    firstChild: {
+        get() {
+            if (hasMountedChildren(this)) {
+                return firstChildGetterPatched.call(this);
+            }
+            return firstChildGetter.call(this);
+        },
+        enumerable: true,
+        configurable: true,
     },
-    enumerable: true,
-    configurable: true
-  },
-  lastChild: {
-    get() {
-      if (hasMountedChildren(this)) {
-        return lastChildGetterPatched.call(this);
-      }
-      return lastChildGetter.call(this);
+    lastChild: {
+        get() {
+            if (hasMountedChildren(this)) {
+                return lastChildGetterPatched.call(this);
+            }
+            return lastChildGetter.call(this);
+        },
+        enumerable: true,
+        configurable: true,
     },
-    enumerable: true,
-    configurable: true
-  },
-  textContent: {
-    get() {
-      if (!lwcRuntimeFlags.ENABLE_NODE_PATCH) {
-        if (isNodeShadowed(this) || isSyntheticShadowHost(this)) {
-          return textContentGetterPatched.call(this);
-        }
-        return textContentGetter.call(this);
-      }
-      // TODO [#1222]: remove global bypass
-      if (isGlobalPatchingSkipped(this)) {
-        return textContentGetter.call(this);
-      }
-      return textContentGetterPatched.call(this);
+    textContent: {
+        get() {
+            // Note: we deviate from native shadow here, but are not fixing
+            // due to backwards compat: https://github.com/salesforce/lwc/pull/3103
+            if (isNodeShadowed(this) || isSyntheticShadowHost(this)) {
+                return textContentGetterPatched.call(this);
+            }
+            return textContentGetter.call(this);
+        },
+        set: textContentSetterPatched,
+        enumerable: true,
+        configurable: true,
     },
-    set: textContentSetterPatched,
-    enumerable: true,
-    configurable: true
-  },
-  parentNode: {
-    get() {
-      if (isNodeShadowed(this)) {
-        return parentNodeGetterPatched.call(this);
-      }
-      const parentNode = parentNodeGetter.call(this);
-      // Handle the case where a top level light DOM element is slotted into a synthetic
-      // shadow slot.
-      if (!isNull(parentNode) && isSyntheticSlotElement(parentNode)) {
-        return getNodeOwner(parentNode);
-      }
-      return parentNode;
+    parentNode: {
+        get() {
+            if (isNodeShadowed(this)) {
+                return parentNodeGetterPatched.call(this);
+            }
+            const parentNode = parentNodeGetter.call(this);
+            // Handle the case where a top level light DOM element is slotted into a synthetic
+            // shadow slot.
+            if (!isNull(parentNode) && isSyntheticSlotElement(parentNode)) {
+                return getNodeOwner(parentNode);
+            }
+            return parentNode;
+        },
+        enumerable: true,
+        configurable: true,
     },
-    enumerable: true,
-    configurable: true
-  },
-  parentElement: {
-    get() {
-      if (isNodeShadowed(this)) {
-        return parentElementGetterPatched.call(this);
-      }
-      const parentElement = parentElementGetter.call(this);
-      // Handle the case where a top level light DOM element is slotted into a synthetic
-      // shadow slot.
-      if (!isNull(parentElement) && isSyntheticSlotElement(parentElement)) {
-        return getNodeOwner(parentElement);
-      }
-      return parentElement;
+    parentElement: {
+        get() {
+            if (isNodeShadowed(this)) {
+                return parentElementGetterPatched.call(this);
+            }
+            const parentElement = parentElementGetter.call(this);
+            // Handle the case where a top level light DOM element is slotted into a synthetic
+            // shadow slot.
+            if (!isNull(parentElement) && isSyntheticSlotElement(parentElement)) {
+                return getNodeOwner(parentElement);
+            }
+            return parentElement;
+        },
+        enumerable: true,
+        configurable: true,
     },
-    enumerable: true,
-    configurable: true
-  },
-  childNodes: {
-    get() {
-      if (hasMountedChildren(this)) {
-        return childNodesGetterPatched.call(this);
-      }
-      return childNodesGetter.call(this);
+    childNodes: {
+        get() {
+            if (hasMountedChildren(this)) {
+                return childNodesGetterPatched.call(this);
+            }
+            return childNodesGetter.call(this);
+        },
+        enumerable: true,
+        configurable: true,
     },
-    enumerable: true,
-    configurable: true
-  },
-  hasChildNodes: {
-    value() {
-      if (hasMountedChildren(this)) {
-        return hasChildNodesPatched.call(this);
-      }
-      return hasChildNodes.call(this);
+    hasChildNodes: {
+        value() {
+            if (hasMountedChildren(this)) {
+                return hasChildNodesPatched.call(this);
+            }
+            return hasChildNodes.call(this);
+        },
+        enumerable: true,
+        writable: true,
+        configurable: true,
     },
-    enumerable: true,
-    writable: true,
-    configurable: true
-  },
-  compareDocumentPosition: {
-    value(otherNode) {
-      // TODO [#1222]: remove global bypass
-      if (isGlobalPatchingSkipped(this)) {
-        return compareDocumentPosition.call(this, otherNode);
-      }
-      return compareDocumentPositionPatched.call(this, otherNode);
+    compareDocumentPosition: {
+        value(otherNode) {
+            // Note: we deviate from native shadow here, but are not fixing
+            // due to backwards compat: https://github.com/salesforce/lwc/pull/3103
+            if (isGlobalPatchingSkipped(this)) {
+                return compareDocumentPosition.call(this, otherNode);
+            }
+            return compareDocumentPositionPatched.call(this, otherNode);
+        },
+        enumerable: true,
+        writable: true,
+        configurable: true,
     },
-    enumerable: true,
-    writable: true,
-    configurable: true
-  },
-  contains: {
-    value(otherNode) {
-      // 1. Node.prototype.contains() returns true if otherNode is an inclusive descendant
-      //    spec: https://dom.spec.whatwg.org/#dom-node-contains
-      // 2. This normalizes the behavior of this api across all browsers.
-      //    In IE11, a disconnected dom element without children invoking contains() on self, returns false
-      if (this === otherNode) {
-        return true;
-      }
-      if (!lwcRuntimeFlags.ENABLE_NODE_PATCH) {
-        if (otherNode == null) {
-          return false;
-        }
-        if (isNodeShadowed(this) || isSyntheticShadowHost(this)) {
-          return containsPatched.call(this, otherNode);
-        }
-        return contains.call(this, otherNode);
-      }
-      // TODO [#1222]: remove global bypass
-      if (isGlobalPatchingSkipped(this)) {
-        return contains.call(this, otherNode);
-      }
-      return containsPatched.call(this, otherNode);
+    contains: {
+        value(otherNode) {
+            // 1. Node.prototype.contains() returns true if otherNode is an inclusive descendant
+            //    spec: https://dom.spec.whatwg.org/#dom-node-contains
+            // 2. This normalizes the behavior of this api across all browsers.
+            //    In IE11, a disconnected dom element without children invoking contains() on self, returns false
+            if (this === otherNode) {
+                return true;
+            }
+            // Note: we deviate from native shadow here, but are not fixing
+            // due to backwards compat: https://github.com/salesforce/lwc/pull/3103
+            if (otherNode == null) {
+                return false;
+            }
+            if (isNodeShadowed(this) || isSyntheticShadowHost(this)) {
+                return containsPatched.call(this, otherNode);
+            }
+            return contains.call(this, otherNode);
+        },
+        enumerable: true,
+        writable: true,
+        configurable: true,
     },
-    enumerable: true,
-    writable: true,
-    configurable: true
-  },
-  cloneNode: {
-    value(deep) {
-      if (!lwcRuntimeFlags.ENABLE_NODE_PATCH) {
-        if (isNodeShadowed(this) || isSyntheticShadowHost(this)) {
-          return cloneNodePatched.call(this, deep);
-        }
-        return cloneNode.call(this, deep);
-      }
-      if (isTrue(deep)) {
-        // TODO [#1222]: remove global bypass
-        if (isGlobalPatchingSkipped(this)) {
-          return cloneNode.call(this, deep);
-        }
-        return cloneNodePatched.call(this, deep);
-      }
-      return cloneNode.call(this, deep);
+    cloneNode: {
+        value(deep) {
+            // Note: we deviate from native shadow here, but are not fixing
+            // due to backwards compat: https://github.com/salesforce/lwc/pull/3103
+            if (isNodeShadowed(this) || isSyntheticShadowHost(this)) {
+                return cloneNodePatched.call(this, deep);
+            }
+            return cloneNode.call(this, deep);
+        },
+        enumerable: true,
+        writable: true,
+        configurable: true,
+    },
+    getRootNode: {
+        value: getRootNodePatched,
+        enumerable: true,
+        configurable: true,
+        writable: true,
+    },
+    isConnected: {
+        enumerable: true,
+        configurable: true,
+        get() {
+            return isConnected.call(this);
+        },
     },
-    enumerable: true,
-    writable: true,
-    configurable: true
-  },
-  getRootNode: {
-    value: getRootNodePatched,
-    enumerable: true,
-    configurable: true,
-    writable: true
-  },
-  isConnected: {
-    enumerable: true,
-    configurable: true,
-    get() {
-      return isConnected.call(this);
-    }
-  }
 });
 let internalChildNodeAccessorFlag = false;
 /**
@@ -1501,35 +1493,38 @@ let internalChildNodeAccessorFlag = false;
  * case, the IE11 debugging comment for shadowRoot representation on the devtool.
  */
 function isExternalChildNodeAccessorFlagOn() {
-  return !internalChildNodeAccessorFlag;
-}
-const getInternalChildNodes = process.env.NODE_ENV !== 'production' && isFalse(hasNativeSymbolSupport) ? function (node) {
-  internalChildNodeAccessorFlag = true;
-  let childNodes;
-  let error = null;
-  try {
-    childNodes = node.childNodes;
-  } catch (e) {
-    // childNodes accessor should never throw, but just in case!
-    error = e;
-  } finally {
-    internalChildNodeAccessorFlag = false;
-    if (!isNull(error)) {
-      // re-throwing after restoring the state machinery for setInternalChildNodeAccessorFlag
-      throw error; // eslint-disable-line no-unsafe-finally
+    return !internalChildNodeAccessorFlag;
+}
+const getInternalChildNodes = process.env.NODE_ENV !== 'production' && isFalse(hasNativeSymbolSupport)
+    ? function (node) {
+        internalChildNodeAccessorFlag = true;
+        let childNodes;
+        let error = null;
+        try {
+            childNodes = node.childNodes;
+        }
+        catch (e) {
+            // childNodes accessor should never throw, but just in case!
+            error = e;
+        }
+        finally {
+            internalChildNodeAccessorFlag = false;
+            if (!isNull(error)) {
+                // re-throwing after restoring the state machinery for setInternalChildNodeAccessorFlag
+                throw error; // eslint-disable-line no-unsafe-finally
+            }
+        }
+        return childNodes;
     }
-  }
-
-  return childNodes;
-} : function (node) {
-  return node.childNodes;
-};
+    : function (node) {
+        return node.childNodes;
+    };
 // IE11 extra patches for wrong prototypes
 if (hasOwnProperty.call(HTMLElement.prototype, 'contains')) {
-  defineProperty(HTMLElement.prototype, 'contains', getOwnPropertyDescriptor(_Node.prototype, 'contains'));
+    defineProperty(HTMLElement.prototype, 'contains', getOwnPropertyDescriptor(_Node.prototype, 'contains'));
 }
 if (hasOwnProperty.call(HTMLElement.prototype, 'parentElement')) {
-  defineProperty(HTMLElement.prototype, 'parentElement', getOwnPropertyDescriptor(_Node.prototype, 'parentElement'));
+    defineProperty(HTMLElement.prototype, 'parentElement', getOwnPropertyDescriptor(_Node.prototype, 'parentElement'));
 }
 
 /*
@@ -2496,7 +2491,8 @@ defineProperty(Document.prototype, 'getElementById', {
         if (isNull(elm)) {
             return null;
         }
-        // TODO [#1222]: remove global bypass
+        // Note: we deviate from native shadow here, but are not fixing
+        // due to backwards compat: https://github.com/salesforce/lwc/pull/3103
         return isUndefined(getNodeOwnerKey(elm)) || isGlobalPatchingSkipped(elm) ? elm : null;
     },
     writable: true,
@@ -2507,7 +2503,8 @@ defineProperty(Document.prototype, 'querySelector', {
     value() {
         const elements = arrayFromCollection(querySelectorAll.apply(this, ArraySlice.call(arguments)));
         const filtered = ArrayFind.call(elements, 
-        // TODO [#1222]: remove global bypass
+        // Note: we deviate from native shadow here, but are not fixing
+        // due to backwards compat: https://github.com/salesforce/lwc/pull/3103
         (elm) => isUndefined(getNodeOwnerKey(elm)) || isGlobalPatchingSkipped(elm));
         return !isUndefined(filtered) ? filtered : null;
     },
@@ -2519,7 +2516,8 @@ defineProperty(Document.prototype, 'querySelectorAll', {
     value() {
         const elements = arrayFromCollection(querySelectorAll.apply(this, ArraySlice.call(arguments)));
         const filtered = ArrayFilter.call(elements, 
-        // TODO [#1222]: remove global bypass
+        // Note: we deviate from native shadow here, but are not fixing
+        // due to backwards compat: https://github.com/salesforce/lwc/pull/3103
         (elm) => isUndefined(getNodeOwnerKey(elm)) || isGlobalPatchingSkipped(elm));
         return createStaticNodeList(filtered);
     },
@@ -2531,7 +2529,8 @@ defineProperty(Document.prototype, 'getElementsByClassName', {
     value() {
         const elements = arrayFromCollection(getElementsByClassName.apply(this, ArraySlice.call(arguments)));
         const filtered = ArrayFilter.call(elements, 
-        // TODO [#1222]: remove global bypass
+        // Note: we deviate from native shadow here, but are not fixing
+        // due to backwards compat: https://github.com/salesforce/lwc/pull/3103
         (elm) => isUndefined(getNodeOwnerKey(elm)) || isGlobalPatchingSkipped(elm));
         return createStaticHTMLCollection(filtered);
     },
@@ -2543,7 +2542,8 @@ defineProperty(Document.prototype, 'getElementsByTagName', {
     value() {
         const elements = arrayFromCollection(getElementsByTagName.apply(this, ArraySlice.call(arguments)));
         const filtered = ArrayFilter.call(elements, 
-        // TODO [#1222]: remove global bypass
+        // Note: we deviate from native shadow here, but are not fixing
+        // due to backwards compat: https://github.com/salesforce/lwc/pull/3103
         (elm) => isUndefined(getNodeOwnerKey(elm)) || isGlobalPatchingSkipped(elm));
         return createStaticHTMLCollection(filtered);
     },
@@ -2555,7 +2555,8 @@ defineProperty(Document.prototype, 'getElementsByTagNameNS', {
     value() {
         const elements = arrayFromCollection(getElementsByTagNameNS.apply(this, ArraySlice.call(arguments)));
         const filtered = ArrayFilter.call(elements, 
-        // TODO [#1222]: remove global bypass
+        // Note: we deviate from native shadow here, but are not fixing
+        // due to backwards compat: https://github.com/salesforce/lwc/pull/3103
         (elm) => isUndefined(getNodeOwnerKey(elm)) || isGlobalPatchingSkipped(elm));
         return createStaticHTMLCollection(filtered);
     },
@@ -2571,7 +2572,8 @@ getOwnPropertyDescriptor(HTMLDocument.prototype, 'getElementsByName')
     value() {
         const elements = arrayFromCollection(getElementsByName.apply(this, ArraySlice.call(arguments)));
         const filtered = ArrayFilter.call(elements, 
-        // TODO [#1222]: remove global bypass
+        // Note: we deviate from native shadow here, but are not fixing
+        // due to backwards compat: https://github.com/salesforce/lwc/pull/3103
         (elm) => isUndefined(getNodeOwnerKey(elm)) || isGlobalPatchingSkipped(elm));
         return createStaticNodeList(filtered);
     },
@@ -3673,7 +3675,8 @@ function getNonPatchedFilteredArrayOfNodes(context, unfilteredNodes) {
     else if (context instanceof HTMLBodyElement) {
         // `context` is document.body which is already patched.
         filtered = ArrayFilter.call(unfilteredNodes, 
-        // TODO [#1222]: remove global bypass
+        // Note: we deviate from native shadow here, but are not fixing
+        // due to backwards compat: https://github.com/salesforce/lwc/pull/3103
         (elm) => isUndefined(getNodeOwnerKey(elm)) || isGlobalPatchingSkipped(context));
     }
     else {
@@ -3690,247 +3693,233 @@ function getNonPatchedFilteredArrayOfNodes(context, unfilteredNodes) {
  * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
  */
 function innerHTMLGetterPatched() {
-  const childNodes = getInternalChildNodes(this);
-  let innerHTML = '';
-  for (let i = 0, len = childNodes.length; i < len; i += 1) {
-    innerHTML += getOuterHTML(childNodes[i]);
-  }
-  return innerHTML;
+    const childNodes = getInternalChildNodes(this);
+    let innerHTML = '';
+    for (let i = 0, len = childNodes.length; i < len; i += 1) {
+        innerHTML += getOuterHTML(childNodes[i]);
+    }
+    return innerHTML;
 }
 function outerHTMLGetterPatched() {
-  return getOuterHTML(this);
+    return getOuterHTML(this);
 }
 function attachShadowPatched(options) {
-  // To retain native behavior of the API, provide synthetic shadowRoot only when specified
-  if (options[KEY__SYNTHETIC_MODE]) {
-    return attachShadow(this, options);
-  }
-  return attachShadow$1.call(this, options);
+    // To retain native behavior of the API, provide synthetic shadowRoot only when specified
+    if (options[KEY__SYNTHETIC_MODE]) {
+        return attachShadow(this, options);
+    }
+    return attachShadow$1.call(this, options);
 }
 function shadowRootGetterPatched() {
-  if (isSyntheticShadowHost(this)) {
-    const shadow = getShadowRoot(this);
-    if (shadow.mode === 'open') {
-      return shadow;
+    if (isSyntheticShadowHost(this)) {
+        const shadow = getShadowRoot(this);
+        if (shadow.mode === 'open') {
+            return shadow;
+        }
     }
-  }
-  return shadowRootGetter.call(this);
+    return shadowRootGetter.call(this);
 }
 function childrenGetterPatched() {
-  const owner = getNodeOwner(this);
-  const childNodes = isNull(owner) ? [] : getAllMatches(owner, getFilteredChildNodes(this));
-  return createStaticHTMLCollection(ArrayFilter.call(childNodes, node => node instanceof Element));
+    const owner = getNodeOwner(this);
+    const childNodes = isNull(owner) ? [] : getAllMatches(owner, getFilteredChildNodes(this));
+    return createStaticHTMLCollection(ArrayFilter.call(childNodes, (node) => node instanceof Element));
 }
 function childElementCountGetterPatched() {
-  return this.children.length;
+    return this.children.length;
 }
 function firstElementChildGetterPatched() {
-  return this.children[0] || null;
+    return this.children[0] || null;
 }
 function lastElementChildGetterPatched() {
-  const {
-    children
-  } = this;
-  return children.item(children.length - 1) || null;
+    const { children } = this;
+    return children.item(children.length - 1) || null;
 }
 // Non-deep-traversing patches: this descriptor map includes all descriptors that
 // do not five access to nodes beyond the immediate children.
 defineProperties(Element.prototype, {
-  innerHTML: {
-    get() {
-      if (!lwcRuntimeFlags.ENABLE_ELEMENT_PATCH) {
-        if (isNodeShadowed(this) || isSyntheticShadowHost(this)) {
-          return innerHTMLGetterPatched.call(this);
-        }
-        return innerHTMLGetter.call(this);
-      }
-      // TODO [#1222]: remove global bypass
-      if (isGlobalPatchingSkipped(this)) {
-        return innerHTMLGetter.call(this);
-      }
-      return innerHTMLGetterPatched.call(this);
+    innerHTML: {
+        get() {
+            // Note: we deviate from native shadow here, but are not fixing
+            // due to backwards compat: https://github.com/salesforce/lwc/pull/3103
+            if (isNodeShadowed(this) || isSyntheticShadowHost(this)) {
+                return innerHTMLGetterPatched.call(this);
+            }
+            return innerHTMLGetter.call(this);
+        },
+        set(v) {
+            innerHTMLSetter.call(this, v);
+        },
+        enumerable: true,
+        configurable: true,
     },
-    set(v) {
-      innerHTMLSetter.call(this, v);
+    outerHTML: {
+        get() {
+            // Note: we deviate from native shadow here, but are not fixing
+            // due to backwards compat: https://github.com/salesforce/lwc/pull/3103
+            if (isNodeShadowed(this) || isSyntheticShadowHost(this)) {
+                return outerHTMLGetterPatched.call(this);
+            }
+            return outerHTMLGetter.call(this);
+        },
+        set(v) {
+            outerHTMLSetter.call(this, v);
+        },
+        enumerable: true,
+        configurable: true,
     },
-    enumerable: true,
-    configurable: true
-  },
-  outerHTML: {
-    get() {
-      if (!lwcRuntimeFlags.ENABLE_ELEMENT_PATCH) {
-        if (isNodeShadowed(this) || isSyntheticShadowHost(this)) {
-          return outerHTMLGetterPatched.call(this);
-        }
-        return outerHTMLGetter.call(this);
-      }
-      // TODO [#1222]: remove global bypass
-      if (isGlobalPatchingSkipped(this)) {
-        return outerHTMLGetter.call(this);
-      }
-      return outerHTMLGetterPatched.call(this);
+    attachShadow: {
+        value: attachShadowPatched,
+        enumerable: true,
+        writable: true,
+        configurable: true,
     },
-    set(v) {
-      outerHTMLSetter.call(this, v);
+    shadowRoot: {
+        get: shadowRootGetterPatched,
+        enumerable: true,
+        configurable: true,
     },
-    enumerable: true,
-    configurable: true
-  },
-  attachShadow: {
-    value: attachShadowPatched,
-    enumerable: true,
-    writable: true,
-    configurable: true
-  },
-  shadowRoot: {
-    get: shadowRootGetterPatched,
-    enumerable: true,
-    configurable: true
-  },
-  // patched in HTMLElement if exists (IE11 is the one off here)
-  children: {
-    get() {
-      if (hasMountedChildren(this)) {
-        return childrenGetterPatched.call(this);
-      }
-      return childrenGetter.call(this);
+    // patched in HTMLElement if exists (IE11 is the one off here)
+    children: {
+        get() {
+            if (hasMountedChildren(this)) {
+                return childrenGetterPatched.call(this);
+            }
+            return childrenGetter.call(this);
+        },
+        enumerable: true,
+        configurable: true,
     },
-    enumerable: true,
-    configurable: true
-  },
-  childElementCount: {
-    get() {
-      if (hasMountedChildren(this)) {
-        return childElementCountGetterPatched.call(this);
-      }
-      return childElementCountGetter.call(this);
+    childElementCount: {
+        get() {
+            if (hasMountedChildren(this)) {
+                return childElementCountGetterPatched.call(this);
+            }
+            return childElementCountGetter.call(this);
+        },
+        enumerable: true,
+        configurable: true,
     },
-    enumerable: true,
-    configurable: true
-  },
-  firstElementChild: {
-    get() {
-      if (hasMountedChildren(this)) {
-        return firstElementChildGetterPatched.call(this);
-      }
-      return firstElementChildGetter.call(this);
+    firstElementChild: {
+        get() {
+            if (hasMountedChildren(this)) {
+                return firstElementChildGetterPatched.call(this);
+            }
+            return firstElementChildGetter.call(this);
+        },
+        enumerable: true,
+        configurable: true,
     },
-    enumerable: true,
-    configurable: true
-  },
-  lastElementChild: {
-    get() {
-      if (hasMountedChildren(this)) {
-        return lastElementChildGetterPatched.call(this);
-      }
-      return lastElementChildGetter.call(this);
+    lastElementChild: {
+        get() {
+            if (hasMountedChildren(this)) {
+                return lastElementChildGetterPatched.call(this);
+            }
+            return lastElementChildGetter.call(this);
+        },
+        enumerable: true,
+        configurable: true,
+    },
+    assignedSlot: {
+        get: assignedSlotGetterPatched,
+        enumerable: true,
+        configurable: true,
     },
-    enumerable: true,
-    configurable: true
-  },
-  assignedSlot: {
-    get: assignedSlotGetterPatched,
-    enumerable: true,
-    configurable: true
-  }
 });
 // IE11 extra patches for wrong prototypes
 if (hasOwnProperty.call(HTMLElement.prototype, 'innerHTML')) {
-  defineProperty(HTMLElement.prototype, 'innerHTML', getOwnPropertyDescriptor(Element.prototype, 'innerHTML'));
+    defineProperty(HTMLElement.prototype, 'innerHTML', getOwnPropertyDescriptor(Element.prototype, 'innerHTML'));
 }
 if (hasOwnProperty.call(HTMLElement.prototype, 'outerHTML')) {
-  defineProperty(HTMLElement.prototype, 'outerHTML', getOwnPropertyDescriptor(Element.prototype, 'outerHTML'));
+    defineProperty(HTMLElement.prototype, 'outerHTML', getOwnPropertyDescriptor(Element.prototype, 'outerHTML'));
 }
 if (hasOwnProperty.call(HTMLElement.prototype, 'children')) {
-  defineProperty(HTMLElement.prototype, 'children', getOwnPropertyDescriptor(Element.prototype, 'children'));
+    defineProperty(HTMLElement.prototype, 'children', getOwnPropertyDescriptor(Element.prototype, 'children'));
 }
 // Deep-traversing patches from this point on:
 function querySelectorPatched() {
-  const nodeList = arrayFromCollection(querySelectorAll$1.apply(this, ArraySlice.call(arguments)));
-  if (isSyntheticShadowHost(this)) {
-    // element with shadowRoot attached
-    const owner = getNodeOwner(this);
-    if (!isUndefined(getNodeKey(this))) {
-      // it is a custom element, and we should then filter by slotted elements
-      return getFirstSlottedMatch(this, nodeList);
-    } else if (isNull(owner)) {
-      return null;
-    } else {
-      // regular element, we should then filter by ownership
-      return getFirstMatch(owner, nodeList);
+    const nodeList = arrayFromCollection(querySelectorAll$1.apply(this, ArraySlice.call(arguments)));
+    if (isSyntheticShadowHost(this)) {
+        // element with shadowRoot attached
+        const owner = getNodeOwner(this);
+        if (!isUndefined(getNodeKey(this))) {
+            // it is a custom element, and we should then filter by slotted elements
+            return getFirstSlottedMatch(this, nodeList);
+        }
+        else if (isNull(owner)) {
+            return null;
+        }
+        else {
+            // regular element, we should then filter by ownership
+            return getFirstMatch(owner, nodeList);
+        }
     }
-  } else if (isNodeShadowed(this)) {
-    // element inside a shadowRoot
-    const ownerKey = getNodeOwnerKey(this);
-    if (!isUndefined(ownerKey)) {
-      // `this` is handled by lwc, using getNodeNearestOwnerKey to include manually inserted elements in the same shadow.
-      const elm = ArrayFind.call(nodeList, elm => getNodeNearestOwnerKey(elm) === ownerKey);
-      return isUndefined(elm) ? null : elm;
-    } else {
-      if (!lwcRuntimeFlags.ENABLE_NODE_LIST_PATCH) {
-        // `this` is a manually inserted element inside a shadowRoot, return the first element.
-        return nodeList.length === 0 ? null : nodeList[0];
-      }
-      // Element is inside a shadow but we dont know which one. Use the
-      // "nearest" owner key to filter by ownership.
-      const contextNearestOwnerKey = getNodeNearestOwnerKey(this);
-      const elm = ArrayFind.call(nodeList, elm => getNodeNearestOwnerKey(elm) === contextNearestOwnerKey);
-      return isUndefined(elm) ? null : elm;
+    else if (isNodeShadowed(this)) {
+        // element inside a shadowRoot
+        const ownerKey = getNodeOwnerKey(this);
+        if (!isUndefined(ownerKey)) {
+            // `this` is handled by lwc, using getNodeNearestOwnerKey to include manually inserted elements in the same shadow.
+            const elm = ArrayFind.call(nodeList, (elm) => getNodeNearestOwnerKey(elm) === ownerKey);
+            return isUndefined(elm) ? null : elm;
+        }
+        else {
+            // Note: we deviate from native shadow here, but are not fixing
+            // due to backwards compat: https://github.com/salesforce/lwc/pull/3103
+            // `this` is a manually inserted element inside a shadowRoot, return the first element.
+            return nodeList.length === 0 ? null : nodeList[0];
+        }
     }
-  } else {
-    if (!lwcRuntimeFlags.ENABLE_NODE_LIST_PATCH) {
-      if (!(this instanceof HTMLBodyElement)) {
-        const elm = nodeList[0];
+    else {
+        if (!(this instanceof HTMLBodyElement)) {
+            const elm = nodeList[0];
+            return isUndefined(elm) ? null : elm;
+        }
+        // element belonging to the document
+        const elm = ArrayFind.call(nodeList, (elm) => isUndefined(getNodeOwnerKey(elm)) || isGlobalPatchingSkipped(this));
         return isUndefined(elm) ? null : elm;
-      }
     }
-    // element belonging to the document
-    const elm = ArrayFind.call(nodeList,
-    // TODO [#1222]: remove global bypass
-    elm => isUndefined(getNodeOwnerKey(elm)) || isGlobalPatchingSkipped(this));
-    return isUndefined(elm) ? null : elm;
-  }
 }
-function getFilteredArrayOfNodes(context, unfilteredNodes, shadowDomSemantic) {
-  let filtered;
-  if (isSyntheticShadowHost(context)) {
-    // element with shadowRoot attached
-    const owner = getNodeOwner(context);
-    if (!isUndefined(getNodeKey(context))) {
-      // it is a custom element, and we should then filter by slotted elements
-      filtered = getAllSlottedMatches(context, unfilteredNodes);
-    } else if (isNull(owner)) {
-      filtered = [];
-    } else {
-      // regular element, we should then filter by ownership
-      filtered = getAllMatches(owner, unfilteredNodes);
+function getFilteredArrayOfNodes(context, unfilteredNodes) {
+    let filtered;
+    if (isSyntheticShadowHost(context)) {
+        // element with shadowRoot attached
+        const owner = getNodeOwner(context);
+        if (!isUndefined(getNodeKey(context))) {
+            // it is a custom element, and we should then filter by slotted elements
+            filtered = getAllSlottedMatches(context, unfilteredNodes);
+        }
+        else if (isNull(owner)) {
+            filtered = [];
+        }
+        else {
+            // regular element, we should then filter by ownership
+            filtered = getAllMatches(owner, unfilteredNodes);
+        }
     }
-  } else if (isNodeShadowed(context)) {
-    // element inside a shadowRoot
-    const ownerKey = getNodeOwnerKey(context);
-    if (!isUndefined(ownerKey)) {
-      // context is handled by lwc, using getNodeNearestOwnerKey to include manually inserted elements in the same shadow.
-      filtered = ArrayFilter.call(unfilteredNodes, elm => getNodeNearestOwnerKey(elm) === ownerKey);
-    } else if (shadowDomSemantic === 1 /* ShadowDomSemantic.Enabled */) {
-      // context is inside a shadow, we dont know which one.
-      const contextNearestOwnerKey = getNodeNearestOwnerKey(context);
-      filtered = ArrayFilter.call(unfilteredNodes, elm => getNodeNearestOwnerKey(elm) === contextNearestOwnerKey);
-    } else {
-      // context is manually inserted without lwc:dom-manual and ShadowDomSemantics is off, return everything
-      filtered = ArraySlice.call(unfilteredNodes);
+    else if (isNodeShadowed(context)) {
+        // element inside a shadowRoot
+        const ownerKey = getNodeOwnerKey(context);
+        if (!isUndefined(ownerKey)) {
+            // context is handled by lwc, using getNodeNearestOwnerKey to include manually inserted elements in the same shadow.
+            filtered = ArrayFilter.call(unfilteredNodes, (elm) => getNodeNearestOwnerKey(elm) === ownerKey);
+        }
+        else {
+            // Note: we deviate from native shadow here, but are not fixing
+            // due to backwards compat: https://github.com/salesforce/lwc/pull/3103
+            // context is manually inserted without lwc:dom-manual, return everything
+            filtered = ArraySlice.call(unfilteredNodes);
+        }
     }
-  } else {
-    if (context instanceof HTMLBodyElement || shadowDomSemantic === 1 /* ShadowDomSemantic.Enabled */) {
-      // `context` is document.body or element belonging to the document with the patch enabled
-      filtered = ArrayFilter.call(unfilteredNodes,
-      // TODO [#1222]: remove global bypass
-      elm => isUndefined(getNodeOwnerKey(elm)) || isGlobalPatchingSkipped(context));
-    } else {
-      // `context` is outside the lwc boundary and patch is not enabled.
-      filtered = ArraySlice.call(unfilteredNodes);
+    else {
+        if (context instanceof HTMLBodyElement) {
+            // `context` is document.body or element belonging to the document with the patch enabled
+            filtered = ArrayFilter.call(unfilteredNodes, (elm) => isUndefined(getNodeOwnerKey(elm)) || isGlobalPatchingSkipped(context));
+        }
+        else {
+            // `context` is outside the lwc boundary and patch is not enabled.
+            filtered = ArraySlice.call(unfilteredNodes);
+        }
     }
-  }
-  return filtered;
+    return filtered;
 }
 // The following patched methods hide shadowed elements from global
 // traversing mechanisms. They are simplified for performance reasons to
@@ -3942,263 +3931,66 @@ function getFilteredArrayOfNodes(context, unfilteredNodes, shadowDomSemantic) {
 // is not a big problem considering the amount of code that is relying on
 // the liveliness of these results are rare.
 defineProperties(Element.prototype, {
-  querySelector: {
-    value: querySelectorPatched,
-    writable: true,
-    enumerable: true,
-    configurable: true
-  },
-  querySelectorAll: {
-    value() {
-      const nodeList = arrayFromCollection(querySelectorAll$1.apply(this, ArraySlice.call(arguments)));
-      if (!lwcRuntimeFlags.ENABLE_NODE_LIST_PATCH) {
-        const filteredResults = getFilteredArrayOfNodes(this, nodeList, 0 /* ShadowDomSemantic.Disabled */);
-        return createStaticNodeList(filteredResults);
-      }
-      return createStaticNodeList(getFilteredArrayOfNodes(this, nodeList, 1 /* ShadowDomSemantic.Enabled */));
+    querySelector: {
+        value: querySelectorPatched,
+        writable: true,
+        enumerable: true,
+        configurable: true,
+    },
+    querySelectorAll: {
+        value() {
+            const nodeList = arrayFromCollection(querySelectorAll$1.apply(this, ArraySlice.call(arguments)));
+            // Note: we deviate from native shadow here, but are not fixing
+            // due to backwards compat: https://github.com/salesforce/lwc/pull/3103
+            const filteredResults = getFilteredArrayOfNodes(this, nodeList);
+            return createStaticNodeList(filteredResults);
+        },
+        writable: true,
+        enumerable: true,
+        configurable: true,
     },
-
-    writable: true,
-    enumerable: true,
-    configurable: true
-  }
 });
 // The following APIs are used directly by Jest internally so we avoid patching them during testing.
 if (process.env.NODE_ENV !== 'test') {
-  defineProperties(Element.prototype, {
-    getElementsByClassName: {
-      value() {
-        const elements = arrayFromCollection(getElementsByClassName$1.apply(this, ArraySlice.call(arguments)));
-        if (!lwcRuntimeFlags.ENABLE_HTML_COLLECTIONS_PATCH) {
-          return createStaticHTMLCollection(getNonPatchedFilteredArrayOfNodes(this, elements));
-        }
-        const filteredResults = getFilteredArrayOfNodes(this, elements, 1 /* ShadowDomSemantic.Enabled */);
-        return createStaticHTMLCollection(filteredResults);
-      },
-      writable: true,
-      enumerable: true,
-      configurable: true
-    },
-    getElementsByTagName: {
-      value() {
-        const elements = arrayFromCollection(getElementsByTagName$1.apply(this, ArraySlice.call(arguments)));
-        if (!lwcRuntimeFlags.ENABLE_HTML_COLLECTIONS_PATCH) {
-          return createStaticHTMLCollection(getNonPatchedFilteredArrayOfNodes(this, elements));
-        }
-        const filteredResults = getFilteredArrayOfNodes(this, elements, 1 /* ShadowDomSemantic.Enabled */);
-        return createStaticHTMLCollection(filteredResults);
-      },
-      writable: true,
-      enumerable: true,
-      configurable: true
-    },
-    getElementsByTagNameNS: {
-      value() {
-        const elements = arrayFromCollection(getElementsByTagNameNS$1.apply(this, ArraySlice.call(arguments)));
-        if (!lwcRuntimeFlags.ENABLE_HTML_COLLECTIONS_PATCH) {
-          return createStaticHTMLCollection(getNonPatchedFilteredArrayOfNodes(this, elements));
-        }
-        const filteredResults = getFilteredArrayOfNodes(this, elements, 1 /* ShadowDomSemantic.Enabled */);
-        return createStaticHTMLCollection(filteredResults);
-      },
-      writable: true,
-      enumerable: true,
-      configurable: true
-    }
-  });
+    defineProperties(Element.prototype, {
+        getElementsByClassName: {
+            value() {
+                const elements = arrayFromCollection(getElementsByClassName$1.apply(this, ArraySlice.call(arguments)));
+                // Note: we deviate from native shadow here, but are not fixing
+                // due to backwards compat: https://github.com/salesforce/lwc/pull/3103
+                return createStaticHTMLCollection(getNonPatchedFilteredArrayOfNodes(this, elements));
+            },
+            writable: true,
+            enumerable: true,
+            configurable: true,
+        },
+        getElementsByTagName: {
+            value() {
+                const elements = arrayFromCollection(getElementsByTagName$1.apply(this, ArraySlice.call(arguments)));
+                // Note: we deviate from native shadow here, but are not fixing
+                // due to backwards compat: https://github.com/salesforce/lwc/pull/3103
+                return createStaticHTMLCollection(getNonPatchedFilteredArrayOfNodes(this, elements));
+            },
+            writable: true,
+            enumerable: true,
+            configurable: true,
+        },
+        getElementsByTagNameNS: {
+            value() {
+                const elements = arrayFromCollection(getElementsByTagNameNS$1.apply(this, ArraySlice.call(arguments)));
+                // Note: we deviate from native shadow here, but are not fixing
+                // due to backwards compat: https://github.com/salesforce/lwc/pull/3103
+                return createStaticHTMLCollection(getNonPatchedFilteredArrayOfNodes(this, elements));
+            },
+            writable: true,
+            enumerable: true,
+            configurable: true,
+        },
+    });
 }
 // IE11 extra patches for wrong prototypes
 if (hasOwnProperty.call(HTMLElement.prototype, 'getElementsByClassName')) {
-  defineProperty(HTMLElement.prototype, 'getElementsByClassName', getOwnPropertyDescriptor(Element.prototype, 'getElementsByClassName'));
-}
-
-/*
- * Copyright (c) 2018, salesforce.com, inc.
- * All rights reserved.
- * SPDX-License-Identifier: MIT
- * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
- */
-function getElementComputedStyle(element) {
-    const win = getOwnerWindow(element);
-    return windowGetComputedStyle.call(win, element);
-}
-function getWindowSelection(node) {
-    const win = getOwnerWindow(node);
-    return windowGetSelection.call(win);
-}
-function nodeIsBeingRendered(nodeComputedStyle) {
-    return nodeComputedStyle.visibility === 'visible' && nodeComputedStyle.display !== 'none';
-}
-function getSelectionState(element) {
-    const win = getOwnerWindow(element);
-    const selection = getWindowSelection(element);
-    if (selection === null) {
-        return null;
-    }
-    const ranges = [];
-    for (let i = 0; i < selection.rangeCount; i++) {
-        ranges.push(selection.getRangeAt(i));
-    }
-    const state = {
-        element,
-        onselect: win.onselect,
-        onselectstart: win.onselectstart,
-        onselectionchange: win.onselectionchange,
-        ranges,
-    };
-    win.onselect = null;
-    win.onselectstart = null;
-    win.onselectionchange = null;
-    return state;
-}
-function restoreSelectionState(state) {
-    if (state === null) {
-        return;
-    }
-    const { element, onselect, onselectstart, onselectionchange, ranges } = state;
-    const win = getOwnerWindow(element);
-    const selection = getWindowSelection(element);
-    selection.removeAllRanges();
-    for (let i = 0; i < ranges.length; i++) {
-        selection.addRange(ranges[i]);
-    }
-    win.onselect = onselect;
-    win.onselectstart = onselectstart;
-    win.onselectionchange = onselectionchange;
-}
-/**
- * Gets the "innerText" of a text node using the Selection API
- *
- * NOTE: For performance reasons, since this function will be called multiple times while calculating the innerText of
- *       an element, it does not restore the current selection.
- */
-function getTextNodeInnerText(textNode) {
-    const selection = getWindowSelection(textNode);
-    if (selection === null) {
-        return textNode.textContent || '';
-    }
-    const range = document.createRange();
-    range.selectNodeContents(textNode);
-    const domRect = range.getBoundingClientRect();
-    if (domRect.height <= 0 || domRect.width <= 0) {
-        // the text node is not rendered
-        return '';
-    }
-    // Needed to remove non rendered characters from the text node.
-    selection.removeAllRanges();
-    selection.addRange(range);
-    const selectionText = selection.toString();
-    // The textNode is visible, but it may not be selectable. When the text is not selectable,
-    // textContent is the nearest approximation to innerText.
-    return selectionText ? selectionText : textNode.textContent || '';
-}
-const nodeIsElement = (node) => node.nodeType === ELEMENT_NODE;
-const nodeIsText = (node) => node.nodeType === TEXT_NODE;
-/**
- * Spec: https://html.spec.whatwg.org/multipage/dom.html#inner-text-collection-steps
- * One spec implementation: https://github.com/servo/servo/blob/721271dcd3c20db5ca8cf146e2b5907647afb4d6/components/layout/query.rs#L1132
- */
-function innerTextCollectionSteps(node) {
-    const items = [];
-    if (nodeIsElement(node)) {
-        const { tagName } = node;
-        const computedStyle = getElementComputedStyle(node);
-        if (tagName === 'OPTION') {
-            // For options, is hard to get the "rendered" text, let's use the original getter.
-            return [1, innerTextGetter.call(node), 1];
-        }
-        else if (tagName === 'TEXTAREA') {
-            return [];
-        }
-        else {
-            const childNodes = node.childNodes;
-            for (let i = 0, n = childNodes.length; i < n; i++) {
-                ArrayPush.apply(items, innerTextCollectionSteps(childNodes[i]));
-            }
-        }
-        if (!nodeIsBeingRendered(computedStyle)) {
-            if (tagName === 'SELECT' || tagName === 'DATALIST') {
-                // the select is either: .visibility != 'visible' or .display === hidden, therefore this select should
-                // not display any value.
-                return [];
-            }
-            return items;
-        }
-        if (tagName === 'BR') {
-            items.push('\u{000A}' /* line feed */);
-        }
-        const { display } = computedStyle;
-        if (display === 'table-cell') {
-            // omitting case: and node's CSS box is not the last 'table-cell' box of its enclosing 'table-row' box
-            items.push('\u{0009}' /* tab */);
-        }
-        if (display === 'table-row') {
-            // omitting case: and node's CSS box is not the last 'table-row' box of the nearest ancestor 'table' box
-            items.push('\u{000A}' /* line feed */);
-        }
-        if (tagName === 'P') {
-            items.unshift(2);
-            items.push(2);
-        }
-        if (display === 'block' ||
-            display === 'table-caption' ||
-            display === 'flex' ||
-            display === 'table') {
-            items.unshift(1);
-            items.push(1);
-        }
-    }
-    else if (nodeIsText(node)) {
-        items.push(getTextNodeInnerText(node));
-    }
-    return items;
-}
-/**
- * InnerText getter spec: https://html.spec.whatwg.org/multipage/dom.html#the-innertext-idl-attribute
- *
- * One spec implementation: https://github.com/servo/servo/blob/721271dcd3c20db5ca8cf146e2b5907647afb4d6/components/layout/query.rs#L1087
- */
-function getInnerText(element) {
-    const thisComputedStyle = getElementComputedStyle(element);
-    if (!nodeIsBeingRendered(thisComputedStyle)) {
-        return getTextContent(element) || '';
-    }
-    const selectionState = getSelectionState(element);
-    const results = [];
-    const childNodes = element.childNodes;
-    for (let i = 0, n = childNodes.length; i < n; i++) {
-        ArrayPush.apply(results, innerTextCollectionSteps(childNodes[i]));
-    }
-    restoreSelectionState(selectionState);
-    let elementInnerText = '';
-    let maxReqLineBreakCount = 0;
-    for (let i = 0, n = results.length; i < n; i++) {
-        const item = results[i];
-        if (typeof item === 'string') {
-            if (maxReqLineBreakCount > 0) {
-                for (let j = 0; j < maxReqLineBreakCount; j++) {
-                    elementInnerText += '\u{000A}';
-                }
-                maxReqLineBreakCount = 0;
-            }
-            if (item.length > 0) {
-                elementInnerText += item;
-            }
-        }
-        else {
-            if (elementInnerText.length == 0) {
-                // Remove required line break count at the start.
-                continue;
-            }
-            // Store the count if it's the max of this run,
-            // but it may be ignored if no text item is found afterwards,
-            // which means that these are consecutive line breaks at the end.
-            if (item > maxReqLineBreakCount) {
-                maxReqLineBreakCount = item;
-            }
-        }
-    }
-    return elementInnerText;
+    defineProperty(HTMLElement.prototype, 'getElementsByClassName', getOwnPropertyDescriptor(Element.prototype, 'getElementsByClassName'));
 }
 
 /*
@@ -4548,209 +4340,184 @@ function ignoreFocusIn(elm) {
  * SPDX-License-Identifier: MIT
  * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
  */
-const {
-  blur,
-  focus
-} = HTMLElement.prototype;
+const { blur, focus } = HTMLElement.prototype;
 /**
  * This method only applies to elements with a shadow attached to them
  */
 function tabIndexGetterPatched() {
-  if (isDelegatingFocus(this) && isFalse(hasAttribute.call(this, 'tabindex'))) {
-    // this covers the case where the default tabindex should be 0 because the
-    // custom element is delegating its focus
-    return 0;
-  }
-  return tabIndexGetter.call(this);
+    if (isDelegatingFocus(this) && isFalse(hasAttribute.call(this, 'tabindex'))) {
+        // this covers the case where the default tabindex should be 0 because the
+        // custom element is delegating its focus
+        return 0;
+    }
+    return tabIndexGetter.call(this);
 }
 /**
  * This method only applies to elements with a shadow attached to them
  */
 function tabIndexSetterPatched(value) {
-  // This tabIndex setter might be confusing unless it is understood that HTML
-  // elements have default tabIndex property values. Natively focusable elements have
-  // a default tabIndex value of 0 and all other elements have a default tabIndex
-  // value of -1. For example, the tabIndex property value is -1 for both <x-foo> and
-  // <x-foo tabindex="-1">, but our delegatesFocus polyfill should only kick in for
-  // the latter case when the value of the tabindex attribute is -1.
-  const delegatesFocus = isDelegatingFocus(this);
-  // Record the state of things before invoking component setter.
-  const prevValue = tabIndexGetter.call(this);
-  const prevHasAttr = hasAttribute.call(this, 'tabindex');
-  tabIndexSetter.call(this, value);
-  // Record the state of things after invoking component setter.
-  const currValue = tabIndexGetter.call(this);
-  const currHasAttr = hasAttribute.call(this, 'tabindex');
-  const didValueChange = prevValue !== currValue;
-  // If the tabindex attribute is initially rendered, we can assume that this setter has
-  // previously executed and a listener has been added. We must remove that listener if
-  // the tabIndex property value has changed or if the component no longer renders a
-  // tabindex attribute.
-  if (prevHasAttr && (didValueChange || isFalse(currHasAttr))) {
-    if (prevValue === -1) {
-      ignoreFocusIn(this);
-    }
-    if (prevValue === 0 && delegatesFocus) {
-      ignoreFocus(this);
+    // This tabIndex setter might be confusing unless it is understood that HTML
+    // elements have default tabIndex property values. Natively focusable elements have
+    // a default tabIndex value of 0 and all other elements have a default tabIndex
+    // value of -1. For example, the tabIndex property value is -1 for both <x-foo> and
+    // <x-foo tabindex="-1">, but our delegatesFocus polyfill should only kick in for
+    // the latter case when the value of the tabindex attribute is -1.
+    const delegatesFocus = isDelegatingFocus(this);
+    // Record the state of things before invoking component setter.
+    const prevValue = tabIndexGetter.call(this);
+    const prevHasAttr = hasAttribute.call(this, 'tabindex');
+    tabIndexSetter.call(this, value);
+    // Record the state of things after invoking component setter.
+    const currValue = tabIndexGetter.call(this);
+    const currHasAttr = hasAttribute.call(this, 'tabindex');
+    const didValueChange = prevValue !== currValue;
+    // If the tabindex attribute is initially rendered, we can assume that this setter has
+    // previously executed and a listener has been added. We must remove that listener if
+    // the tabIndex property value has changed or if the component no longer renders a
+    // tabindex attribute.
+    if (prevHasAttr && (didValueChange || isFalse(currHasAttr))) {
+        if (prevValue === -1) {
+            ignoreFocusIn(this);
+        }
+        if (prevValue === 0 && delegatesFocus) {
+            ignoreFocus(this);
+        }
+    }
+    // If a tabindex attribute was not rendered after invoking its setter, it means the
+    // component is taking control. Do nothing.
+    if (isFalse(currHasAttr)) {
+        return;
+    }
+    // If the tabindex attribute is initially rendered, we can assume that this setter has
+    // previously executed and a listener has been added. If the tabindex attribute is still
+    // rendered after invoking the setter AND the tabIndex property value has not changed,
+    // we don't need to do any work.
+    if (prevHasAttr && currHasAttr && isFalse(didValueChange)) {
+        return;
+    }
+    // At this point we know that a tabindex attribute was rendered after invoking the
+    // setter and that either:
+    // 1) This is the first time this setter is being invoked.
+    // 2) This is not the first time this setter is being invoked and the value is changing.
+    // We need to add the appropriate listeners in either case.
+    if (currValue === -1) {
+        // Add the magic to skip the shadow tree
+        handleFocusIn(this);
+    }
+    if (currValue === 0 && delegatesFocus) {
+        // Add the magic to skip the host element
+        handleFocus(this);
     }
-  }
-  // If a tabindex attribute was not rendered after invoking its setter, it means the
-  // component is taking control. Do nothing.
-  if (isFalse(currHasAttr)) {
-    return;
-  }
-  // If the tabindex attribute is initially rendered, we can assume that this setter has
-  // previously executed and a listener has been added. If the tabindex attribute is still
-  // rendered after invoking the setter AND the tabIndex property value has not changed,
-  // we don't need to do any work.
-  if (prevHasAttr && currHasAttr && isFalse(didValueChange)) {
-    return;
-  }
-  // At this point we know that a tabindex attribute was rendered after invoking the
-  // setter and that either:
-  // 1) This is the first time this setter is being invoked.
-  // 2) This is not the first time this setter is being invoked and the value is changing.
-  // We need to add the appropriate listeners in either case.
-  if (currValue === -1) {
-    // Add the magic to skip the shadow tree
-    handleFocusIn(this);
-  }
-  if (currValue === 0 && delegatesFocus) {
-    // Add the magic to skip the host element
-    handleFocus(this);
-  }
 }
 /**
  * This method only applies to elements with a shadow attached to them
  */
 function blurPatched() {
-  if (isDelegatingFocus(this)) {
-    const currentActiveElement = getActiveElement(this);
-    if (!isNull(currentActiveElement)) {
-      // if there is an active element, blur it (intentionally using the dot notation in case the user defines the blur routine)
-      currentActiveElement.blur();
-      return;
+    if (isDelegatingFocus(this)) {
+        const currentActiveElement = getActiveElement(this);
+        if (!isNull(currentActiveElement)) {
+            // if there is an active element, blur it (intentionally using the dot notation in case the user defines the blur routine)
+            currentActiveElement.blur();
+            return;
+        }
     }
-  }
-  return blur.call(this);
+    return blur.call(this);
 }
 function focusPatched() {
-  // Save enabled state
-  const originallyEnabled = isKeyboardFocusNavigationRoutineEnabled();
-  // Change state by disabling if originally enabled
-  if (originallyEnabled) {
-    disableKeyboardFocusNavigationRoutines();
-  }
-  if (isSyntheticShadowHost(this) && isDelegatingFocus(this)) {
-    hostElementFocus.call(this);
-    return;
-  }
-  // Typescript does not like it when you treat the `arguments` object as an array
-  // @ts-ignore type-mismatch
-  focus.apply(this, arguments);
-  // Restore state by enabling if originally enabled
-  if (originallyEnabled) {
-    enableKeyboardFocusNavigationRoutines();
-  }
+    // Save enabled state
+    const originallyEnabled = isKeyboardFocusNavigationRoutineEnabled();
+    // Change state by disabling if originally enabled
+    if (originallyEnabled) {
+        disableKeyboardFocusNavigationRoutines();
+    }
+    if (isSyntheticShadowHost(this) && isDelegatingFocus(this)) {
+        hostElementFocus.call(this);
+        return;
+    }
+    // Typescript does not like it when you treat the `arguments` object as an array
+    // @ts-ignore type-mismatch
+    focus.apply(this, arguments);
+    // Restore state by enabling if originally enabled
+    if (originallyEnabled) {
+        enableKeyboardFocusNavigationRoutines();
+    }
 }
 // Non-deep-traversing patches: this descriptor map includes all descriptors that
 // do not five access to nodes beyond the immediate children.
 defineProperties(HTMLElement.prototype, {
-  tabIndex: {
-    get() {
-      if (isSyntheticShadowHost(this)) {
-        return tabIndexGetterPatched.call(this);
-      }
-      return tabIndexGetter.call(this);
-    },
-    set(v) {
-      if (isSyntheticShadowHost(this)) {
-        return tabIndexSetterPatched.call(this, v);
-      }
-      return tabIndexSetter.call(this, v);
+    tabIndex: {
+        get() {
+            if (isSyntheticShadowHost(this)) {
+                return tabIndexGetterPatched.call(this);
+            }
+            return tabIndexGetter.call(this);
+        },
+        set(v) {
+            if (isSyntheticShadowHost(this)) {
+                return tabIndexSetterPatched.call(this, v);
+            }
+            return tabIndexSetter.call(this, v);
+        },
+        enumerable: true,
+        configurable: true,
     },
-    enumerable: true,
-    configurable: true
-  },
-  blur: {
-    value() {
-      if (isSyntheticShadowHost(this)) {
-        return blurPatched.call(this);
-      }
-      blur.call(this);
+    blur: {
+        value() {
+            if (isSyntheticShadowHost(this)) {
+                return blurPatched.call(this);
+            }
+            blur.call(this);
+        },
+        enumerable: true,
+        writable: true,
+        configurable: true,
     },
-    enumerable: true,
-    writable: true,
-    configurable: true
-  },
-  focus: {
-    value() {
-      // Typescript does not like it when you treat the `arguments` object as an array
-      // @ts-ignore type-mismatch
-      focusPatched.apply(this, arguments);
+    focus: {
+        value() {
+            // Typescript does not like it when you treat the `arguments` object as an array
+            // @ts-ignore type-mismatch
+            focusPatched.apply(this, arguments);
+        },
+        enumerable: true,
+        writable: true,
+        configurable: true,
     },
-    enumerable: true,
-    writable: true,
-    configurable: true
-  }
 });
 // Note: In JSDOM innerText is not implemented: https://github.com/jsdom/jsdom/issues/1245
 if (innerTextGetter !== null && innerTextSetter !== null) {
-  defineProperty(HTMLElement.prototype, 'innerText', {
-    get() {
-      if (!lwcRuntimeFlags.ENABLE_INNER_OUTER_TEXT_PATCH) {
-        return innerTextGetter.call(this);
-      }
-      if (!lwcRuntimeFlags.ENABLE_ELEMENT_PATCH) {
-        if (isNodeShadowed(this) || isSyntheticShadowHost(this)) {
-          return getInnerText(this);
-        }
-        return innerTextGetter.call(this);
-      }
-      // TODO [#1222]: remove global bypass
-      if (isGlobalPatchingSkipped(this)) {
-        return innerTextGetter.call(this);
-      }
-      return getInnerText(this);
-    },
-    set(v) {
-      innerTextSetter.call(this, v);
-    },
-    enumerable: true,
-    configurable: true
-  });
+    defineProperty(HTMLElement.prototype, 'innerText', {
+        get() {
+            // Note: we deviate from native shadow here, but are not fixing
+            // due to backwards compat: https://github.com/salesforce/lwc/pull/3103
+            return innerTextGetter.call(this);
+        },
+        set(v) {
+            innerTextSetter.call(this, v);
+        },
+        enumerable: true,
+        configurable: true,
+    });
 }
 // Note: Firefox does not have outerText, https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/outerText
 if (outerTextGetter !== null && outerTextSetter !== null) {
-  // From https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/outerText :
-  // HTMLElement.outerText is a non-standard property. As a getter, it returns the same value as Node.innerText.
-  // As a setter, it removes the current node and replaces it with the given text.
-  defineProperty(HTMLElement.prototype, 'outerText', {
-    get() {
-      if (!lwcRuntimeFlags.ENABLE_INNER_OUTER_TEXT_PATCH) {
-        return outerTextGetter.call(this);
-      }
-      if (!lwcRuntimeFlags.ENABLE_ELEMENT_PATCH) {
-        if (isNodeShadowed(this) || isSyntheticShadowHost(this)) {
-          return getInnerText(this);
-        }
-        return outerTextGetter.call(this);
-      }
-      // TODO [#1222]: remove global bypass
-      if (isGlobalPatchingSkipped(this)) {
-        return outerTextGetter.call(this);
-      }
-      return getInnerText(this);
-    },
-    set(v) {
-      // Invoking the `outerText` setter on a host element should trigger its disconnection, but until we merge node reactions, it will not work.
-      // We could reimplement the outerText setter in JavaScript ([blink implementation](https://source.chromium.org/chromium/chromium/src/+/master:third_party/blink/renderer/core/html/html_element.cc;l=841-879;drc=6e8b402a6231405b753919029c9027404325ea00;bpv=0;bpt=1))
-      // but the benefits don't worth the efforts.
-      outerTextSetter.call(this, v);
-    },
-    enumerable: true,
-    configurable: true
-  });
+    // From https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/outerText :
+    // HTMLElement.outerText is a non-standard property. As a getter, it returns the same value as Node.innerText.
+    // As a setter, it removes the current node and replaces it with the given text.
+    defineProperty(HTMLElement.prototype, 'outerText', {
+        get() {
+            // Note: we deviate from native shadow here, but are not fixing
+            // due to backwards compat: https://github.com/salesforce/lwc/pull/3103
+            return outerTextGetter.call(this);
+        },
+        set(v) {
+            // Invoking the `outerText` setter on a host element should trigger its disconnection, but until we merge node reactions, it will not work.
+            // We could reimplement the outerText setter in JavaScript ([blink implementation](https://source.chromium.org/chromium/chromium/src/+/master:third_party/blink/renderer/core/html/html_element.cc;l=841-879;drc=6e8b402a6231405b753919029c9027404325ea00;bpv=0;bpt=1))
+            // but the benefits don't worth the efforts.
+            outerTextSetter.call(this, v);
+        },
+        enumerable: true,
+        configurable: true,
+    });
 }
 
 /*
@@ -4949,4 +4716,4 @@ if (process.env.NODE_ENV !== 'production' && typeof __karma__ !== 'undefined') {
     }));
   });
 }
-/** version: 2.32.0 */
+/** version: 2.32.1 */