@lwc/synthetic-shadow 2.32.0 → 2.33.0

Sign up to get free protection for your applications and to get access to all the features.
@@ -148,7 +148,7 @@ const KEY__SYNTHETIC_MODE = '$$lwc-synthetic-mode';
148
148
  // We use this to detect symbol support in order to avoid the expensive symbol polyfill. Note that
149
149
  // we can't use typeof since it will fail when transpiling.
150
150
  const hasNativeSymbolSupport = /*@__PURE__*/ (() => Symbol('x').toString() === 'Symbol(x)')();
151
- /** version: 2.32.0 */
151
+ /** version: 2.33.0 */
152
152
 
153
153
  /*
154
154
  * Copyright (c) 2018, salesforce.com, inc.
@@ -422,7 +422,8 @@ function getOwnerWindow(node) {
422
422
  return win;
423
423
  }
424
424
  let skipGlobalPatching;
425
- // TODO [#1222]: remove global bypass
425
+ // Note: we deviate from native shadow here, but are not fixing
426
+ // due to backwards compat: https://github.com/salesforce/lwc/pull/3103
426
427
  function isGlobalPatchingSkipped(node) {
427
428
  // we lazily compute this value instead of doing it during evaluation, this helps
428
429
  // for apps that are setting this after the engine code is evaluated.
@@ -462,7 +463,7 @@ if (!_globalThis.lwcRuntimeFlags) {
462
463
  Object.defineProperty(_globalThis, 'lwcRuntimeFlags', { value: create(null) });
463
464
  }
464
465
  const lwcRuntimeFlags = _globalThis.lwcRuntimeFlags;
465
- /** version: 2.32.0 */
466
+ /** version: 2.33.0 */
466
467
 
467
468
  /*
468
469
  * Copyright (c) 2018, salesforce.com, inc.
@@ -1156,119 +1157,125 @@ function createStaticHTMLCollection(items) {
1156
1157
  * because we don't want to patch the children getters for those elements.
1157
1158
  */
1158
1159
  function hasMountedChildren(node) {
1159
- return isSyntheticSlotElement(node) || isSyntheticShadowHost(node);
1160
+ return isSyntheticSlotElement(node) || isSyntheticShadowHost(node);
1160
1161
  }
1161
1162
  function getShadowParent(node, value) {
1162
- const owner = getNodeOwner(node);
1163
- if (value === owner) {
1164
- // walking up via parent chain might end up in the shadow root element
1165
- return getShadowRoot(owner);
1166
- } else if (value instanceof Element) {
1167
- if (getNodeNearestOwnerKey(node) === getNodeNearestOwnerKey(value)) {
1168
- // the element and its parent node belong to the same shadow root
1169
- return value;
1170
- } else if (!isNull(owner) && isSlotElement(value)) {
1171
- // slotted elements must be top level childNodes of the slot element
1172
- // where they slotted into, but its shadowed parent is always the
1173
- // owner of the slot.
1174
- const slotOwner = getNodeOwner(value);
1175
- if (!isNull(slotOwner) && isNodeOwnedBy(owner, slotOwner)) {
1176
- // it is a slotted element, and therefore its parent is always going to be the host of the slot
1177
- return slotOwner;
1178
- }
1163
+ const owner = getNodeOwner(node);
1164
+ if (value === owner) {
1165
+ // walking up via parent chain might end up in the shadow root element
1166
+ return getShadowRoot(owner);
1167
+ }
1168
+ else if (value instanceof Element) {
1169
+ if (getNodeNearestOwnerKey(node) === getNodeNearestOwnerKey(value)) {
1170
+ // the element and its parent node belong to the same shadow root
1171
+ return value;
1172
+ }
1173
+ else if (!isNull(owner) && isSlotElement(value)) {
1174
+ // slotted elements must be top level childNodes of the slot element
1175
+ // where they slotted into, but its shadowed parent is always the
1176
+ // owner of the slot.
1177
+ const slotOwner = getNodeOwner(value);
1178
+ if (!isNull(slotOwner) && isNodeOwnedBy(owner, slotOwner)) {
1179
+ // it is a slotted element, and therefore its parent is always going to be the host of the slot
1180
+ return slotOwner;
1181
+ }
1182
+ }
1179
1183
  }
1180
- }
1181
- return null;
1184
+ return null;
1182
1185
  }
1183
1186
  function hasChildNodesPatched() {
1184
- return getInternalChildNodes(this).length > 0;
1187
+ return getInternalChildNodes(this).length > 0;
1185
1188
  }
1186
1189
  function firstChildGetterPatched() {
1187
- const childNodes = getInternalChildNodes(this);
1188
- return childNodes[0] || null;
1190
+ const childNodes = getInternalChildNodes(this);
1191
+ return childNodes[0] || null;
1189
1192
  }
1190
1193
  function lastChildGetterPatched() {
1191
- const childNodes = getInternalChildNodes(this);
1192
- return childNodes[childNodes.length - 1] || null;
1194
+ const childNodes = getInternalChildNodes(this);
1195
+ return childNodes[childNodes.length - 1] || null;
1193
1196
  }
1194
1197
  function textContentGetterPatched() {
1195
- return getTextContent(this);
1198
+ return getTextContent(this);
1196
1199
  }
1197
1200
  function textContentSetterPatched(value) {
1198
- textContextSetter.call(this, value);
1201
+ textContextSetter.call(this, value);
1199
1202
  }
1200
1203
  function parentNodeGetterPatched() {
1201
- const value = parentNodeGetter.call(this);
1202
- if (isNull(value)) {
1203
- return value;
1204
- }
1205
- // TODO [#1635]: this needs optimization, maybe implementing it based on this.assignedSlot
1206
- return getShadowParent(this, value);
1204
+ const value = parentNodeGetter.call(this);
1205
+ if (isNull(value)) {
1206
+ return value;
1207
+ }
1208
+ // TODO [#1635]: this needs optimization, maybe implementing it based on this.assignedSlot
1209
+ return getShadowParent(this, value);
1207
1210
  }
1208
1211
  function parentElementGetterPatched() {
1209
- const value = parentNodeGetter.call(this);
1210
- if (isNull(value)) {
1211
- return null;
1212
- }
1213
- const parentNode = getShadowParent(this, value);
1214
- // it could be that the parentNode is the shadowRoot, in which case
1215
- // we need to return null.
1216
- // TODO [#1635]: this needs optimization, maybe implementing it based on this.assignedSlot
1217
- return parentNode instanceof Element ? parentNode : null;
1212
+ const value = parentNodeGetter.call(this);
1213
+ if (isNull(value)) {
1214
+ return null;
1215
+ }
1216
+ const parentNode = getShadowParent(this, value);
1217
+ // it could be that the parentNode is the shadowRoot, in which case
1218
+ // we need to return null.
1219
+ // TODO [#1635]: this needs optimization, maybe implementing it based on this.assignedSlot
1220
+ return parentNode instanceof Element ? parentNode : null;
1218
1221
  }
1219
1222
  function compareDocumentPositionPatched(otherNode) {
1220
- if (this === otherNode) {
1221
- return 0;
1222
- } else if (this.getRootNode() === otherNode) {
1223
- // "this" is in a shadow tree where the shadow root is the "otherNode".
1224
- return 10; // Node.DOCUMENT_POSITION_CONTAINS | Node.DOCUMENT_POSITION_PRECEDING
1225
- } else if (getNodeOwnerKey(this) !== getNodeOwnerKey(otherNode)) {
1226
- // "this" and "otherNode" belongs to 2 different shadow tree.
1227
- return 35; // Node.DOCUMENT_POSITION_DISCONNECTED | Node.DOCUMENT_POSITION_IMPLEMENTATION_SPECIFIC | Node.DOCUMENT_POSITION_PRECEDING
1228
- }
1229
- // Since "this" and "otherNode" are part of the same shadow tree we can safely rely to the native
1230
- // Node.compareDocumentPosition implementation.
1231
- return compareDocumentPosition.call(this, otherNode);
1223
+ if (this === otherNode) {
1224
+ return 0;
1225
+ }
1226
+ else if (this.getRootNode() === otherNode) {
1227
+ // "this" is in a shadow tree where the shadow root is the "otherNode".
1228
+ return 10; // Node.DOCUMENT_POSITION_CONTAINS | Node.DOCUMENT_POSITION_PRECEDING
1229
+ }
1230
+ else if (getNodeOwnerKey(this) !== getNodeOwnerKey(otherNode)) {
1231
+ // "this" and "otherNode" belongs to 2 different shadow tree.
1232
+ return 35; // Node.DOCUMENT_POSITION_DISCONNECTED | Node.DOCUMENT_POSITION_IMPLEMENTATION_SPECIFIC | Node.DOCUMENT_POSITION_PRECEDING
1233
+ }
1234
+ // Since "this" and "otherNode" are part of the same shadow tree we can safely rely to the native
1235
+ // Node.compareDocumentPosition implementation.
1236
+ return compareDocumentPosition.call(this, otherNode);
1232
1237
  }
1233
1238
  function containsPatched(otherNode) {
1234
- if (otherNode == null || getNodeOwnerKey(this) !== getNodeOwnerKey(otherNode)) {
1235
- // it is from another shadow
1236
- return false;
1237
- }
1238
- return (compareDocumentPosition.call(this, otherNode) & DOCUMENT_POSITION_CONTAINED_BY) !== 0;
1239
+ if (otherNode == null || getNodeOwnerKey(this) !== getNodeOwnerKey(otherNode)) {
1240
+ // it is from another shadow
1241
+ return false;
1242
+ }
1243
+ return (compareDocumentPosition.call(this, otherNode) & DOCUMENT_POSITION_CONTAINED_BY) !== 0;
1239
1244
  }
1240
1245
  function cloneNodePatched(deep) {
1241
- const clone = cloneNode.call(this, false);
1242
- // Per spec, browsers only care about truthy values
1243
- // Not strict true or false
1244
- if (!deep) {
1246
+ const clone = cloneNode.call(this, false);
1247
+ // Per spec, browsers only care about truthy values
1248
+ // Not strict true or false
1249
+ if (!deep) {
1250
+ return clone;
1251
+ }
1252
+ const childNodes = getInternalChildNodes(this);
1253
+ for (let i = 0, len = childNodes.length; i < len; i += 1) {
1254
+ clone.appendChild(childNodes[i].cloneNode(true));
1255
+ }
1245
1256
  return clone;
1246
- }
1247
- const childNodes = getInternalChildNodes(this);
1248
- for (let i = 0, len = childNodes.length; i < len; i += 1) {
1249
- clone.appendChild(childNodes[i].cloneNode(true));
1250
- }
1251
- return clone;
1252
1257
  }
1253
1258
  /**
1254
1259
  * This method only applies to elements with a shadow or slots
1255
1260
  */
1256
1261
  function childNodesGetterPatched() {
1257
- if (isSyntheticShadowHost(this)) {
1258
- const owner = getNodeOwner(this);
1259
- const childNodes = isNull(owner) ? [] : getAllMatches(owner, getFilteredChildNodes(this));
1260
- if (process.env.NODE_ENV !== 'production' && isFalse(hasNativeSymbolSupport) && isExternalChildNodeAccessorFlagOn()) {
1261
- // inserting a comment node as the first childNode to trick the IE11
1262
- // DevTool to show the content of the shadowRoot, this should only happen
1263
- // in dev-mode and in IE11 (which we detect by looking at the symbol).
1264
- // Plus it should only be in place if we know it is an external invoker.
1265
- ArrayUnshift.call(childNodes, getIE11FakeShadowRootPlaceholder(this));
1266
- }
1267
- return createStaticNodeList(childNodes);
1268
- }
1269
- // nothing to do here since this does not have a synthetic shadow attached to it
1270
- // TODO [#1636]: what about slot elements?
1271
- return childNodesGetter.call(this);
1262
+ if (isSyntheticShadowHost(this)) {
1263
+ const owner = getNodeOwner(this);
1264
+ const childNodes = isNull(owner) ? [] : getAllMatches(owner, getFilteredChildNodes(this));
1265
+ if (process.env.NODE_ENV !== 'production' &&
1266
+ isFalse(hasNativeSymbolSupport) &&
1267
+ isExternalChildNodeAccessorFlagOn()) {
1268
+ // inserting a comment node as the first childNode to trick the IE11
1269
+ // DevTool to show the content of the shadowRoot, this should only happen
1270
+ // in dev-mode and in IE11 (which we detect by looking at the symbol).
1271
+ // Plus it should only be in place if we know it is an external invoker.
1272
+ ArrayUnshift.call(childNodes, getIE11FakeShadowRootPlaceholder(this));
1273
+ }
1274
+ return createStaticNodeList(childNodes);
1275
+ }
1276
+ // nothing to do here since this does not have a synthetic shadow attached to it
1277
+ // TODO [#1636]: what about slot elements?
1278
+ return childNodesGetter.call(this);
1272
1279
  }
1273
1280
  const nativeGetRootNode = _Node.prototype.getRootNode;
1274
1281
  /**
@@ -1276,14 +1283,16 @@ const nativeGetRootNode = _Node.prototype.getRootNode;
1276
1283
  * If Node.prototype.getRootNode is supported, use it
1277
1284
  * else, assume we are working in non-native shadow mode and climb using parentNode
1278
1285
  */
1279
- const getDocumentOrRootNode = !isUndefined(nativeGetRootNode) ? nativeGetRootNode : function () {
1280
- let node = this;
1281
- let nodeParent;
1282
- while (!isNull(nodeParent = parentNodeGetter.call(node))) {
1283
- node = nodeParent;
1284
- }
1285
- return node;
1286
- };
1286
+ const getDocumentOrRootNode = !isUndefined(nativeGetRootNode)
1287
+ ? nativeGetRootNode
1288
+ : function () {
1289
+ let node = this;
1290
+ let nodeParent;
1291
+ while (!isNull((nodeParent = parentNodeGetter.call(node)))) {
1292
+ node = nodeParent;
1293
+ }
1294
+ return node;
1295
+ };
1287
1296
  /**
1288
1297
  * Get the shadow root
1289
1298
  * getNodeOwner() returns the host element that owns the given node
@@ -1294,12 +1303,12 @@ const getDocumentOrRootNode = !isUndefined(nativeGetRootNode) ? nativeGetRootNod
1294
1303
  * @param {Node} node
1295
1304
  */
1296
1305
  function getNearestRoot(node) {
1297
- const ownerNode = getNodeOwner(node);
1298
- if (isNull(ownerNode)) {
1299
- // we hit a wall, either we are in native shadow mode or the node is not in lwc boundary.
1300
- return getDocumentOrRootNode.call(node);
1301
- }
1302
- return getShadowRoot(ownerNode);
1306
+ const ownerNode = getNodeOwner(node);
1307
+ if (isNull(ownerNode)) {
1308
+ // we hit a wall, either we are in native shadow mode or the node is not in lwc boundary.
1309
+ return getDocumentOrRootNode.call(node);
1310
+ }
1311
+ return getShadowRoot(ownerNode);
1303
1312
  }
1304
1313
  /**
1305
1314
  * 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) {
1321
1330
  *
1322
1331
  **/
1323
1332
  function getRootNodePatched(options) {
1324
- const composed = isUndefined(options) ? false : !!options.composed;
1325
- return isTrue(composed) ? getDocumentOrRootNode.call(this, options) : getNearestRoot(this);
1333
+ const composed = isUndefined(options) ? false : !!options.composed;
1334
+ return isTrue(composed) ? getDocumentOrRootNode.call(this, options) : getNearestRoot(this);
1326
1335
  }
1327
1336
  // Non-deep-traversing patches: this descriptor map includes all descriptors that
1328
1337
  // do not give access to nodes beyond the immediate children.
1329
1338
  defineProperties(_Node.prototype, {
1330
- firstChild: {
1331
- get() {
1332
- if (hasMountedChildren(this)) {
1333
- return firstChildGetterPatched.call(this);
1334
- }
1335
- return firstChildGetter.call(this);
1339
+ firstChild: {
1340
+ get() {
1341
+ if (hasMountedChildren(this)) {
1342
+ return firstChildGetterPatched.call(this);
1343
+ }
1344
+ return firstChildGetter.call(this);
1345
+ },
1346
+ enumerable: true,
1347
+ configurable: true,
1336
1348
  },
1337
- enumerable: true,
1338
- configurable: true
1339
- },
1340
- lastChild: {
1341
- get() {
1342
- if (hasMountedChildren(this)) {
1343
- return lastChildGetterPatched.call(this);
1344
- }
1345
- return lastChildGetter.call(this);
1349
+ lastChild: {
1350
+ get() {
1351
+ if (hasMountedChildren(this)) {
1352
+ return lastChildGetterPatched.call(this);
1353
+ }
1354
+ return lastChildGetter.call(this);
1355
+ },
1356
+ enumerable: true,
1357
+ configurable: true,
1346
1358
  },
1347
- enumerable: true,
1348
- configurable: true
1349
- },
1350
- textContent: {
1351
- get() {
1352
- if (!lwcRuntimeFlags.ENABLE_NODE_PATCH) {
1353
- if (isNodeShadowed(this) || isSyntheticShadowHost(this)) {
1354
- return textContentGetterPatched.call(this);
1355
- }
1356
- return textContentGetter.call(this);
1357
- }
1358
- // TODO [#1222]: remove global bypass
1359
- if (isGlobalPatchingSkipped(this)) {
1360
- return textContentGetter.call(this);
1361
- }
1362
- return textContentGetterPatched.call(this);
1359
+ textContent: {
1360
+ get() {
1361
+ // Note: we deviate from native shadow here, but are not fixing
1362
+ // due to backwards compat: https://github.com/salesforce/lwc/pull/3103
1363
+ if (isNodeShadowed(this) || isSyntheticShadowHost(this)) {
1364
+ return textContentGetterPatched.call(this);
1365
+ }
1366
+ return textContentGetter.call(this);
1367
+ },
1368
+ set: textContentSetterPatched,
1369
+ enumerable: true,
1370
+ configurable: true,
1363
1371
  },
1364
- set: textContentSetterPatched,
1365
- enumerable: true,
1366
- configurable: true
1367
- },
1368
- parentNode: {
1369
- get() {
1370
- if (isNodeShadowed(this)) {
1371
- return parentNodeGetterPatched.call(this);
1372
- }
1373
- const parentNode = parentNodeGetter.call(this);
1374
- // Handle the case where a top level light DOM element is slotted into a synthetic
1375
- // shadow slot.
1376
- if (!isNull(parentNode) && isSyntheticSlotElement(parentNode)) {
1377
- return getNodeOwner(parentNode);
1378
- }
1379
- return parentNode;
1372
+ parentNode: {
1373
+ get() {
1374
+ if (isNodeShadowed(this)) {
1375
+ return parentNodeGetterPatched.call(this);
1376
+ }
1377
+ const parentNode = parentNodeGetter.call(this);
1378
+ // Handle the case where a top level light DOM element is slotted into a synthetic
1379
+ // shadow slot.
1380
+ if (!isNull(parentNode) && isSyntheticSlotElement(parentNode)) {
1381
+ return getNodeOwner(parentNode);
1382
+ }
1383
+ return parentNode;
1384
+ },
1385
+ enumerable: true,
1386
+ configurable: true,
1380
1387
  },
1381
- enumerable: true,
1382
- configurable: true
1383
- },
1384
- parentElement: {
1385
- get() {
1386
- if (isNodeShadowed(this)) {
1387
- return parentElementGetterPatched.call(this);
1388
- }
1389
- const parentElement = parentElementGetter.call(this);
1390
- // Handle the case where a top level light DOM element is slotted into a synthetic
1391
- // shadow slot.
1392
- if (!isNull(parentElement) && isSyntheticSlotElement(parentElement)) {
1393
- return getNodeOwner(parentElement);
1394
- }
1395
- return parentElement;
1388
+ parentElement: {
1389
+ get() {
1390
+ if (isNodeShadowed(this)) {
1391
+ return parentElementGetterPatched.call(this);
1392
+ }
1393
+ const parentElement = parentElementGetter.call(this);
1394
+ // Handle the case where a top level light DOM element is slotted into a synthetic
1395
+ // shadow slot.
1396
+ if (!isNull(parentElement) && isSyntheticSlotElement(parentElement)) {
1397
+ return getNodeOwner(parentElement);
1398
+ }
1399
+ return parentElement;
1400
+ },
1401
+ enumerable: true,
1402
+ configurable: true,
1396
1403
  },
1397
- enumerable: true,
1398
- configurable: true
1399
- },
1400
- childNodes: {
1401
- get() {
1402
- if (hasMountedChildren(this)) {
1403
- return childNodesGetterPatched.call(this);
1404
- }
1405
- return childNodesGetter.call(this);
1404
+ childNodes: {
1405
+ get() {
1406
+ if (hasMountedChildren(this)) {
1407
+ return childNodesGetterPatched.call(this);
1408
+ }
1409
+ return childNodesGetter.call(this);
1410
+ },
1411
+ enumerable: true,
1412
+ configurable: true,
1406
1413
  },
1407
- enumerable: true,
1408
- configurable: true
1409
- },
1410
- hasChildNodes: {
1411
- value() {
1412
- if (hasMountedChildren(this)) {
1413
- return hasChildNodesPatched.call(this);
1414
- }
1415
- return hasChildNodes.call(this);
1414
+ hasChildNodes: {
1415
+ value() {
1416
+ if (hasMountedChildren(this)) {
1417
+ return hasChildNodesPatched.call(this);
1418
+ }
1419
+ return hasChildNodes.call(this);
1420
+ },
1421
+ enumerable: true,
1422
+ writable: true,
1423
+ configurable: true,
1416
1424
  },
1417
- enumerable: true,
1418
- writable: true,
1419
- configurable: true
1420
- },
1421
- compareDocumentPosition: {
1422
- value(otherNode) {
1423
- // TODO [#1222]: remove global bypass
1424
- if (isGlobalPatchingSkipped(this)) {
1425
- return compareDocumentPosition.call(this, otherNode);
1426
- }
1427
- return compareDocumentPositionPatched.call(this, otherNode);
1425
+ compareDocumentPosition: {
1426
+ value(otherNode) {
1427
+ // Note: we deviate from native shadow here, but are not fixing
1428
+ // due to backwards compat: https://github.com/salesforce/lwc/pull/3103
1429
+ if (isGlobalPatchingSkipped(this)) {
1430
+ return compareDocumentPosition.call(this, otherNode);
1431
+ }
1432
+ return compareDocumentPositionPatched.call(this, otherNode);
1433
+ },
1434
+ enumerable: true,
1435
+ writable: true,
1436
+ configurable: true,
1428
1437
  },
1429
- enumerable: true,
1430
- writable: true,
1431
- configurable: true
1432
- },
1433
- contains: {
1434
- value(otherNode) {
1435
- // 1. Node.prototype.contains() returns true if otherNode is an inclusive descendant
1436
- // spec: https://dom.spec.whatwg.org/#dom-node-contains
1437
- // 2. This normalizes the behavior of this api across all browsers.
1438
- // In IE11, a disconnected dom element without children invoking contains() on self, returns false
1439
- if (this === otherNode) {
1440
- return true;
1441
- }
1442
- if (!lwcRuntimeFlags.ENABLE_NODE_PATCH) {
1443
- if (otherNode == null) {
1444
- return false;
1445
- }
1446
- if (isNodeShadowed(this) || isSyntheticShadowHost(this)) {
1447
- return containsPatched.call(this, otherNode);
1448
- }
1449
- return contains.call(this, otherNode);
1450
- }
1451
- // TODO [#1222]: remove global bypass
1452
- if (isGlobalPatchingSkipped(this)) {
1453
- return contains.call(this, otherNode);
1454
- }
1455
- return containsPatched.call(this, otherNode);
1438
+ contains: {
1439
+ value(otherNode) {
1440
+ // 1. Node.prototype.contains() returns true if otherNode is an inclusive descendant
1441
+ // spec: https://dom.spec.whatwg.org/#dom-node-contains
1442
+ // 2. This normalizes the behavior of this api across all browsers.
1443
+ // In IE11, a disconnected dom element without children invoking contains() on self, returns false
1444
+ if (this === otherNode) {
1445
+ return true;
1446
+ }
1447
+ // Note: we deviate from native shadow here, but are not fixing
1448
+ // due to backwards compat: https://github.com/salesforce/lwc/pull/3103
1449
+ if (otherNode == null) {
1450
+ return false;
1451
+ }
1452
+ if (isNodeShadowed(this) || isSyntheticShadowHost(this)) {
1453
+ return containsPatched.call(this, otherNode);
1454
+ }
1455
+ return contains.call(this, otherNode);
1456
+ },
1457
+ enumerable: true,
1458
+ writable: true,
1459
+ configurable: true,
1456
1460
  },
1457
- enumerable: true,
1458
- writable: true,
1459
- configurable: true
1460
- },
1461
- cloneNode: {
1462
- value(deep) {
1463
- if (!lwcRuntimeFlags.ENABLE_NODE_PATCH) {
1464
- if (isNodeShadowed(this) || isSyntheticShadowHost(this)) {
1465
- return cloneNodePatched.call(this, deep);
1466
- }
1467
- return cloneNode.call(this, deep);
1468
- }
1469
- if (isTrue(deep)) {
1470
- // TODO [#1222]: remove global bypass
1471
- if (isGlobalPatchingSkipped(this)) {
1472
- return cloneNode.call(this, deep);
1473
- }
1474
- return cloneNodePatched.call(this, deep);
1475
- }
1476
- return cloneNode.call(this, deep);
1461
+ cloneNode: {
1462
+ value(deep) {
1463
+ // Note: we deviate from native shadow here, but are not fixing
1464
+ // due to backwards compat: https://github.com/salesforce/lwc/pull/3103
1465
+ if (isNodeShadowed(this) || isSyntheticShadowHost(this)) {
1466
+ return cloneNodePatched.call(this, deep);
1467
+ }
1468
+ return cloneNode.call(this, deep);
1469
+ },
1470
+ enumerable: true,
1471
+ writable: true,
1472
+ configurable: true,
1473
+ },
1474
+ getRootNode: {
1475
+ value: getRootNodePatched,
1476
+ enumerable: true,
1477
+ configurable: true,
1478
+ writable: true,
1479
+ },
1480
+ isConnected: {
1481
+ enumerable: true,
1482
+ configurable: true,
1483
+ get() {
1484
+ return isConnected.call(this);
1485
+ },
1477
1486
  },
1478
- enumerable: true,
1479
- writable: true,
1480
- configurable: true
1481
- },
1482
- getRootNode: {
1483
- value: getRootNodePatched,
1484
- enumerable: true,
1485
- configurable: true,
1486
- writable: true
1487
- },
1488
- isConnected: {
1489
- enumerable: true,
1490
- configurable: true,
1491
- get() {
1492
- return isConnected.call(this);
1493
- }
1494
- }
1495
1487
  });
1496
1488
  let internalChildNodeAccessorFlag = false;
1497
1489
  /**
@@ -1501,35 +1493,38 @@ let internalChildNodeAccessorFlag = false;
1501
1493
  * case, the IE11 debugging comment for shadowRoot representation on the devtool.
1502
1494
  */
1503
1495
  function isExternalChildNodeAccessorFlagOn() {
1504
- return !internalChildNodeAccessorFlag;
1505
- }
1506
- const getInternalChildNodes = process.env.NODE_ENV !== 'production' && isFalse(hasNativeSymbolSupport) ? function (node) {
1507
- internalChildNodeAccessorFlag = true;
1508
- let childNodes;
1509
- let error = null;
1510
- try {
1511
- childNodes = node.childNodes;
1512
- } catch (e) {
1513
- // childNodes accessor should never throw, but just in case!
1514
- error = e;
1515
- } finally {
1516
- internalChildNodeAccessorFlag = false;
1517
- if (!isNull(error)) {
1518
- // re-throwing after restoring the state machinery for setInternalChildNodeAccessorFlag
1519
- throw error; // eslint-disable-line no-unsafe-finally
1496
+ return !internalChildNodeAccessorFlag;
1497
+ }
1498
+ const getInternalChildNodes = process.env.NODE_ENV !== 'production' && isFalse(hasNativeSymbolSupport)
1499
+ ? function (node) {
1500
+ internalChildNodeAccessorFlag = true;
1501
+ let childNodes;
1502
+ let error = null;
1503
+ try {
1504
+ childNodes = node.childNodes;
1505
+ }
1506
+ catch (e) {
1507
+ // childNodes accessor should never throw, but just in case!
1508
+ error = e;
1509
+ }
1510
+ finally {
1511
+ internalChildNodeAccessorFlag = false;
1512
+ if (!isNull(error)) {
1513
+ // re-throwing after restoring the state machinery for setInternalChildNodeAccessorFlag
1514
+ throw error; // eslint-disable-line no-unsafe-finally
1515
+ }
1516
+ }
1517
+ return childNodes;
1520
1518
  }
1521
- }
1522
-
1523
- return childNodes;
1524
- } : function (node) {
1525
- return node.childNodes;
1526
- };
1519
+ : function (node) {
1520
+ return node.childNodes;
1521
+ };
1527
1522
  // IE11 extra patches for wrong prototypes
1528
1523
  if (hasOwnProperty.call(HTMLElement.prototype, 'contains')) {
1529
- defineProperty(HTMLElement.prototype, 'contains', getOwnPropertyDescriptor(_Node.prototype, 'contains'));
1524
+ defineProperty(HTMLElement.prototype, 'contains', getOwnPropertyDescriptor(_Node.prototype, 'contains'));
1530
1525
  }
1531
1526
  if (hasOwnProperty.call(HTMLElement.prototype, 'parentElement')) {
1532
- defineProperty(HTMLElement.prototype, 'parentElement', getOwnPropertyDescriptor(_Node.prototype, 'parentElement'));
1527
+ defineProperty(HTMLElement.prototype, 'parentElement', getOwnPropertyDescriptor(_Node.prototype, 'parentElement'));
1533
1528
  }
1534
1529
 
1535
1530
  /*
@@ -2496,7 +2491,8 @@ defineProperty(Document.prototype, 'getElementById', {
2496
2491
  if (isNull(elm)) {
2497
2492
  return null;
2498
2493
  }
2499
- // TODO [#1222]: remove global bypass
2494
+ // Note: we deviate from native shadow here, but are not fixing
2495
+ // due to backwards compat: https://github.com/salesforce/lwc/pull/3103
2500
2496
  return isUndefined(getNodeOwnerKey(elm)) || isGlobalPatchingSkipped(elm) ? elm : null;
2501
2497
  },
2502
2498
  writable: true,
@@ -2507,7 +2503,8 @@ defineProperty(Document.prototype, 'querySelector', {
2507
2503
  value() {
2508
2504
  const elements = arrayFromCollection(querySelectorAll.apply(this, ArraySlice.call(arguments)));
2509
2505
  const filtered = ArrayFind.call(elements,
2510
- // TODO [#1222]: remove global bypass
2506
+ // Note: we deviate from native shadow here, but are not fixing
2507
+ // due to backwards compat: https://github.com/salesforce/lwc/pull/3103
2511
2508
  (elm) => isUndefined(getNodeOwnerKey(elm)) || isGlobalPatchingSkipped(elm));
2512
2509
  return !isUndefined(filtered) ? filtered : null;
2513
2510
  },
@@ -2519,7 +2516,8 @@ defineProperty(Document.prototype, 'querySelectorAll', {
2519
2516
  value() {
2520
2517
  const elements = arrayFromCollection(querySelectorAll.apply(this, ArraySlice.call(arguments)));
2521
2518
  const filtered = ArrayFilter.call(elements,
2522
- // TODO [#1222]: remove global bypass
2519
+ // Note: we deviate from native shadow here, but are not fixing
2520
+ // due to backwards compat: https://github.com/salesforce/lwc/pull/3103
2523
2521
  (elm) => isUndefined(getNodeOwnerKey(elm)) || isGlobalPatchingSkipped(elm));
2524
2522
  return createStaticNodeList(filtered);
2525
2523
  },
@@ -2531,7 +2529,8 @@ defineProperty(Document.prototype, 'getElementsByClassName', {
2531
2529
  value() {
2532
2530
  const elements = arrayFromCollection(getElementsByClassName.apply(this, ArraySlice.call(arguments)));
2533
2531
  const filtered = ArrayFilter.call(elements,
2534
- // TODO [#1222]: remove global bypass
2532
+ // Note: we deviate from native shadow here, but are not fixing
2533
+ // due to backwards compat: https://github.com/salesforce/lwc/pull/3103
2535
2534
  (elm) => isUndefined(getNodeOwnerKey(elm)) || isGlobalPatchingSkipped(elm));
2536
2535
  return createStaticHTMLCollection(filtered);
2537
2536
  },
@@ -2543,7 +2542,8 @@ defineProperty(Document.prototype, 'getElementsByTagName', {
2543
2542
  value() {
2544
2543
  const elements = arrayFromCollection(getElementsByTagName.apply(this, ArraySlice.call(arguments)));
2545
2544
  const filtered = ArrayFilter.call(elements,
2546
- // TODO [#1222]: remove global bypass
2545
+ // Note: we deviate from native shadow here, but are not fixing
2546
+ // due to backwards compat: https://github.com/salesforce/lwc/pull/3103
2547
2547
  (elm) => isUndefined(getNodeOwnerKey(elm)) || isGlobalPatchingSkipped(elm));
2548
2548
  return createStaticHTMLCollection(filtered);
2549
2549
  },
@@ -2555,7 +2555,8 @@ defineProperty(Document.prototype, 'getElementsByTagNameNS', {
2555
2555
  value() {
2556
2556
  const elements = arrayFromCollection(getElementsByTagNameNS.apply(this, ArraySlice.call(arguments)));
2557
2557
  const filtered = ArrayFilter.call(elements,
2558
- // TODO [#1222]: remove global bypass
2558
+ // Note: we deviate from native shadow here, but are not fixing
2559
+ // due to backwards compat: https://github.com/salesforce/lwc/pull/3103
2559
2560
  (elm) => isUndefined(getNodeOwnerKey(elm)) || isGlobalPatchingSkipped(elm));
2560
2561
  return createStaticHTMLCollection(filtered);
2561
2562
  },
@@ -2571,7 +2572,8 @@ getOwnPropertyDescriptor(HTMLDocument.prototype, 'getElementsByName')
2571
2572
  value() {
2572
2573
  const elements = arrayFromCollection(getElementsByName.apply(this, ArraySlice.call(arguments)));
2573
2574
  const filtered = ArrayFilter.call(elements,
2574
- // TODO [#1222]: remove global bypass
2575
+ // Note: we deviate from native shadow here, but are not fixing
2576
+ // due to backwards compat: https://github.com/salesforce/lwc/pull/3103
2575
2577
  (elm) => isUndefined(getNodeOwnerKey(elm)) || isGlobalPatchingSkipped(elm));
2576
2578
  return createStaticNodeList(filtered);
2577
2579
  },
@@ -3673,7 +3675,8 @@ function getNonPatchedFilteredArrayOfNodes(context, unfilteredNodes) {
3673
3675
  else if (context instanceof HTMLBodyElement) {
3674
3676
  // `context` is document.body which is already patched.
3675
3677
  filtered = ArrayFilter.call(unfilteredNodes,
3676
- // TODO [#1222]: remove global bypass
3678
+ // Note: we deviate from native shadow here, but are not fixing
3679
+ // due to backwards compat: https://github.com/salesforce/lwc/pull/3103
3677
3680
  (elm) => isUndefined(getNodeOwnerKey(elm)) || isGlobalPatchingSkipped(context));
3678
3681
  }
3679
3682
  else {
@@ -3690,247 +3693,233 @@ function getNonPatchedFilteredArrayOfNodes(context, unfilteredNodes) {
3690
3693
  * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
3691
3694
  */
3692
3695
  function innerHTMLGetterPatched() {
3693
- const childNodes = getInternalChildNodes(this);
3694
- let innerHTML = '';
3695
- for (let i = 0, len = childNodes.length; i < len; i += 1) {
3696
- innerHTML += getOuterHTML(childNodes[i]);
3697
- }
3698
- return innerHTML;
3696
+ const childNodes = getInternalChildNodes(this);
3697
+ let innerHTML = '';
3698
+ for (let i = 0, len = childNodes.length; i < len; i += 1) {
3699
+ innerHTML += getOuterHTML(childNodes[i]);
3700
+ }
3701
+ return innerHTML;
3699
3702
  }
3700
3703
  function outerHTMLGetterPatched() {
3701
- return getOuterHTML(this);
3704
+ return getOuterHTML(this);
3702
3705
  }
3703
3706
  function attachShadowPatched(options) {
3704
- // To retain native behavior of the API, provide synthetic shadowRoot only when specified
3705
- if (options[KEY__SYNTHETIC_MODE]) {
3706
- return attachShadow(this, options);
3707
- }
3708
- return attachShadow$1.call(this, options);
3707
+ // To retain native behavior of the API, provide synthetic shadowRoot only when specified
3708
+ if (options[KEY__SYNTHETIC_MODE]) {
3709
+ return attachShadow(this, options);
3710
+ }
3711
+ return attachShadow$1.call(this, options);
3709
3712
  }
3710
3713
  function shadowRootGetterPatched() {
3711
- if (isSyntheticShadowHost(this)) {
3712
- const shadow = getShadowRoot(this);
3713
- if (shadow.mode === 'open') {
3714
- return shadow;
3714
+ if (isSyntheticShadowHost(this)) {
3715
+ const shadow = getShadowRoot(this);
3716
+ if (shadow.mode === 'open') {
3717
+ return shadow;
3718
+ }
3715
3719
  }
3716
- }
3717
- return shadowRootGetter.call(this);
3720
+ return shadowRootGetter.call(this);
3718
3721
  }
3719
3722
  function childrenGetterPatched() {
3720
- const owner = getNodeOwner(this);
3721
- const childNodes = isNull(owner) ? [] : getAllMatches(owner, getFilteredChildNodes(this));
3722
- return createStaticHTMLCollection(ArrayFilter.call(childNodes, node => node instanceof Element));
3723
+ const owner = getNodeOwner(this);
3724
+ const childNodes = isNull(owner) ? [] : getAllMatches(owner, getFilteredChildNodes(this));
3725
+ return createStaticHTMLCollection(ArrayFilter.call(childNodes, (node) => node instanceof Element));
3723
3726
  }
3724
3727
  function childElementCountGetterPatched() {
3725
- return this.children.length;
3728
+ return this.children.length;
3726
3729
  }
3727
3730
  function firstElementChildGetterPatched() {
3728
- return this.children[0] || null;
3731
+ return this.children[0] || null;
3729
3732
  }
3730
3733
  function lastElementChildGetterPatched() {
3731
- const {
3732
- children
3733
- } = this;
3734
- return children.item(children.length - 1) || null;
3734
+ const { children } = this;
3735
+ return children.item(children.length - 1) || null;
3735
3736
  }
3736
3737
  // Non-deep-traversing patches: this descriptor map includes all descriptors that
3737
3738
  // do not five access to nodes beyond the immediate children.
3738
3739
  defineProperties(Element.prototype, {
3739
- innerHTML: {
3740
- get() {
3741
- if (!lwcRuntimeFlags.ENABLE_ELEMENT_PATCH) {
3742
- if (isNodeShadowed(this) || isSyntheticShadowHost(this)) {
3743
- return innerHTMLGetterPatched.call(this);
3744
- }
3745
- return innerHTMLGetter.call(this);
3746
- }
3747
- // TODO [#1222]: remove global bypass
3748
- if (isGlobalPatchingSkipped(this)) {
3749
- return innerHTMLGetter.call(this);
3750
- }
3751
- return innerHTMLGetterPatched.call(this);
3740
+ innerHTML: {
3741
+ get() {
3742
+ // Note: we deviate from native shadow here, but are not fixing
3743
+ // due to backwards compat: https://github.com/salesforce/lwc/pull/3103
3744
+ if (isNodeShadowed(this) || isSyntheticShadowHost(this)) {
3745
+ return innerHTMLGetterPatched.call(this);
3746
+ }
3747
+ return innerHTMLGetter.call(this);
3748
+ },
3749
+ set(v) {
3750
+ innerHTMLSetter.call(this, v);
3751
+ },
3752
+ enumerable: true,
3753
+ configurable: true,
3752
3754
  },
3753
- set(v) {
3754
- innerHTMLSetter.call(this, v);
3755
+ outerHTML: {
3756
+ get() {
3757
+ // Note: we deviate from native shadow here, but are not fixing
3758
+ // due to backwards compat: https://github.com/salesforce/lwc/pull/3103
3759
+ if (isNodeShadowed(this) || isSyntheticShadowHost(this)) {
3760
+ return outerHTMLGetterPatched.call(this);
3761
+ }
3762
+ return outerHTMLGetter.call(this);
3763
+ },
3764
+ set(v) {
3765
+ outerHTMLSetter.call(this, v);
3766
+ },
3767
+ enumerable: true,
3768
+ configurable: true,
3755
3769
  },
3756
- enumerable: true,
3757
- configurable: true
3758
- },
3759
- outerHTML: {
3760
- get() {
3761
- if (!lwcRuntimeFlags.ENABLE_ELEMENT_PATCH) {
3762
- if (isNodeShadowed(this) || isSyntheticShadowHost(this)) {
3763
- return outerHTMLGetterPatched.call(this);
3764
- }
3765
- return outerHTMLGetter.call(this);
3766
- }
3767
- // TODO [#1222]: remove global bypass
3768
- if (isGlobalPatchingSkipped(this)) {
3769
- return outerHTMLGetter.call(this);
3770
- }
3771
- return outerHTMLGetterPatched.call(this);
3770
+ attachShadow: {
3771
+ value: attachShadowPatched,
3772
+ enumerable: true,
3773
+ writable: true,
3774
+ configurable: true,
3772
3775
  },
3773
- set(v) {
3774
- outerHTMLSetter.call(this, v);
3776
+ shadowRoot: {
3777
+ get: shadowRootGetterPatched,
3778
+ enumerable: true,
3779
+ configurable: true,
3775
3780
  },
3776
- enumerable: true,
3777
- configurable: true
3778
- },
3779
- attachShadow: {
3780
- value: attachShadowPatched,
3781
- enumerable: true,
3782
- writable: true,
3783
- configurable: true
3784
- },
3785
- shadowRoot: {
3786
- get: shadowRootGetterPatched,
3787
- enumerable: true,
3788
- configurable: true
3789
- },
3790
- // patched in HTMLElement if exists (IE11 is the one off here)
3791
- children: {
3792
- get() {
3793
- if (hasMountedChildren(this)) {
3794
- return childrenGetterPatched.call(this);
3795
- }
3796
- return childrenGetter.call(this);
3781
+ // patched in HTMLElement if exists (IE11 is the one off here)
3782
+ children: {
3783
+ get() {
3784
+ if (hasMountedChildren(this)) {
3785
+ return childrenGetterPatched.call(this);
3786
+ }
3787
+ return childrenGetter.call(this);
3788
+ },
3789
+ enumerable: true,
3790
+ configurable: true,
3797
3791
  },
3798
- enumerable: true,
3799
- configurable: true
3800
- },
3801
- childElementCount: {
3802
- get() {
3803
- if (hasMountedChildren(this)) {
3804
- return childElementCountGetterPatched.call(this);
3805
- }
3806
- return childElementCountGetter.call(this);
3792
+ childElementCount: {
3793
+ get() {
3794
+ if (hasMountedChildren(this)) {
3795
+ return childElementCountGetterPatched.call(this);
3796
+ }
3797
+ return childElementCountGetter.call(this);
3798
+ },
3799
+ enumerable: true,
3800
+ configurable: true,
3807
3801
  },
3808
- enumerable: true,
3809
- configurable: true
3810
- },
3811
- firstElementChild: {
3812
- get() {
3813
- if (hasMountedChildren(this)) {
3814
- return firstElementChildGetterPatched.call(this);
3815
- }
3816
- return firstElementChildGetter.call(this);
3802
+ firstElementChild: {
3803
+ get() {
3804
+ if (hasMountedChildren(this)) {
3805
+ return firstElementChildGetterPatched.call(this);
3806
+ }
3807
+ return firstElementChildGetter.call(this);
3808
+ },
3809
+ enumerable: true,
3810
+ configurable: true,
3817
3811
  },
3818
- enumerable: true,
3819
- configurable: true
3820
- },
3821
- lastElementChild: {
3822
- get() {
3823
- if (hasMountedChildren(this)) {
3824
- return lastElementChildGetterPatched.call(this);
3825
- }
3826
- return lastElementChildGetter.call(this);
3812
+ lastElementChild: {
3813
+ get() {
3814
+ if (hasMountedChildren(this)) {
3815
+ return lastElementChildGetterPatched.call(this);
3816
+ }
3817
+ return lastElementChildGetter.call(this);
3818
+ },
3819
+ enumerable: true,
3820
+ configurable: true,
3821
+ },
3822
+ assignedSlot: {
3823
+ get: assignedSlotGetterPatched,
3824
+ enumerable: true,
3825
+ configurable: true,
3827
3826
  },
3828
- enumerable: true,
3829
- configurable: true
3830
- },
3831
- assignedSlot: {
3832
- get: assignedSlotGetterPatched,
3833
- enumerable: true,
3834
- configurable: true
3835
- }
3836
3827
  });
3837
3828
  // IE11 extra patches for wrong prototypes
3838
3829
  if (hasOwnProperty.call(HTMLElement.prototype, 'innerHTML')) {
3839
- defineProperty(HTMLElement.prototype, 'innerHTML', getOwnPropertyDescriptor(Element.prototype, 'innerHTML'));
3830
+ defineProperty(HTMLElement.prototype, 'innerHTML', getOwnPropertyDescriptor(Element.prototype, 'innerHTML'));
3840
3831
  }
3841
3832
  if (hasOwnProperty.call(HTMLElement.prototype, 'outerHTML')) {
3842
- defineProperty(HTMLElement.prototype, 'outerHTML', getOwnPropertyDescriptor(Element.prototype, 'outerHTML'));
3833
+ defineProperty(HTMLElement.prototype, 'outerHTML', getOwnPropertyDescriptor(Element.prototype, 'outerHTML'));
3843
3834
  }
3844
3835
  if (hasOwnProperty.call(HTMLElement.prototype, 'children')) {
3845
- defineProperty(HTMLElement.prototype, 'children', getOwnPropertyDescriptor(Element.prototype, 'children'));
3836
+ defineProperty(HTMLElement.prototype, 'children', getOwnPropertyDescriptor(Element.prototype, 'children'));
3846
3837
  }
3847
3838
  // Deep-traversing patches from this point on:
3848
3839
  function querySelectorPatched() {
3849
- const nodeList = arrayFromCollection(querySelectorAll$1.apply(this, ArraySlice.call(arguments)));
3850
- if (isSyntheticShadowHost(this)) {
3851
- // element with shadowRoot attached
3852
- const owner = getNodeOwner(this);
3853
- if (!isUndefined(getNodeKey(this))) {
3854
- // it is a custom element, and we should then filter by slotted elements
3855
- return getFirstSlottedMatch(this, nodeList);
3856
- } else if (isNull(owner)) {
3857
- return null;
3858
- } else {
3859
- // regular element, we should then filter by ownership
3860
- return getFirstMatch(owner, nodeList);
3840
+ const nodeList = arrayFromCollection(querySelectorAll$1.apply(this, ArraySlice.call(arguments)));
3841
+ if (isSyntheticShadowHost(this)) {
3842
+ // element with shadowRoot attached
3843
+ const owner = getNodeOwner(this);
3844
+ if (!isUndefined(getNodeKey(this))) {
3845
+ // it is a custom element, and we should then filter by slotted elements
3846
+ return getFirstSlottedMatch(this, nodeList);
3847
+ }
3848
+ else if (isNull(owner)) {
3849
+ return null;
3850
+ }
3851
+ else {
3852
+ // regular element, we should then filter by ownership
3853
+ return getFirstMatch(owner, nodeList);
3854
+ }
3861
3855
  }
3862
- } else if (isNodeShadowed(this)) {
3863
- // element inside a shadowRoot
3864
- const ownerKey = getNodeOwnerKey(this);
3865
- if (!isUndefined(ownerKey)) {
3866
- // `this` is handled by lwc, using getNodeNearestOwnerKey to include manually inserted elements in the same shadow.
3867
- const elm = ArrayFind.call(nodeList, elm => getNodeNearestOwnerKey(elm) === ownerKey);
3868
- return isUndefined(elm) ? null : elm;
3869
- } else {
3870
- if (!lwcRuntimeFlags.ENABLE_NODE_LIST_PATCH) {
3871
- // `this` is a manually inserted element inside a shadowRoot, return the first element.
3872
- return nodeList.length === 0 ? null : nodeList[0];
3873
- }
3874
- // Element is inside a shadow but we dont know which one. Use the
3875
- // "nearest" owner key to filter by ownership.
3876
- const contextNearestOwnerKey = getNodeNearestOwnerKey(this);
3877
- const elm = ArrayFind.call(nodeList, elm => getNodeNearestOwnerKey(elm) === contextNearestOwnerKey);
3878
- return isUndefined(elm) ? null : elm;
3856
+ else if (isNodeShadowed(this)) {
3857
+ // element inside a shadowRoot
3858
+ const ownerKey = getNodeOwnerKey(this);
3859
+ if (!isUndefined(ownerKey)) {
3860
+ // `this` is handled by lwc, using getNodeNearestOwnerKey to include manually inserted elements in the same shadow.
3861
+ const elm = ArrayFind.call(nodeList, (elm) => getNodeNearestOwnerKey(elm) === ownerKey);
3862
+ return isUndefined(elm) ? null : elm;
3863
+ }
3864
+ else {
3865
+ // Note: we deviate from native shadow here, but are not fixing
3866
+ // due to backwards compat: https://github.com/salesforce/lwc/pull/3103
3867
+ // `this` is a manually inserted element inside a shadowRoot, return the first element.
3868
+ return nodeList.length === 0 ? null : nodeList[0];
3869
+ }
3879
3870
  }
3880
- } else {
3881
- if (!lwcRuntimeFlags.ENABLE_NODE_LIST_PATCH) {
3882
- if (!(this instanceof HTMLBodyElement)) {
3883
- const elm = nodeList[0];
3871
+ else {
3872
+ if (!(this instanceof HTMLBodyElement)) {
3873
+ const elm = nodeList[0];
3874
+ return isUndefined(elm) ? null : elm;
3875
+ }
3876
+ // element belonging to the document
3877
+ const elm = ArrayFind.call(nodeList, (elm) => isUndefined(getNodeOwnerKey(elm)) || isGlobalPatchingSkipped(this));
3884
3878
  return isUndefined(elm) ? null : elm;
3885
- }
3886
3879
  }
3887
- // element belonging to the document
3888
- const elm = ArrayFind.call(nodeList,
3889
- // TODO [#1222]: remove global bypass
3890
- elm => isUndefined(getNodeOwnerKey(elm)) || isGlobalPatchingSkipped(this));
3891
- return isUndefined(elm) ? null : elm;
3892
- }
3893
3880
  }
3894
- function getFilteredArrayOfNodes(context, unfilteredNodes, shadowDomSemantic) {
3895
- let filtered;
3896
- if (isSyntheticShadowHost(context)) {
3897
- // element with shadowRoot attached
3898
- const owner = getNodeOwner(context);
3899
- if (!isUndefined(getNodeKey(context))) {
3900
- // it is a custom element, and we should then filter by slotted elements
3901
- filtered = getAllSlottedMatches(context, unfilteredNodes);
3902
- } else if (isNull(owner)) {
3903
- filtered = [];
3904
- } else {
3905
- // regular element, we should then filter by ownership
3906
- filtered = getAllMatches(owner, unfilteredNodes);
3881
+ function getFilteredArrayOfNodes(context, unfilteredNodes) {
3882
+ let filtered;
3883
+ if (isSyntheticShadowHost(context)) {
3884
+ // element with shadowRoot attached
3885
+ const owner = getNodeOwner(context);
3886
+ if (!isUndefined(getNodeKey(context))) {
3887
+ // it is a custom element, and we should then filter by slotted elements
3888
+ filtered = getAllSlottedMatches(context, unfilteredNodes);
3889
+ }
3890
+ else if (isNull(owner)) {
3891
+ filtered = [];
3892
+ }
3893
+ else {
3894
+ // regular element, we should then filter by ownership
3895
+ filtered = getAllMatches(owner, unfilteredNodes);
3896
+ }
3907
3897
  }
3908
- } else if (isNodeShadowed(context)) {
3909
- // element inside a shadowRoot
3910
- const ownerKey = getNodeOwnerKey(context);
3911
- if (!isUndefined(ownerKey)) {
3912
- // context is handled by lwc, using getNodeNearestOwnerKey to include manually inserted elements in the same shadow.
3913
- filtered = ArrayFilter.call(unfilteredNodes, elm => getNodeNearestOwnerKey(elm) === ownerKey);
3914
- } else if (shadowDomSemantic === 1 /* ShadowDomSemantic.Enabled */) {
3915
- // context is inside a shadow, we dont know which one.
3916
- const contextNearestOwnerKey = getNodeNearestOwnerKey(context);
3917
- filtered = ArrayFilter.call(unfilteredNodes, elm => getNodeNearestOwnerKey(elm) === contextNearestOwnerKey);
3918
- } else {
3919
- // context is manually inserted without lwc:dom-manual and ShadowDomSemantics is off, return everything
3920
- filtered = ArraySlice.call(unfilteredNodes);
3898
+ else if (isNodeShadowed(context)) {
3899
+ // element inside a shadowRoot
3900
+ const ownerKey = getNodeOwnerKey(context);
3901
+ if (!isUndefined(ownerKey)) {
3902
+ // context is handled by lwc, using getNodeNearestOwnerKey to include manually inserted elements in the same shadow.
3903
+ filtered = ArrayFilter.call(unfilteredNodes, (elm) => getNodeNearestOwnerKey(elm) === ownerKey);
3904
+ }
3905
+ else {
3906
+ // Note: we deviate from native shadow here, but are not fixing
3907
+ // due to backwards compat: https://github.com/salesforce/lwc/pull/3103
3908
+ // context is manually inserted without lwc:dom-manual, return everything
3909
+ filtered = ArraySlice.call(unfilteredNodes);
3910
+ }
3921
3911
  }
3922
- } else {
3923
- if (context instanceof HTMLBodyElement || shadowDomSemantic === 1 /* ShadowDomSemantic.Enabled */) {
3924
- // `context` is document.body or element belonging to the document with the patch enabled
3925
- filtered = ArrayFilter.call(unfilteredNodes,
3926
- // TODO [#1222]: remove global bypass
3927
- elm => isUndefined(getNodeOwnerKey(elm)) || isGlobalPatchingSkipped(context));
3928
- } else {
3929
- // `context` is outside the lwc boundary and patch is not enabled.
3930
- filtered = ArraySlice.call(unfilteredNodes);
3912
+ else {
3913
+ if (context instanceof HTMLBodyElement) {
3914
+ // `context` is document.body or element belonging to the document with the patch enabled
3915
+ filtered = ArrayFilter.call(unfilteredNodes, (elm) => isUndefined(getNodeOwnerKey(elm)) || isGlobalPatchingSkipped(context));
3916
+ }
3917
+ else {
3918
+ // `context` is outside the lwc boundary and patch is not enabled.
3919
+ filtered = ArraySlice.call(unfilteredNodes);
3920
+ }
3931
3921
  }
3932
- }
3933
- return filtered;
3922
+ return filtered;
3934
3923
  }
3935
3924
  // The following patched methods hide shadowed elements from global
3936
3925
  // traversing mechanisms. They are simplified for performance reasons to
@@ -3942,263 +3931,66 @@ function getFilteredArrayOfNodes(context, unfilteredNodes, shadowDomSemantic) {
3942
3931
  // is not a big problem considering the amount of code that is relying on
3943
3932
  // the liveliness of these results are rare.
3944
3933
  defineProperties(Element.prototype, {
3945
- querySelector: {
3946
- value: querySelectorPatched,
3947
- writable: true,
3948
- enumerable: true,
3949
- configurable: true
3950
- },
3951
- querySelectorAll: {
3952
- value() {
3953
- const nodeList = arrayFromCollection(querySelectorAll$1.apply(this, ArraySlice.call(arguments)));
3954
- if (!lwcRuntimeFlags.ENABLE_NODE_LIST_PATCH) {
3955
- const filteredResults = getFilteredArrayOfNodes(this, nodeList, 0 /* ShadowDomSemantic.Disabled */);
3956
- return createStaticNodeList(filteredResults);
3957
- }
3958
- return createStaticNodeList(getFilteredArrayOfNodes(this, nodeList, 1 /* ShadowDomSemantic.Enabled */));
3934
+ querySelector: {
3935
+ value: querySelectorPatched,
3936
+ writable: true,
3937
+ enumerable: true,
3938
+ configurable: true,
3939
+ },
3940
+ querySelectorAll: {
3941
+ value() {
3942
+ const nodeList = arrayFromCollection(querySelectorAll$1.apply(this, ArraySlice.call(arguments)));
3943
+ // Note: we deviate from native shadow here, but are not fixing
3944
+ // due to backwards compat: https://github.com/salesforce/lwc/pull/3103
3945
+ const filteredResults = getFilteredArrayOfNodes(this, nodeList);
3946
+ return createStaticNodeList(filteredResults);
3947
+ },
3948
+ writable: true,
3949
+ enumerable: true,
3950
+ configurable: true,
3959
3951
  },
3960
-
3961
- writable: true,
3962
- enumerable: true,
3963
- configurable: true
3964
- }
3965
3952
  });
3966
3953
  // The following APIs are used directly by Jest internally so we avoid patching them during testing.
3967
3954
  if (process.env.NODE_ENV !== 'test') {
3968
- defineProperties(Element.prototype, {
3969
- getElementsByClassName: {
3970
- value() {
3971
- const elements = arrayFromCollection(getElementsByClassName$1.apply(this, ArraySlice.call(arguments)));
3972
- if (!lwcRuntimeFlags.ENABLE_HTML_COLLECTIONS_PATCH) {
3973
- return createStaticHTMLCollection(getNonPatchedFilteredArrayOfNodes(this, elements));
3974
- }
3975
- const filteredResults = getFilteredArrayOfNodes(this, elements, 1 /* ShadowDomSemantic.Enabled */);
3976
- return createStaticHTMLCollection(filteredResults);
3977
- },
3978
- writable: true,
3979
- enumerable: true,
3980
- configurable: true
3981
- },
3982
- getElementsByTagName: {
3983
- value() {
3984
- const elements = arrayFromCollection(getElementsByTagName$1.apply(this, ArraySlice.call(arguments)));
3985
- if (!lwcRuntimeFlags.ENABLE_HTML_COLLECTIONS_PATCH) {
3986
- return createStaticHTMLCollection(getNonPatchedFilteredArrayOfNodes(this, elements));
3987
- }
3988
- const filteredResults = getFilteredArrayOfNodes(this, elements, 1 /* ShadowDomSemantic.Enabled */);
3989
- return createStaticHTMLCollection(filteredResults);
3990
- },
3991
- writable: true,
3992
- enumerable: true,
3993
- configurable: true
3994
- },
3995
- getElementsByTagNameNS: {
3996
- value() {
3997
- const elements = arrayFromCollection(getElementsByTagNameNS$1.apply(this, ArraySlice.call(arguments)));
3998
- if (!lwcRuntimeFlags.ENABLE_HTML_COLLECTIONS_PATCH) {
3999
- return createStaticHTMLCollection(getNonPatchedFilteredArrayOfNodes(this, elements));
4000
- }
4001
- const filteredResults = getFilteredArrayOfNodes(this, elements, 1 /* ShadowDomSemantic.Enabled */);
4002
- return createStaticHTMLCollection(filteredResults);
4003
- },
4004
- writable: true,
4005
- enumerable: true,
4006
- configurable: true
4007
- }
4008
- });
3955
+ defineProperties(Element.prototype, {
3956
+ getElementsByClassName: {
3957
+ value() {
3958
+ const elements = arrayFromCollection(getElementsByClassName$1.apply(this, ArraySlice.call(arguments)));
3959
+ // Note: we deviate from native shadow here, but are not fixing
3960
+ // due to backwards compat: https://github.com/salesforce/lwc/pull/3103
3961
+ return createStaticHTMLCollection(getNonPatchedFilteredArrayOfNodes(this, elements));
3962
+ },
3963
+ writable: true,
3964
+ enumerable: true,
3965
+ configurable: true,
3966
+ },
3967
+ getElementsByTagName: {
3968
+ value() {
3969
+ const elements = arrayFromCollection(getElementsByTagName$1.apply(this, ArraySlice.call(arguments)));
3970
+ // Note: we deviate from native shadow here, but are not fixing
3971
+ // due to backwards compat: https://github.com/salesforce/lwc/pull/3103
3972
+ return createStaticHTMLCollection(getNonPatchedFilteredArrayOfNodes(this, elements));
3973
+ },
3974
+ writable: true,
3975
+ enumerable: true,
3976
+ configurable: true,
3977
+ },
3978
+ getElementsByTagNameNS: {
3979
+ value() {
3980
+ const elements = arrayFromCollection(getElementsByTagNameNS$1.apply(this, ArraySlice.call(arguments)));
3981
+ // Note: we deviate from native shadow here, but are not fixing
3982
+ // due to backwards compat: https://github.com/salesforce/lwc/pull/3103
3983
+ return createStaticHTMLCollection(getNonPatchedFilteredArrayOfNodes(this, elements));
3984
+ },
3985
+ writable: true,
3986
+ enumerable: true,
3987
+ configurable: true,
3988
+ },
3989
+ });
4009
3990
  }
4010
3991
  // IE11 extra patches for wrong prototypes
4011
3992
  if (hasOwnProperty.call(HTMLElement.prototype, 'getElementsByClassName')) {
4012
- defineProperty(HTMLElement.prototype, 'getElementsByClassName', getOwnPropertyDescriptor(Element.prototype, 'getElementsByClassName'));
4013
- }
4014
-
4015
- /*
4016
- * Copyright (c) 2018, salesforce.com, inc.
4017
- * All rights reserved.
4018
- * SPDX-License-Identifier: MIT
4019
- * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
4020
- */
4021
- function getElementComputedStyle(element) {
4022
- const win = getOwnerWindow(element);
4023
- return windowGetComputedStyle.call(win, element);
4024
- }
4025
- function getWindowSelection(node) {
4026
- const win = getOwnerWindow(node);
4027
- return windowGetSelection.call(win);
4028
- }
4029
- function nodeIsBeingRendered(nodeComputedStyle) {
4030
- return nodeComputedStyle.visibility === 'visible' && nodeComputedStyle.display !== 'none';
4031
- }
4032
- function getSelectionState(element) {
4033
- const win = getOwnerWindow(element);
4034
- const selection = getWindowSelection(element);
4035
- if (selection === null) {
4036
- return null;
4037
- }
4038
- const ranges = [];
4039
- for (let i = 0; i < selection.rangeCount; i++) {
4040
- ranges.push(selection.getRangeAt(i));
4041
- }
4042
- const state = {
4043
- element,
4044
- onselect: win.onselect,
4045
- onselectstart: win.onselectstart,
4046
- onselectionchange: win.onselectionchange,
4047
- ranges,
4048
- };
4049
- win.onselect = null;
4050
- win.onselectstart = null;
4051
- win.onselectionchange = null;
4052
- return state;
4053
- }
4054
- function restoreSelectionState(state) {
4055
- if (state === null) {
4056
- return;
4057
- }
4058
- const { element, onselect, onselectstart, onselectionchange, ranges } = state;
4059
- const win = getOwnerWindow(element);
4060
- const selection = getWindowSelection(element);
4061
- selection.removeAllRanges();
4062
- for (let i = 0; i < ranges.length; i++) {
4063
- selection.addRange(ranges[i]);
4064
- }
4065
- win.onselect = onselect;
4066
- win.onselectstart = onselectstart;
4067
- win.onselectionchange = onselectionchange;
4068
- }
4069
- /**
4070
- * Gets the "innerText" of a text node using the Selection API
4071
- *
4072
- * NOTE: For performance reasons, since this function will be called multiple times while calculating the innerText of
4073
- * an element, it does not restore the current selection.
4074
- */
4075
- function getTextNodeInnerText(textNode) {
4076
- const selection = getWindowSelection(textNode);
4077
- if (selection === null) {
4078
- return textNode.textContent || '';
4079
- }
4080
- const range = document.createRange();
4081
- range.selectNodeContents(textNode);
4082
- const domRect = range.getBoundingClientRect();
4083
- if (domRect.height <= 0 || domRect.width <= 0) {
4084
- // the text node is not rendered
4085
- return '';
4086
- }
4087
- // Needed to remove non rendered characters from the text node.
4088
- selection.removeAllRanges();
4089
- selection.addRange(range);
4090
- const selectionText = selection.toString();
4091
- // The textNode is visible, but it may not be selectable. When the text is not selectable,
4092
- // textContent is the nearest approximation to innerText.
4093
- return selectionText ? selectionText : textNode.textContent || '';
4094
- }
4095
- const nodeIsElement = (node) => node.nodeType === ELEMENT_NODE;
4096
- const nodeIsText = (node) => node.nodeType === TEXT_NODE;
4097
- /**
4098
- * Spec: https://html.spec.whatwg.org/multipage/dom.html#inner-text-collection-steps
4099
- * One spec implementation: https://github.com/servo/servo/blob/721271dcd3c20db5ca8cf146e2b5907647afb4d6/components/layout/query.rs#L1132
4100
- */
4101
- function innerTextCollectionSteps(node) {
4102
- const items = [];
4103
- if (nodeIsElement(node)) {
4104
- const { tagName } = node;
4105
- const computedStyle = getElementComputedStyle(node);
4106
- if (tagName === 'OPTION') {
4107
- // For options, is hard to get the "rendered" text, let's use the original getter.
4108
- return [1, innerTextGetter.call(node), 1];
4109
- }
4110
- else if (tagName === 'TEXTAREA') {
4111
- return [];
4112
- }
4113
- else {
4114
- const childNodes = node.childNodes;
4115
- for (let i = 0, n = childNodes.length; i < n; i++) {
4116
- ArrayPush.apply(items, innerTextCollectionSteps(childNodes[i]));
4117
- }
4118
- }
4119
- if (!nodeIsBeingRendered(computedStyle)) {
4120
- if (tagName === 'SELECT' || tagName === 'DATALIST') {
4121
- // the select is either: .visibility != 'visible' or .display === hidden, therefore this select should
4122
- // not display any value.
4123
- return [];
4124
- }
4125
- return items;
4126
- }
4127
- if (tagName === 'BR') {
4128
- items.push('\u{000A}' /* line feed */);
4129
- }
4130
- const { display } = computedStyle;
4131
- if (display === 'table-cell') {
4132
- // omitting case: and node's CSS box is not the last 'table-cell' box of its enclosing 'table-row' box
4133
- items.push('\u{0009}' /* tab */);
4134
- }
4135
- if (display === 'table-row') {
4136
- // omitting case: and node's CSS box is not the last 'table-row' box of the nearest ancestor 'table' box
4137
- items.push('\u{000A}' /* line feed */);
4138
- }
4139
- if (tagName === 'P') {
4140
- items.unshift(2);
4141
- items.push(2);
4142
- }
4143
- if (display === 'block' ||
4144
- display === 'table-caption' ||
4145
- display === 'flex' ||
4146
- display === 'table') {
4147
- items.unshift(1);
4148
- items.push(1);
4149
- }
4150
- }
4151
- else if (nodeIsText(node)) {
4152
- items.push(getTextNodeInnerText(node));
4153
- }
4154
- return items;
4155
- }
4156
- /**
4157
- * InnerText getter spec: https://html.spec.whatwg.org/multipage/dom.html#the-innertext-idl-attribute
4158
- *
4159
- * One spec implementation: https://github.com/servo/servo/blob/721271dcd3c20db5ca8cf146e2b5907647afb4d6/components/layout/query.rs#L1087
4160
- */
4161
- function getInnerText(element) {
4162
- const thisComputedStyle = getElementComputedStyle(element);
4163
- if (!nodeIsBeingRendered(thisComputedStyle)) {
4164
- return getTextContent(element) || '';
4165
- }
4166
- const selectionState = getSelectionState(element);
4167
- const results = [];
4168
- const childNodes = element.childNodes;
4169
- for (let i = 0, n = childNodes.length; i < n; i++) {
4170
- ArrayPush.apply(results, innerTextCollectionSteps(childNodes[i]));
4171
- }
4172
- restoreSelectionState(selectionState);
4173
- let elementInnerText = '';
4174
- let maxReqLineBreakCount = 0;
4175
- for (let i = 0, n = results.length; i < n; i++) {
4176
- const item = results[i];
4177
- if (typeof item === 'string') {
4178
- if (maxReqLineBreakCount > 0) {
4179
- for (let j = 0; j < maxReqLineBreakCount; j++) {
4180
- elementInnerText += '\u{000A}';
4181
- }
4182
- maxReqLineBreakCount = 0;
4183
- }
4184
- if (item.length > 0) {
4185
- elementInnerText += item;
4186
- }
4187
- }
4188
- else {
4189
- if (elementInnerText.length == 0) {
4190
- // Remove required line break count at the start.
4191
- continue;
4192
- }
4193
- // Store the count if it's the max of this run,
4194
- // but it may be ignored if no text item is found afterwards,
4195
- // which means that these are consecutive line breaks at the end.
4196
- if (item > maxReqLineBreakCount) {
4197
- maxReqLineBreakCount = item;
4198
- }
4199
- }
4200
- }
4201
- return elementInnerText;
3993
+ defineProperty(HTMLElement.prototype, 'getElementsByClassName', getOwnPropertyDescriptor(Element.prototype, 'getElementsByClassName'));
4202
3994
  }
4203
3995
 
4204
3996
  /*
@@ -4548,209 +4340,184 @@ function ignoreFocusIn(elm) {
4548
4340
  * SPDX-License-Identifier: MIT
4549
4341
  * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
4550
4342
  */
4551
- const {
4552
- blur,
4553
- focus
4554
- } = HTMLElement.prototype;
4343
+ const { blur, focus } = HTMLElement.prototype;
4555
4344
  /**
4556
4345
  * This method only applies to elements with a shadow attached to them
4557
4346
  */
4558
4347
  function tabIndexGetterPatched() {
4559
- if (isDelegatingFocus(this) && isFalse(hasAttribute.call(this, 'tabindex'))) {
4560
- // this covers the case where the default tabindex should be 0 because the
4561
- // custom element is delegating its focus
4562
- return 0;
4563
- }
4564
- return tabIndexGetter.call(this);
4348
+ if (isDelegatingFocus(this) && isFalse(hasAttribute.call(this, 'tabindex'))) {
4349
+ // this covers the case where the default tabindex should be 0 because the
4350
+ // custom element is delegating its focus
4351
+ return 0;
4352
+ }
4353
+ return tabIndexGetter.call(this);
4565
4354
  }
4566
4355
  /**
4567
4356
  * This method only applies to elements with a shadow attached to them
4568
4357
  */
4569
4358
  function tabIndexSetterPatched(value) {
4570
- // This tabIndex setter might be confusing unless it is understood that HTML
4571
- // elements have default tabIndex property values. Natively focusable elements have
4572
- // a default tabIndex value of 0 and all other elements have a default tabIndex
4573
- // value of -1. For example, the tabIndex property value is -1 for both <x-foo> and
4574
- // <x-foo tabindex="-1">, but our delegatesFocus polyfill should only kick in for
4575
- // the latter case when the value of the tabindex attribute is -1.
4576
- const delegatesFocus = isDelegatingFocus(this);
4577
- // Record the state of things before invoking component setter.
4578
- const prevValue = tabIndexGetter.call(this);
4579
- const prevHasAttr = hasAttribute.call(this, 'tabindex');
4580
- tabIndexSetter.call(this, value);
4581
- // Record the state of things after invoking component setter.
4582
- const currValue = tabIndexGetter.call(this);
4583
- const currHasAttr = hasAttribute.call(this, 'tabindex');
4584
- const didValueChange = prevValue !== currValue;
4585
- // If the tabindex attribute is initially rendered, we can assume that this setter has
4586
- // previously executed and a listener has been added. We must remove that listener if
4587
- // the tabIndex property value has changed or if the component no longer renders a
4588
- // tabindex attribute.
4589
- if (prevHasAttr && (didValueChange || isFalse(currHasAttr))) {
4590
- if (prevValue === -1) {
4591
- ignoreFocusIn(this);
4592
- }
4593
- if (prevValue === 0 && delegatesFocus) {
4594
- ignoreFocus(this);
4359
+ // This tabIndex setter might be confusing unless it is understood that HTML
4360
+ // elements have default tabIndex property values. Natively focusable elements have
4361
+ // a default tabIndex value of 0 and all other elements have a default tabIndex
4362
+ // value of -1. For example, the tabIndex property value is -1 for both <x-foo> and
4363
+ // <x-foo tabindex="-1">, but our delegatesFocus polyfill should only kick in for
4364
+ // the latter case when the value of the tabindex attribute is -1.
4365
+ const delegatesFocus = isDelegatingFocus(this);
4366
+ // Record the state of things before invoking component setter.
4367
+ const prevValue = tabIndexGetter.call(this);
4368
+ const prevHasAttr = hasAttribute.call(this, 'tabindex');
4369
+ tabIndexSetter.call(this, value);
4370
+ // Record the state of things after invoking component setter.
4371
+ const currValue = tabIndexGetter.call(this);
4372
+ const currHasAttr = hasAttribute.call(this, 'tabindex');
4373
+ const didValueChange = prevValue !== currValue;
4374
+ // If the tabindex attribute is initially rendered, we can assume that this setter has
4375
+ // previously executed and a listener has been added. We must remove that listener if
4376
+ // the tabIndex property value has changed or if the component no longer renders a
4377
+ // tabindex attribute.
4378
+ if (prevHasAttr && (didValueChange || isFalse(currHasAttr))) {
4379
+ if (prevValue === -1) {
4380
+ ignoreFocusIn(this);
4381
+ }
4382
+ if (prevValue === 0 && delegatesFocus) {
4383
+ ignoreFocus(this);
4384
+ }
4385
+ }
4386
+ // If a tabindex attribute was not rendered after invoking its setter, it means the
4387
+ // component is taking control. Do nothing.
4388
+ if (isFalse(currHasAttr)) {
4389
+ return;
4390
+ }
4391
+ // If the tabindex attribute is initially rendered, we can assume that this setter has
4392
+ // previously executed and a listener has been added. If the tabindex attribute is still
4393
+ // rendered after invoking the setter AND the tabIndex property value has not changed,
4394
+ // we don't need to do any work.
4395
+ if (prevHasAttr && currHasAttr && isFalse(didValueChange)) {
4396
+ return;
4397
+ }
4398
+ // At this point we know that a tabindex attribute was rendered after invoking the
4399
+ // setter and that either:
4400
+ // 1) This is the first time this setter is being invoked.
4401
+ // 2) This is not the first time this setter is being invoked and the value is changing.
4402
+ // We need to add the appropriate listeners in either case.
4403
+ if (currValue === -1) {
4404
+ // Add the magic to skip the shadow tree
4405
+ handleFocusIn(this);
4406
+ }
4407
+ if (currValue === 0 && delegatesFocus) {
4408
+ // Add the magic to skip the host element
4409
+ handleFocus(this);
4595
4410
  }
4596
- }
4597
- // If a tabindex attribute was not rendered after invoking its setter, it means the
4598
- // component is taking control. Do nothing.
4599
- if (isFalse(currHasAttr)) {
4600
- return;
4601
- }
4602
- // If the tabindex attribute is initially rendered, we can assume that this setter has
4603
- // previously executed and a listener has been added. If the tabindex attribute is still
4604
- // rendered after invoking the setter AND the tabIndex property value has not changed,
4605
- // we don't need to do any work.
4606
- if (prevHasAttr && currHasAttr && isFalse(didValueChange)) {
4607
- return;
4608
- }
4609
- // At this point we know that a tabindex attribute was rendered after invoking the
4610
- // setter and that either:
4611
- // 1) This is the first time this setter is being invoked.
4612
- // 2) This is not the first time this setter is being invoked and the value is changing.
4613
- // We need to add the appropriate listeners in either case.
4614
- if (currValue === -1) {
4615
- // Add the magic to skip the shadow tree
4616
- handleFocusIn(this);
4617
- }
4618
- if (currValue === 0 && delegatesFocus) {
4619
- // Add the magic to skip the host element
4620
- handleFocus(this);
4621
- }
4622
4411
  }
4623
4412
  /**
4624
4413
  * This method only applies to elements with a shadow attached to them
4625
4414
  */
4626
4415
  function blurPatched() {
4627
- if (isDelegatingFocus(this)) {
4628
- const currentActiveElement = getActiveElement(this);
4629
- if (!isNull(currentActiveElement)) {
4630
- // if there is an active element, blur it (intentionally using the dot notation in case the user defines the blur routine)
4631
- currentActiveElement.blur();
4632
- return;
4416
+ if (isDelegatingFocus(this)) {
4417
+ const currentActiveElement = getActiveElement(this);
4418
+ if (!isNull(currentActiveElement)) {
4419
+ // if there is an active element, blur it (intentionally using the dot notation in case the user defines the blur routine)
4420
+ currentActiveElement.blur();
4421
+ return;
4422
+ }
4633
4423
  }
4634
- }
4635
- return blur.call(this);
4424
+ return blur.call(this);
4636
4425
  }
4637
4426
  function focusPatched() {
4638
- // Save enabled state
4639
- const originallyEnabled = isKeyboardFocusNavigationRoutineEnabled();
4640
- // Change state by disabling if originally enabled
4641
- if (originallyEnabled) {
4642
- disableKeyboardFocusNavigationRoutines();
4643
- }
4644
- if (isSyntheticShadowHost(this) && isDelegatingFocus(this)) {
4645
- hostElementFocus.call(this);
4646
- return;
4647
- }
4648
- // Typescript does not like it when you treat the `arguments` object as an array
4649
- // @ts-ignore type-mismatch
4650
- focus.apply(this, arguments);
4651
- // Restore state by enabling if originally enabled
4652
- if (originallyEnabled) {
4653
- enableKeyboardFocusNavigationRoutines();
4654
- }
4427
+ // Save enabled state
4428
+ const originallyEnabled = isKeyboardFocusNavigationRoutineEnabled();
4429
+ // Change state by disabling if originally enabled
4430
+ if (originallyEnabled) {
4431
+ disableKeyboardFocusNavigationRoutines();
4432
+ }
4433
+ if (isSyntheticShadowHost(this) && isDelegatingFocus(this)) {
4434
+ hostElementFocus.call(this);
4435
+ return;
4436
+ }
4437
+ // Typescript does not like it when you treat the `arguments` object as an array
4438
+ // @ts-ignore type-mismatch
4439
+ focus.apply(this, arguments);
4440
+ // Restore state by enabling if originally enabled
4441
+ if (originallyEnabled) {
4442
+ enableKeyboardFocusNavigationRoutines();
4443
+ }
4655
4444
  }
4656
4445
  // Non-deep-traversing patches: this descriptor map includes all descriptors that
4657
4446
  // do not five access to nodes beyond the immediate children.
4658
4447
  defineProperties(HTMLElement.prototype, {
4659
- tabIndex: {
4660
- get() {
4661
- if (isSyntheticShadowHost(this)) {
4662
- return tabIndexGetterPatched.call(this);
4663
- }
4664
- return tabIndexGetter.call(this);
4665
- },
4666
- set(v) {
4667
- if (isSyntheticShadowHost(this)) {
4668
- return tabIndexSetterPatched.call(this, v);
4669
- }
4670
- return tabIndexSetter.call(this, v);
4448
+ tabIndex: {
4449
+ get() {
4450
+ if (isSyntheticShadowHost(this)) {
4451
+ return tabIndexGetterPatched.call(this);
4452
+ }
4453
+ return tabIndexGetter.call(this);
4454
+ },
4455
+ set(v) {
4456
+ if (isSyntheticShadowHost(this)) {
4457
+ return tabIndexSetterPatched.call(this, v);
4458
+ }
4459
+ return tabIndexSetter.call(this, v);
4460
+ },
4461
+ enumerable: true,
4462
+ configurable: true,
4671
4463
  },
4672
- enumerable: true,
4673
- configurable: true
4674
- },
4675
- blur: {
4676
- value() {
4677
- if (isSyntheticShadowHost(this)) {
4678
- return blurPatched.call(this);
4679
- }
4680
- blur.call(this);
4464
+ blur: {
4465
+ value() {
4466
+ if (isSyntheticShadowHost(this)) {
4467
+ return blurPatched.call(this);
4468
+ }
4469
+ blur.call(this);
4470
+ },
4471
+ enumerable: true,
4472
+ writable: true,
4473
+ configurable: true,
4681
4474
  },
4682
- enumerable: true,
4683
- writable: true,
4684
- configurable: true
4685
- },
4686
- focus: {
4687
- value() {
4688
- // Typescript does not like it when you treat the `arguments` object as an array
4689
- // @ts-ignore type-mismatch
4690
- focusPatched.apply(this, arguments);
4475
+ focus: {
4476
+ value() {
4477
+ // Typescript does not like it when you treat the `arguments` object as an array
4478
+ // @ts-ignore type-mismatch
4479
+ focusPatched.apply(this, arguments);
4480
+ },
4481
+ enumerable: true,
4482
+ writable: true,
4483
+ configurable: true,
4691
4484
  },
4692
- enumerable: true,
4693
- writable: true,
4694
- configurable: true
4695
- }
4696
4485
  });
4697
4486
  // Note: In JSDOM innerText is not implemented: https://github.com/jsdom/jsdom/issues/1245
4698
4487
  if (innerTextGetter !== null && innerTextSetter !== null) {
4699
- defineProperty(HTMLElement.prototype, 'innerText', {
4700
- get() {
4701
- if (!lwcRuntimeFlags.ENABLE_INNER_OUTER_TEXT_PATCH) {
4702
- return innerTextGetter.call(this);
4703
- }
4704
- if (!lwcRuntimeFlags.ENABLE_ELEMENT_PATCH) {
4705
- if (isNodeShadowed(this) || isSyntheticShadowHost(this)) {
4706
- return getInnerText(this);
4707
- }
4708
- return innerTextGetter.call(this);
4709
- }
4710
- // TODO [#1222]: remove global bypass
4711
- if (isGlobalPatchingSkipped(this)) {
4712
- return innerTextGetter.call(this);
4713
- }
4714
- return getInnerText(this);
4715
- },
4716
- set(v) {
4717
- innerTextSetter.call(this, v);
4718
- },
4719
- enumerable: true,
4720
- configurable: true
4721
- });
4488
+ defineProperty(HTMLElement.prototype, 'innerText', {
4489
+ get() {
4490
+ // Note: we deviate from native shadow here, but are not fixing
4491
+ // due to backwards compat: https://github.com/salesforce/lwc/pull/3103
4492
+ return innerTextGetter.call(this);
4493
+ },
4494
+ set(v) {
4495
+ innerTextSetter.call(this, v);
4496
+ },
4497
+ enumerable: true,
4498
+ configurable: true,
4499
+ });
4722
4500
  }
4723
4501
  // Note: Firefox does not have outerText, https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/outerText
4724
4502
  if (outerTextGetter !== null && outerTextSetter !== null) {
4725
- // From https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/outerText :
4726
- // HTMLElement.outerText is a non-standard property. As a getter, it returns the same value as Node.innerText.
4727
- // As a setter, it removes the current node and replaces it with the given text.
4728
- defineProperty(HTMLElement.prototype, 'outerText', {
4729
- get() {
4730
- if (!lwcRuntimeFlags.ENABLE_INNER_OUTER_TEXT_PATCH) {
4731
- return outerTextGetter.call(this);
4732
- }
4733
- if (!lwcRuntimeFlags.ENABLE_ELEMENT_PATCH) {
4734
- if (isNodeShadowed(this) || isSyntheticShadowHost(this)) {
4735
- return getInnerText(this);
4736
- }
4737
- return outerTextGetter.call(this);
4738
- }
4739
- // TODO [#1222]: remove global bypass
4740
- if (isGlobalPatchingSkipped(this)) {
4741
- return outerTextGetter.call(this);
4742
- }
4743
- return getInnerText(this);
4744
- },
4745
- set(v) {
4746
- // Invoking the `outerText` setter on a host element should trigger its disconnection, but until we merge node reactions, it will not work.
4747
- // 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))
4748
- // but the benefits don't worth the efforts.
4749
- outerTextSetter.call(this, v);
4750
- },
4751
- enumerable: true,
4752
- configurable: true
4753
- });
4503
+ // From https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/outerText :
4504
+ // HTMLElement.outerText is a non-standard property. As a getter, it returns the same value as Node.innerText.
4505
+ // As a setter, it removes the current node and replaces it with the given text.
4506
+ defineProperty(HTMLElement.prototype, 'outerText', {
4507
+ get() {
4508
+ // Note: we deviate from native shadow here, but are not fixing
4509
+ // due to backwards compat: https://github.com/salesforce/lwc/pull/3103
4510
+ return outerTextGetter.call(this);
4511
+ },
4512
+ set(v) {
4513
+ // Invoking the `outerText` setter on a host element should trigger its disconnection, but until we merge node reactions, it will not work.
4514
+ // 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))
4515
+ // but the benefits don't worth the efforts.
4516
+ outerTextSetter.call(this, v);
4517
+ },
4518
+ enumerable: true,
4519
+ configurable: true,
4520
+ });
4754
4521
  }
4755
4522
 
4756
4523
  /*
@@ -4949,4 +4716,4 @@ if (process.env.NODE_ENV !== 'production' && typeof __karma__ !== 'undefined') {
4949
4716
  }));
4950
4717
  });
4951
4718
  }
4952
- /** version: 2.32.0 */
4719
+ /** version: 2.33.0 */