@lwc/synthetic-shadow 2.31.1 → 2.32.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -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.31.1 */
151
+ /** version: 2.32.1 */
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.31.1 */
466
+ /** version: 2.32.1 */
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.31.1 */
4719
+ /** version: 2.32.1 */