@lwc/synthetic-shadow 2.28.1 → 2.30.0
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.
- package/dist/synthetic-shadow.js +99 -323
- package/package.json +3 -3
package/dist/synthetic-shadow.js
CHANGED
@@ -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.
|
151
|
+
/** version: 2.30.0 */
|
152
152
|
|
153
153
|
/*
|
154
154
|
* Copyright (c) 2018, salesforce.com, inc.
|
@@ -462,7 +462,7 @@ if (!_globalThis.lwcRuntimeFlags) {
|
|
462
462
|
Object.defineProperty(_globalThis, 'lwcRuntimeFlags', { value: create(null) });
|
463
463
|
}
|
464
464
|
const lwcRuntimeFlags = _globalThis.lwcRuntimeFlags;
|
465
|
-
/** version: 2.
|
465
|
+
/** version: 2.30.0 */
|
466
466
|
|
467
467
|
/*
|
468
468
|
* Copyright (c) 2018, salesforce.com, inc.
|
@@ -470,25 +470,22 @@ const lwcRuntimeFlags = _globalThis.lwcRuntimeFlags;
|
|
470
470
|
* SPDX-License-Identifier: MIT
|
471
471
|
* For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
|
472
472
|
*/
|
473
|
-
|
473
|
+
// Used as a back reference to identify the host element
|
474
474
|
const HostElementKey = '$$HostElementKey$$';
|
475
475
|
const ShadowedNodeKey = '$$ShadowedNodeKey$$';
|
476
|
-
|
477
476
|
function fastDefineProperty(node, propName, config) {
|
478
477
|
const shadowedNode = node;
|
479
|
-
|
480
478
|
if (process.env.NODE_ENV !== 'production') {
|
481
479
|
// in dev, we are more restrictive
|
482
480
|
defineProperty(shadowedNode, propName, config);
|
483
481
|
} else {
|
484
482
|
const {
|
485
483
|
value
|
486
|
-
} = config;
|
487
|
-
|
484
|
+
} = config;
|
485
|
+
// in prod, we prioritize performance
|
488
486
|
shadowedNode[propName] = value;
|
489
487
|
}
|
490
488
|
}
|
491
|
-
|
492
489
|
function setNodeOwnerKey(node, value) {
|
493
490
|
fastDefineProperty(node, HostElementKey, {
|
494
491
|
value,
|
@@ -505,18 +502,15 @@ function getNodeOwnerKey(node) {
|
|
505
502
|
}
|
506
503
|
function getNodeNearestOwnerKey(node) {
|
507
504
|
let host = node;
|
508
|
-
let hostKey;
|
505
|
+
let hostKey;
|
506
|
+
// search for the first element with owner identity
|
509
507
|
// in case of manually inserted elements and elements slotted from Light DOM
|
510
|
-
|
511
508
|
while (!isNull(host)) {
|
512
509
|
hostKey = getNodeOwnerKey(host);
|
513
|
-
|
514
510
|
if (!isUndefined(hostKey)) {
|
515
511
|
return hostKey;
|
516
512
|
}
|
517
|
-
|
518
513
|
host = parentNodeGetter.call(host);
|
519
|
-
|
520
514
|
if (lwcRuntimeFlags.ENABLE_LIGHT_GET_ROOT_NODE_PATCH) {
|
521
515
|
if (!isNull(host) && isSyntheticSlotElement(host)) {
|
522
516
|
return undefined;
|
@@ -532,7 +526,6 @@ function getNodeKey(node) {
|
|
532
526
|
* cases. If we need to traverse up and verify those nodes that don't have owner key, use
|
533
527
|
* isNodeDeepShadowed instead.
|
534
528
|
*/
|
535
|
-
|
536
529
|
function isNodeShadowed(node) {
|
537
530
|
return !isUndefined(getNodeOwnerKey(node));
|
538
531
|
}
|
@@ -543,35 +536,29 @@ function isNodeShadowed(node) {
|
|
543
536
|
* SPDX-License-Identifier: MIT
|
544
537
|
* For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
|
545
538
|
*/
|
539
|
+
// when finding a slot in the DOM, we can fold it if it is contained
|
546
540
|
// inside another slot.
|
547
|
-
|
548
541
|
function foldSlotElement(slot) {
|
549
542
|
let parent = parentElementGetter.call(slot);
|
550
|
-
|
551
543
|
while (!isNull(parent) && isSlotElement(parent)) {
|
552
544
|
slot = parent;
|
553
545
|
parent = parentElementGetter.call(slot);
|
554
546
|
}
|
555
|
-
|
556
547
|
return slot;
|
557
548
|
}
|
558
|
-
|
559
549
|
function isNodeSlotted(host, node) {
|
560
550
|
if (process.env.NODE_ENV !== 'production') {
|
561
551
|
assert.invariant(host instanceof HTMLElement, `isNodeSlotted() should be called with a host as the first argument instead of ${host}`);
|
562
552
|
assert.invariant(node instanceof _Node, `isNodeSlotted() should be called with a node as the second argument instead of ${node}`);
|
563
553
|
assert.invariant(compareDocumentPosition.call(node, host) & DOCUMENT_POSITION_CONTAINS, `isNodeSlotted() should never be called with a node that is not a child node of ${host}`);
|
564
554
|
}
|
565
|
-
|
566
|
-
|
555
|
+
const hostKey = getNodeKey(host);
|
556
|
+
// this routine assumes that the node is coming from a different shadow (it is not owned by the host)
|
567
557
|
// just in case the provided node is not an element
|
568
|
-
|
569
558
|
let currentElement = node instanceof Element ? node : parentElementGetter.call(node);
|
570
|
-
|
571
559
|
while (!isNull(currentElement) && currentElement !== host) {
|
572
560
|
const elmOwnerKey = getNodeNearestOwnerKey(currentElement);
|
573
561
|
const parent = parentElementGetter.call(currentElement);
|
574
|
-
|
575
562
|
if (elmOwnerKey === hostKey) {
|
576
563
|
// we have reached an element inside the host's template, and only if
|
577
564
|
// that element is an slot, then the node is considered slotted
|
@@ -597,7 +584,6 @@ function isNodeSlotted(host, node) {
|
|
597
584
|
* most outer slot parent before jumping into its corresponding host.
|
598
585
|
*/
|
599
586
|
currentElement = getNodeOwner(foldSlotElement(parent));
|
600
|
-
|
601
587
|
if (!isNull(currentElement)) {
|
602
588
|
if (currentElement === host) {
|
603
589
|
// the slot element is a top level element inside the shadow
|
@@ -616,32 +602,25 @@ function isNodeSlotted(host, node) {
|
|
616
602
|
currentElement = parent;
|
617
603
|
}
|
618
604
|
}
|
619
|
-
|
620
605
|
return false;
|
621
606
|
}
|
622
|
-
|
623
607
|
function getNodeOwner(node) {
|
624
608
|
if (!(node instanceof _Node)) {
|
625
609
|
return null;
|
626
610
|
}
|
627
|
-
|
628
611
|
const ownerKey = getNodeNearestOwnerKey(node);
|
629
|
-
|
630
612
|
if (isUndefined(ownerKey)) {
|
631
613
|
return null;
|
632
614
|
}
|
633
|
-
|
634
|
-
|
615
|
+
let nodeOwner = node;
|
616
|
+
// At this point, node is a valid node with owner identity, now we need to find the owner node
|
635
617
|
// search for a custom element with a VM that owns the first element with owner identity attached to it
|
636
|
-
|
637
618
|
while (!isNull(nodeOwner) && getNodeKey(nodeOwner) !== ownerKey) {
|
638
619
|
nodeOwner = parentNodeGetter.call(nodeOwner);
|
639
620
|
}
|
640
|
-
|
641
621
|
if (isNull(nodeOwner)) {
|
642
622
|
return null;
|
643
623
|
}
|
644
|
-
|
645
624
|
return nodeOwner;
|
646
625
|
}
|
647
626
|
function isSyntheticSlotElement(node) {
|
@@ -656,23 +635,18 @@ function isNodeOwnedBy(owner, node) {
|
|
656
635
|
assert.invariant(node instanceof _Node, `isNodeOwnedBy() should be called with a node as the second argument instead of ${node}`);
|
657
636
|
assert.invariant(compareDocumentPosition.call(node, owner) & DOCUMENT_POSITION_CONTAINS, `isNodeOwnedBy() should never be called with a node that is not a child node of ${owner}`);
|
658
637
|
}
|
659
|
-
|
660
638
|
const ownerKey = getNodeNearestOwnerKey(node);
|
661
|
-
|
662
639
|
if (isUndefined(ownerKey)) {
|
663
640
|
if (lwcRuntimeFlags.ENABLE_LIGHT_GET_ROOT_NODE_PATCH) {
|
664
641
|
// in case of root level light DOM element slotting into a synthetic shadow
|
665
642
|
const host = parentNodeGetter.call(node);
|
666
|
-
|
667
643
|
if (!isNull(host) && isSyntheticSlotElement(host)) {
|
668
644
|
return false;
|
669
645
|
}
|
670
|
-
}
|
671
|
-
|
672
|
-
|
646
|
+
}
|
647
|
+
// in case of manually inserted elements
|
673
648
|
return true;
|
674
649
|
}
|
675
|
-
|
676
650
|
return getNodeKey(owner) === ownerKey;
|
677
651
|
}
|
678
652
|
function shadowRootChildNodes(root) {
|
@@ -681,42 +655,34 @@ function shadowRootChildNodes(root) {
|
|
681
655
|
}
|
682
656
|
function getAllSlottedMatches(host, nodeList) {
|
683
657
|
const filteredAndPatched = [];
|
684
|
-
|
685
658
|
for (let i = 0, len = nodeList.length; i < len; i += 1) {
|
686
659
|
const node = nodeList[i];
|
687
|
-
|
688
660
|
if (!isNodeOwnedBy(host, node) && isNodeSlotted(host, node)) {
|
689
661
|
ArrayPush.call(filteredAndPatched, node);
|
690
662
|
}
|
691
663
|
}
|
692
|
-
|
693
664
|
return filteredAndPatched;
|
694
665
|
}
|
695
666
|
function getFirstSlottedMatch(host, nodeList) {
|
696
667
|
for (let i = 0, len = nodeList.length; i < len; i += 1) {
|
697
668
|
const node = nodeList[i];
|
698
|
-
|
699
669
|
if (!isNodeOwnedBy(host, node) && isNodeSlotted(host, node)) {
|
700
670
|
return node;
|
701
671
|
}
|
702
672
|
}
|
703
|
-
|
704
673
|
return null;
|
705
674
|
}
|
706
675
|
function getAllMatches(owner, nodeList) {
|
707
676
|
const filteredAndPatched = [];
|
708
|
-
|
709
677
|
for (let i = 0, len = nodeList.length; i < len; i += 1) {
|
710
678
|
const node = nodeList[i];
|
711
679
|
const isOwned = isNodeOwnedBy(owner, node);
|
712
|
-
|
713
680
|
if (isOwned) {
|
714
681
|
// Patch querySelector, querySelectorAll, etc
|
715
682
|
// if element is owned by VM
|
716
683
|
ArrayPush.call(filteredAndPatched, node);
|
717
684
|
}
|
718
685
|
}
|
719
|
-
|
720
686
|
return filteredAndPatched;
|
721
687
|
}
|
722
688
|
function getFirstMatch(owner, nodeList) {
|
@@ -725,7 +691,6 @@ function getFirstMatch(owner, nodeList) {
|
|
725
691
|
return nodeList[i];
|
726
692
|
}
|
727
693
|
}
|
728
|
-
|
729
694
|
return null;
|
730
695
|
}
|
731
696
|
function shadowRootQuerySelector(root, selector) {
|
@@ -744,19 +709,17 @@ function getFilteredChildNodes(node) {
|
|
744
709
|
const children = childNodesGetter.call(node);
|
745
710
|
return arrayFromCollection(children);
|
746
711
|
}
|
747
|
-
|
748
712
|
if (isSyntheticShadowHost(node)) {
|
749
713
|
// we need to get only the nodes that were slotted
|
750
714
|
const slots = arrayFromCollection(querySelectorAll$1.call(node, 'slot'));
|
751
|
-
const resolver = getShadowRootResolver(getShadowRoot(node));
|
715
|
+
const resolver = getShadowRootResolver(getShadowRoot(node));
|
716
|
+
// Typescript is inferring the wrong function type for this particular
|
752
717
|
// overloaded method: https://github.com/Microsoft/TypeScript/issues/27972
|
753
718
|
// @ts-ignore type-mismatch
|
754
|
-
|
755
719
|
return ArrayReduce.call(slots, (seed, slot) => {
|
756
720
|
if (resolver === getShadowRootResolver(slot)) {
|
757
721
|
ArrayPush.apply(seed, getFilteredSlotAssignedNodes(slot));
|
758
722
|
}
|
759
|
-
|
760
723
|
return seed;
|
761
724
|
}, []);
|
762
725
|
} else {
|
@@ -768,11 +731,9 @@ function getFilteredChildNodes(node) {
|
|
768
731
|
}
|
769
732
|
function getFilteredSlotAssignedNodes(slot) {
|
770
733
|
const owner = getNodeOwner(slot);
|
771
|
-
|
772
734
|
if (isNull(owner)) {
|
773
735
|
return [];
|
774
736
|
}
|
775
|
-
|
776
737
|
const childNodes = arrayFromCollection(childNodesGetter.call(slot));
|
777
738
|
return ArrayFilter.call(childNodes, child => !isNodeShadowed(child) || !isNodeOwnedBy(owner, child));
|
778
739
|
}
|
@@ -1194,14 +1155,11 @@ function createStaticHTMLCollection(items) {
|
|
1194
1155
|
* and elements with shadow dom attached to them. It doesn't apply to native slot elements
|
1195
1156
|
* because we don't want to patch the children getters for those elements.
|
1196
1157
|
*/
|
1197
|
-
|
1198
1158
|
function hasMountedChildren(node) {
|
1199
1159
|
return isSyntheticSlotElement(node) || isSyntheticShadowHost(node);
|
1200
1160
|
}
|
1201
|
-
|
1202
1161
|
function getShadowParent(node, value) {
|
1203
1162
|
const owner = getNodeOwner(node);
|
1204
|
-
|
1205
1163
|
if (value === owner) {
|
1206
1164
|
// walking up via parent chain might end up in the shadow root element
|
1207
1165
|
return getShadowRoot(owner);
|
@@ -1214,64 +1172,50 @@ function getShadowParent(node, value) {
|
|
1214
1172
|
// where they slotted into, but its shadowed parent is always the
|
1215
1173
|
// owner of the slot.
|
1216
1174
|
const slotOwner = getNodeOwner(value);
|
1217
|
-
|
1218
1175
|
if (!isNull(slotOwner) && isNodeOwnedBy(owner, slotOwner)) {
|
1219
1176
|
// it is a slotted element, and therefore its parent is always going to be the host of the slot
|
1220
1177
|
return slotOwner;
|
1221
1178
|
}
|
1222
1179
|
}
|
1223
1180
|
}
|
1224
|
-
|
1225
1181
|
return null;
|
1226
1182
|
}
|
1227
|
-
|
1228
1183
|
function hasChildNodesPatched() {
|
1229
1184
|
return getInternalChildNodes(this).length > 0;
|
1230
1185
|
}
|
1231
|
-
|
1232
1186
|
function firstChildGetterPatched() {
|
1233
1187
|
const childNodes = getInternalChildNodes(this);
|
1234
1188
|
return childNodes[0] || null;
|
1235
1189
|
}
|
1236
|
-
|
1237
1190
|
function lastChildGetterPatched() {
|
1238
1191
|
const childNodes = getInternalChildNodes(this);
|
1239
1192
|
return childNodes[childNodes.length - 1] || null;
|
1240
1193
|
}
|
1241
|
-
|
1242
1194
|
function textContentGetterPatched() {
|
1243
1195
|
return getTextContent(this);
|
1244
1196
|
}
|
1245
|
-
|
1246
1197
|
function textContentSetterPatched(value) {
|
1247
1198
|
textContextSetter.call(this, value);
|
1248
1199
|
}
|
1249
|
-
|
1250
1200
|
function parentNodeGetterPatched() {
|
1251
1201
|
const value = parentNodeGetter.call(this);
|
1252
|
-
|
1253
1202
|
if (isNull(value)) {
|
1254
1203
|
return value;
|
1255
|
-
}
|
1256
|
-
|
1257
|
-
|
1204
|
+
}
|
1205
|
+
// TODO [#1635]: this needs optimization, maybe implementing it based on this.assignedSlot
|
1258
1206
|
return getShadowParent(this, value);
|
1259
1207
|
}
|
1260
|
-
|
1261
1208
|
function parentElementGetterPatched() {
|
1262
1209
|
const value = parentNodeGetter.call(this);
|
1263
|
-
|
1264
1210
|
if (isNull(value)) {
|
1265
1211
|
return null;
|
1266
1212
|
}
|
1267
|
-
|
1268
|
-
|
1213
|
+
const parentNode = getShadowParent(this, value);
|
1214
|
+
// it could be that the parentNode is the shadowRoot, in which case
|
1269
1215
|
// we need to return null.
|
1270
1216
|
// TODO [#1635]: this needs optimization, maybe implementing it based on this.assignedSlot
|
1271
|
-
|
1272
1217
|
return parentNode instanceof Element ? parentNode : null;
|
1273
1218
|
}
|
1274
|
-
|
1275
1219
|
function compareDocumentPositionPatched(otherNode) {
|
1276
1220
|
if (this === otherNode) {
|
1277
1221
|
return 0;
|
@@ -1281,48 +1225,38 @@ function compareDocumentPositionPatched(otherNode) {
|
|
1281
1225
|
} else if (getNodeOwnerKey(this) !== getNodeOwnerKey(otherNode)) {
|
1282
1226
|
// "this" and "otherNode" belongs to 2 different shadow tree.
|
1283
1227
|
return 35; // Node.DOCUMENT_POSITION_DISCONNECTED | Node.DOCUMENT_POSITION_IMPLEMENTATION_SPECIFIC | Node.DOCUMENT_POSITION_PRECEDING
|
1284
|
-
}
|
1228
|
+
}
|
1229
|
+
// Since "this" and "otherNode" are part of the same shadow tree we can safely rely to the native
|
1285
1230
|
// Node.compareDocumentPosition implementation.
|
1286
|
-
|
1287
|
-
|
1288
1231
|
return compareDocumentPosition.call(this, otherNode);
|
1289
1232
|
}
|
1290
|
-
|
1291
1233
|
function containsPatched(otherNode) {
|
1292
1234
|
if (otherNode == null || getNodeOwnerKey(this) !== getNodeOwnerKey(otherNode)) {
|
1293
1235
|
// it is from another shadow
|
1294
1236
|
return false;
|
1295
1237
|
}
|
1296
|
-
|
1297
1238
|
return (compareDocumentPosition.call(this, otherNode) & DOCUMENT_POSITION_CONTAINED_BY) !== 0;
|
1298
1239
|
}
|
1299
|
-
|
1300
1240
|
function cloneNodePatched(deep) {
|
1301
|
-
const clone = cloneNode.call(this, false);
|
1241
|
+
const clone = cloneNode.call(this, false);
|
1242
|
+
// Per spec, browsers only care about truthy values
|
1302
1243
|
// Not strict true or false
|
1303
|
-
|
1304
1244
|
if (!deep) {
|
1305
1245
|
return clone;
|
1306
1246
|
}
|
1307
|
-
|
1308
1247
|
const childNodes = getInternalChildNodes(this);
|
1309
|
-
|
1310
1248
|
for (let i = 0, len = childNodes.length; i < len; i += 1) {
|
1311
1249
|
clone.appendChild(childNodes[i].cloneNode(true));
|
1312
1250
|
}
|
1313
|
-
|
1314
1251
|
return clone;
|
1315
1252
|
}
|
1316
1253
|
/**
|
1317
1254
|
* This method only applies to elements with a shadow or slots
|
1318
1255
|
*/
|
1319
|
-
|
1320
|
-
|
1321
1256
|
function childNodesGetterPatched() {
|
1322
1257
|
if (isSyntheticShadowHost(this)) {
|
1323
1258
|
const owner = getNodeOwner(this);
|
1324
1259
|
const childNodes = isNull(owner) ? [] : getAllMatches(owner, getFilteredChildNodes(this));
|
1325
|
-
|
1326
1260
|
if (process.env.NODE_ENV !== 'production' && isFalse(hasNativeSymbolSupport) && isExternalChildNodeAccessorFlagOn()) {
|
1327
1261
|
// inserting a comment node as the first childNode to trick the IE11
|
1328
1262
|
// DevTool to show the content of the shadowRoot, this should only happen
|
@@ -1330,30 +1264,24 @@ function childNodesGetterPatched() {
|
|
1330
1264
|
// Plus it should only be in place if we know it is an external invoker.
|
1331
1265
|
ArrayUnshift.call(childNodes, getIE11FakeShadowRootPlaceholder(this));
|
1332
1266
|
}
|
1333
|
-
|
1334
1267
|
return createStaticNodeList(childNodes);
|
1335
|
-
}
|
1268
|
+
}
|
1269
|
+
// nothing to do here since this does not have a synthetic shadow attached to it
|
1336
1270
|
// TODO [#1636]: what about slot elements?
|
1337
|
-
|
1338
|
-
|
1339
1271
|
return childNodesGetter.call(this);
|
1340
1272
|
}
|
1341
|
-
|
1342
1273
|
const nativeGetRootNode = _Node.prototype.getRootNode;
|
1343
1274
|
/**
|
1344
1275
|
* Get the root by climbing up the dom tree, beyond the shadow root
|
1345
1276
|
* If Node.prototype.getRootNode is supported, use it
|
1346
1277
|
* else, assume we are working in non-native shadow mode and climb using parentNode
|
1347
1278
|
*/
|
1348
|
-
|
1349
1279
|
const getDocumentOrRootNode = !isUndefined(nativeGetRootNode) ? nativeGetRootNode : function () {
|
1350
1280
|
let node = this;
|
1351
1281
|
let nodeParent;
|
1352
|
-
|
1353
1282
|
while (!isNull(nodeParent = parentNodeGetter.call(node))) {
|
1354
1283
|
node = nodeParent;
|
1355
1284
|
}
|
1356
|
-
|
1357
1285
|
return node;
|
1358
1286
|
};
|
1359
1287
|
/**
|
@@ -1365,15 +1293,12 @@ const getDocumentOrRootNode = !isUndefined(nativeGetRootNode) ? nativeGetRootNod
|
|
1365
1293
|
* of a native shadow or the synthetic shadow.
|
1366
1294
|
* @param {Node} node
|
1367
1295
|
*/
|
1368
|
-
|
1369
1296
|
function getNearestRoot(node) {
|
1370
1297
|
const ownerNode = getNodeOwner(node);
|
1371
|
-
|
1372
1298
|
if (isNull(ownerNode)) {
|
1373
1299
|
// we hit a wall, either we are in native shadow mode or the node is not in lwc boundary.
|
1374
1300
|
return getDocumentOrRootNode.call(node);
|
1375
1301
|
}
|
1376
|
-
|
1377
1302
|
return getShadowRoot(ownerNode);
|
1378
1303
|
}
|
1379
1304
|
/**
|
@@ -1395,25 +1320,20 @@ function getNearestRoot(node) {
|
|
1395
1320
|
* _Spec_: https://dom.spec.whatwg.org/#dom-node-getrootnode
|
1396
1321
|
*
|
1397
1322
|
**/
|
1398
|
-
|
1399
|
-
|
1400
1323
|
function getRootNodePatched(options) {
|
1401
1324
|
const composed = isUndefined(options) ? false : !!options.composed;
|
1402
1325
|
return isTrue(composed) ? getDocumentOrRootNode.call(this, options) : getNearestRoot(this);
|
1403
|
-
}
|
1326
|
+
}
|
1327
|
+
// Non-deep-traversing patches: this descriptor map includes all descriptors that
|
1404
1328
|
// do not give access to nodes beyond the immediate children.
|
1405
|
-
|
1406
|
-
|
1407
1329
|
defineProperties(_Node.prototype, {
|
1408
1330
|
firstChild: {
|
1409
1331
|
get() {
|
1410
1332
|
if (hasMountedChildren(this)) {
|
1411
1333
|
return firstChildGetterPatched.call(this);
|
1412
1334
|
}
|
1413
|
-
|
1414
1335
|
return firstChildGetter.call(this);
|
1415
1336
|
},
|
1416
|
-
|
1417
1337
|
enumerable: true,
|
1418
1338
|
configurable: true
|
1419
1339
|
},
|
@@ -1422,10 +1342,8 @@ defineProperties(_Node.prototype, {
|
|
1422
1342
|
if (hasMountedChildren(this)) {
|
1423
1343
|
return lastChildGetterPatched.call(this);
|
1424
1344
|
}
|
1425
|
-
|
1426
1345
|
return lastChildGetter.call(this);
|
1427
1346
|
},
|
1428
|
-
|
1429
1347
|
enumerable: true,
|
1430
1348
|
configurable: true
|
1431
1349
|
},
|
@@ -1435,18 +1353,14 @@ defineProperties(_Node.prototype, {
|
|
1435
1353
|
if (isNodeShadowed(this) || isSyntheticShadowHost(this)) {
|
1436
1354
|
return textContentGetterPatched.call(this);
|
1437
1355
|
}
|
1438
|
-
|
1439
1356
|
return textContentGetter.call(this);
|
1440
|
-
}
|
1441
|
-
|
1442
|
-
|
1357
|
+
}
|
1358
|
+
// TODO [#1222]: remove global bypass
|
1443
1359
|
if (isGlobalPatchingSkipped(this)) {
|
1444
1360
|
return textContentGetter.call(this);
|
1445
1361
|
}
|
1446
|
-
|
1447
1362
|
return textContentGetterPatched.call(this);
|
1448
1363
|
},
|
1449
|
-
|
1450
1364
|
set: textContentSetterPatched,
|
1451
1365
|
enumerable: true,
|
1452
1366
|
configurable: true
|
@@ -1456,17 +1370,14 @@ defineProperties(_Node.prototype, {
|
|
1456
1370
|
if (isNodeShadowed(this)) {
|
1457
1371
|
return parentNodeGetterPatched.call(this);
|
1458
1372
|
}
|
1459
|
-
|
1460
|
-
|
1373
|
+
const parentNode = parentNodeGetter.call(this);
|
1374
|
+
// Handle the case where a top level light DOM element is slotted into a synthetic
|
1461
1375
|
// shadow slot.
|
1462
|
-
|
1463
1376
|
if (!isNull(parentNode) && isSyntheticSlotElement(parentNode)) {
|
1464
1377
|
return getNodeOwner(parentNode);
|
1465
1378
|
}
|
1466
|
-
|
1467
1379
|
return parentNode;
|
1468
1380
|
},
|
1469
|
-
|
1470
1381
|
enumerable: true,
|
1471
1382
|
configurable: true
|
1472
1383
|
},
|
@@ -1475,17 +1386,14 @@ defineProperties(_Node.prototype, {
|
|
1475
1386
|
if (isNodeShadowed(this)) {
|
1476
1387
|
return parentElementGetterPatched.call(this);
|
1477
1388
|
}
|
1478
|
-
|
1479
|
-
|
1389
|
+
const parentElement = parentElementGetter.call(this);
|
1390
|
+
// Handle the case where a top level light DOM element is slotted into a synthetic
|
1480
1391
|
// shadow slot.
|
1481
|
-
|
1482
1392
|
if (!isNull(parentElement) && isSyntheticSlotElement(parentElement)) {
|
1483
1393
|
return getNodeOwner(parentElement);
|
1484
1394
|
}
|
1485
|
-
|
1486
1395
|
return parentElement;
|
1487
1396
|
},
|
1488
|
-
|
1489
1397
|
enumerable: true,
|
1490
1398
|
configurable: true
|
1491
1399
|
},
|
@@ -1494,10 +1402,8 @@ defineProperties(_Node.prototype, {
|
|
1494
1402
|
if (hasMountedChildren(this)) {
|
1495
1403
|
return childNodesGetterPatched.call(this);
|
1496
1404
|
}
|
1497
|
-
|
1498
1405
|
return childNodesGetter.call(this);
|
1499
1406
|
},
|
1500
|
-
|
1501
1407
|
enumerable: true,
|
1502
1408
|
configurable: true
|
1503
1409
|
},
|
@@ -1506,10 +1412,8 @@ defineProperties(_Node.prototype, {
|
|
1506
1412
|
if (hasMountedChildren(this)) {
|
1507
1413
|
return hasChildNodesPatched.call(this);
|
1508
1414
|
}
|
1509
|
-
|
1510
1415
|
return hasChildNodes.call(this);
|
1511
1416
|
},
|
1512
|
-
|
1513
1417
|
enumerable: true,
|
1514
1418
|
writable: true,
|
1515
1419
|
configurable: true
|
@@ -1520,10 +1424,8 @@ defineProperties(_Node.prototype, {
|
|
1520
1424
|
if (isGlobalPatchingSkipped(this)) {
|
1521
1425
|
return compareDocumentPosition.call(this, otherNode);
|
1522
1426
|
}
|
1523
|
-
|
1524
1427
|
return compareDocumentPositionPatched.call(this, otherNode);
|
1525
1428
|
},
|
1526
|
-
|
1527
1429
|
enumerable: true,
|
1528
1430
|
writable: true,
|
1529
1431
|
configurable: true
|
@@ -1537,27 +1439,21 @@ defineProperties(_Node.prototype, {
|
|
1537
1439
|
if (this === otherNode) {
|
1538
1440
|
return true;
|
1539
1441
|
}
|
1540
|
-
|
1541
1442
|
if (!lwcRuntimeFlags.ENABLE_NODE_PATCH) {
|
1542
1443
|
if (otherNode == null) {
|
1543
1444
|
return false;
|
1544
1445
|
}
|
1545
|
-
|
1546
1446
|
if (isNodeShadowed(this) || isSyntheticShadowHost(this)) {
|
1547
1447
|
return containsPatched.call(this, otherNode);
|
1548
1448
|
}
|
1549
|
-
|
1550
1449
|
return contains.call(this, otherNode);
|
1551
|
-
}
|
1552
|
-
|
1553
|
-
|
1450
|
+
}
|
1451
|
+
// TODO [#1222]: remove global bypass
|
1554
1452
|
if (isGlobalPatchingSkipped(this)) {
|
1555
1453
|
return contains.call(this, otherNode);
|
1556
1454
|
}
|
1557
|
-
|
1558
1455
|
return containsPatched.call(this, otherNode);
|
1559
1456
|
},
|
1560
|
-
|
1561
1457
|
enumerable: true,
|
1562
1458
|
writable: true,
|
1563
1459
|
configurable: true
|
@@ -1568,22 +1464,17 @@ defineProperties(_Node.prototype, {
|
|
1568
1464
|
if (isNodeShadowed(this) || isSyntheticShadowHost(this)) {
|
1569
1465
|
return cloneNodePatched.call(this, deep);
|
1570
1466
|
}
|
1571
|
-
|
1572
1467
|
return cloneNode.call(this, deep);
|
1573
1468
|
}
|
1574
|
-
|
1575
1469
|
if (isTrue(deep)) {
|
1576
1470
|
// TODO [#1222]: remove global bypass
|
1577
1471
|
if (isGlobalPatchingSkipped(this)) {
|
1578
1472
|
return cloneNode.call(this, deep);
|
1579
1473
|
}
|
1580
|
-
|
1581
1474
|
return cloneNodePatched.call(this, deep);
|
1582
1475
|
}
|
1583
|
-
|
1584
1476
|
return cloneNode.call(this, deep);
|
1585
1477
|
},
|
1586
|
-
|
1587
1478
|
enumerable: true,
|
1588
1479
|
writable: true,
|
1589
1480
|
configurable: true
|
@@ -1597,11 +1488,9 @@ defineProperties(_Node.prototype, {
|
|
1597
1488
|
isConnected: {
|
1598
1489
|
enumerable: true,
|
1599
1490
|
configurable: true,
|
1600
|
-
|
1601
1491
|
get() {
|
1602
1492
|
return isConnected.call(this);
|
1603
1493
|
}
|
1604
|
-
|
1605
1494
|
}
|
1606
1495
|
});
|
1607
1496
|
let internalChildNodeAccessorFlag = false;
|
@@ -1611,7 +1500,6 @@ let internalChildNodeAccessorFlag = false;
|
|
1611
1500
|
* or from an external invoker. This helps to produce the right output in one very peculiar
|
1612
1501
|
* case, the IE11 debugging comment for shadowRoot representation on the devtool.
|
1613
1502
|
*/
|
1614
|
-
|
1615
1503
|
function isExternalChildNodeAccessorFlagOn() {
|
1616
1504
|
return !internalChildNodeAccessorFlag;
|
1617
1505
|
}
|
@@ -1619,7 +1507,6 @@ const getInternalChildNodes = process.env.NODE_ENV !== 'production' && isFalse(h
|
|
1619
1507
|
internalChildNodeAccessorFlag = true;
|
1620
1508
|
let childNodes;
|
1621
1509
|
let error = null;
|
1622
|
-
|
1623
1510
|
try {
|
1624
1511
|
childNodes = node.childNodes;
|
1625
1512
|
} catch (e) {
|
@@ -1627,7 +1514,6 @@ const getInternalChildNodes = process.env.NODE_ENV !== 'production' && isFalse(h
|
|
1627
1514
|
error = e;
|
1628
1515
|
} finally {
|
1629
1516
|
internalChildNodeAccessorFlag = false;
|
1630
|
-
|
1631
1517
|
if (!isNull(error)) {
|
1632
1518
|
// re-throwing after restoring the state machinery for setInternalChildNodeAccessorFlag
|
1633
1519
|
throw error; // eslint-disable-line no-unsafe-finally
|
@@ -1637,12 +1523,11 @@ const getInternalChildNodes = process.env.NODE_ENV !== 'production' && isFalse(h
|
|
1637
1523
|
return childNodes;
|
1638
1524
|
} : function (node) {
|
1639
1525
|
return node.childNodes;
|
1640
|
-
};
|
1641
|
-
|
1526
|
+
};
|
1527
|
+
// IE11 extra patches for wrong prototypes
|
1642
1528
|
if (hasOwnProperty.call(HTMLElement.prototype, 'contains')) {
|
1643
1529
|
defineProperty(HTMLElement.prototype, 'contains', getOwnPropertyDescriptor(_Node.prototype, 'contains'));
|
1644
1530
|
}
|
1645
|
-
|
1646
1531
|
if (hasOwnProperty.call(HTMLElement.prototype, 'parentElement')) {
|
1647
1532
|
defineProperty(HTMLElement.prototype, 'parentElement', getOwnPropertyDescriptor(_Node.prototype, 'parentElement'));
|
1648
1533
|
}
|
@@ -3801,66 +3686,52 @@ function getNonPatchedFilteredArrayOfNodes(context, unfilteredNodes) {
|
|
3801
3686
|
* SPDX-License-Identifier: MIT
|
3802
3687
|
* For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
|
3803
3688
|
*/
|
3804
|
-
|
3805
3689
|
function innerHTMLGetterPatched() {
|
3806
3690
|
const childNodes = getInternalChildNodes(this);
|
3807
3691
|
let innerHTML = '';
|
3808
|
-
|
3809
3692
|
for (let i = 0, len = childNodes.length; i < len; i += 1) {
|
3810
3693
|
innerHTML += getOuterHTML(childNodes[i]);
|
3811
3694
|
}
|
3812
|
-
|
3813
3695
|
return innerHTML;
|
3814
3696
|
}
|
3815
|
-
|
3816
3697
|
function outerHTMLGetterPatched() {
|
3817
3698
|
return getOuterHTML(this);
|
3818
3699
|
}
|
3819
|
-
|
3820
3700
|
function attachShadowPatched(options) {
|
3821
3701
|
// To retain native behavior of the API, provide synthetic shadowRoot only when specified
|
3822
3702
|
if (options[KEY__SYNTHETIC_MODE]) {
|
3823
3703
|
return attachShadow(this, options);
|
3824
3704
|
}
|
3825
|
-
|
3826
3705
|
return attachShadow$1.call(this, options);
|
3827
3706
|
}
|
3828
|
-
|
3829
3707
|
function shadowRootGetterPatched() {
|
3830
3708
|
if (isSyntheticShadowHost(this)) {
|
3831
3709
|
const shadow = getShadowRoot(this);
|
3832
|
-
|
3833
3710
|
if (shadow.mode === 'open') {
|
3834
3711
|
return shadow;
|
3835
3712
|
}
|
3836
3713
|
}
|
3837
|
-
|
3838
3714
|
return shadowRootGetter.call(this);
|
3839
3715
|
}
|
3840
|
-
|
3841
3716
|
function childrenGetterPatched() {
|
3842
3717
|
const owner = getNodeOwner(this);
|
3843
3718
|
const childNodes = isNull(owner) ? [] : getAllMatches(owner, getFilteredChildNodes(this));
|
3844
3719
|
return createStaticHTMLCollection(ArrayFilter.call(childNodes, node => node instanceof Element));
|
3845
3720
|
}
|
3846
|
-
|
3847
3721
|
function childElementCountGetterPatched() {
|
3848
3722
|
return this.children.length;
|
3849
3723
|
}
|
3850
|
-
|
3851
3724
|
function firstElementChildGetterPatched() {
|
3852
3725
|
return this.children[0] || null;
|
3853
3726
|
}
|
3854
|
-
|
3855
3727
|
function lastElementChildGetterPatched() {
|
3856
3728
|
const {
|
3857
3729
|
children
|
3858
3730
|
} = this;
|
3859
3731
|
return children.item(children.length - 1) || null;
|
3860
|
-
}
|
3732
|
+
}
|
3733
|
+
// Non-deep-traversing patches: this descriptor map includes all descriptors that
|
3861
3734
|
// do not five access to nodes beyond the immediate children.
|
3862
|
-
|
3863
|
-
|
3864
3735
|
defineProperties(Element.prototype, {
|
3865
3736
|
innerHTML: {
|
3866
3737
|
get() {
|
@@ -3868,22 +3739,17 @@ defineProperties(Element.prototype, {
|
|
3868
3739
|
if (isNodeShadowed(this) || isSyntheticShadowHost(this)) {
|
3869
3740
|
return innerHTMLGetterPatched.call(this);
|
3870
3741
|
}
|
3871
|
-
|
3872
3742
|
return innerHTMLGetter.call(this);
|
3873
|
-
}
|
3874
|
-
|
3875
|
-
|
3743
|
+
}
|
3744
|
+
// TODO [#1222]: remove global bypass
|
3876
3745
|
if (isGlobalPatchingSkipped(this)) {
|
3877
3746
|
return innerHTMLGetter.call(this);
|
3878
3747
|
}
|
3879
|
-
|
3880
3748
|
return innerHTMLGetterPatched.call(this);
|
3881
3749
|
},
|
3882
|
-
|
3883
3750
|
set(v) {
|
3884
3751
|
innerHTMLSetter.call(this, v);
|
3885
3752
|
},
|
3886
|
-
|
3887
3753
|
enumerable: true,
|
3888
3754
|
configurable: true
|
3889
3755
|
},
|
@@ -3893,22 +3759,17 @@ defineProperties(Element.prototype, {
|
|
3893
3759
|
if (isNodeShadowed(this) || isSyntheticShadowHost(this)) {
|
3894
3760
|
return outerHTMLGetterPatched.call(this);
|
3895
3761
|
}
|
3896
|
-
|
3897
3762
|
return outerHTMLGetter.call(this);
|
3898
|
-
}
|
3899
|
-
|
3900
|
-
|
3763
|
+
}
|
3764
|
+
// TODO [#1222]: remove global bypass
|
3901
3765
|
if (isGlobalPatchingSkipped(this)) {
|
3902
3766
|
return outerHTMLGetter.call(this);
|
3903
3767
|
}
|
3904
|
-
|
3905
3768
|
return outerHTMLGetterPatched.call(this);
|
3906
3769
|
},
|
3907
|
-
|
3908
3770
|
set(v) {
|
3909
3771
|
outerHTMLSetter.call(this, v);
|
3910
3772
|
},
|
3911
|
-
|
3912
3773
|
enumerable: true,
|
3913
3774
|
configurable: true
|
3914
3775
|
},
|
@@ -3929,10 +3790,8 @@ defineProperties(Element.prototype, {
|
|
3929
3790
|
if (hasMountedChildren(this)) {
|
3930
3791
|
return childrenGetterPatched.call(this);
|
3931
3792
|
}
|
3932
|
-
|
3933
3793
|
return childrenGetter.call(this);
|
3934
3794
|
},
|
3935
|
-
|
3936
3795
|
enumerable: true,
|
3937
3796
|
configurable: true
|
3938
3797
|
},
|
@@ -3941,10 +3800,8 @@ defineProperties(Element.prototype, {
|
|
3941
3800
|
if (hasMountedChildren(this)) {
|
3942
3801
|
return childElementCountGetterPatched.call(this);
|
3943
3802
|
}
|
3944
|
-
|
3945
3803
|
return childElementCountGetter.call(this);
|
3946
3804
|
},
|
3947
|
-
|
3948
3805
|
enumerable: true,
|
3949
3806
|
configurable: true
|
3950
3807
|
},
|
@@ -3953,10 +3810,8 @@ defineProperties(Element.prototype, {
|
|
3953
3810
|
if (hasMountedChildren(this)) {
|
3954
3811
|
return firstElementChildGetterPatched.call(this);
|
3955
3812
|
}
|
3956
|
-
|
3957
3813
|
return firstElementChildGetter.call(this);
|
3958
3814
|
},
|
3959
|
-
|
3960
3815
|
enumerable: true,
|
3961
3816
|
configurable: true
|
3962
3817
|
},
|
@@ -3965,10 +3820,8 @@ defineProperties(Element.prototype, {
|
|
3965
3820
|
if (hasMountedChildren(this)) {
|
3966
3821
|
return lastElementChildGetterPatched.call(this);
|
3967
3822
|
}
|
3968
|
-
|
3969
3823
|
return lastElementChildGetter.call(this);
|
3970
3824
|
},
|
3971
|
-
|
3972
3825
|
enumerable: true,
|
3973
3826
|
configurable: true
|
3974
3827
|
},
|
@@ -3977,28 +3830,23 @@ defineProperties(Element.prototype, {
|
|
3977
3830
|
enumerable: true,
|
3978
3831
|
configurable: true
|
3979
3832
|
}
|
3980
|
-
});
|
3981
|
-
|
3833
|
+
});
|
3834
|
+
// IE11 extra patches for wrong prototypes
|
3982
3835
|
if (hasOwnProperty.call(HTMLElement.prototype, 'innerHTML')) {
|
3983
3836
|
defineProperty(HTMLElement.prototype, 'innerHTML', getOwnPropertyDescriptor(Element.prototype, 'innerHTML'));
|
3984
3837
|
}
|
3985
|
-
|
3986
3838
|
if (hasOwnProperty.call(HTMLElement.prototype, 'outerHTML')) {
|
3987
3839
|
defineProperty(HTMLElement.prototype, 'outerHTML', getOwnPropertyDescriptor(Element.prototype, 'outerHTML'));
|
3988
3840
|
}
|
3989
|
-
|
3990
3841
|
if (hasOwnProperty.call(HTMLElement.prototype, 'children')) {
|
3991
3842
|
defineProperty(HTMLElement.prototype, 'children', getOwnPropertyDescriptor(Element.prototype, 'children'));
|
3992
|
-
}
|
3993
|
-
|
3994
|
-
|
3843
|
+
}
|
3844
|
+
// Deep-traversing patches from this point on:
|
3995
3845
|
function querySelectorPatched() {
|
3996
3846
|
const nodeList = arrayFromCollection(querySelectorAll$1.apply(this, ArraySlice.call(arguments)));
|
3997
|
-
|
3998
3847
|
if (isSyntheticShadowHost(this)) {
|
3999
3848
|
// element with shadowRoot attached
|
4000
3849
|
const owner = getNodeOwner(this);
|
4001
|
-
|
4002
3850
|
if (!isUndefined(getNodeKey(this))) {
|
4003
3851
|
// it is a custom element, and we should then filter by slotted elements
|
4004
3852
|
return getFirstSlottedMatch(this, nodeList);
|
@@ -4011,7 +3859,6 @@ function querySelectorPatched() {
|
|
4011
3859
|
} else if (isNodeShadowed(this)) {
|
4012
3860
|
// element inside a shadowRoot
|
4013
3861
|
const ownerKey = getNodeOwnerKey(this);
|
4014
|
-
|
4015
3862
|
if (!isUndefined(ownerKey)) {
|
4016
3863
|
// `this` is handled by lwc, using getNodeNearestOwnerKey to include manually inserted elements in the same shadow.
|
4017
3864
|
const elm = ArrayFind.call(nodeList, elm => getNodeNearestOwnerKey(elm) === ownerKey);
|
@@ -4020,10 +3867,9 @@ function querySelectorPatched() {
|
|
4020
3867
|
if (!lwcRuntimeFlags.ENABLE_NODE_LIST_PATCH) {
|
4021
3868
|
// `this` is a manually inserted element inside a shadowRoot, return the first element.
|
4022
3869
|
return nodeList.length === 0 ? null : nodeList[0];
|
4023
|
-
}
|
3870
|
+
}
|
3871
|
+
// Element is inside a shadow but we dont know which one. Use the
|
4024
3872
|
// "nearest" owner key to filter by ownership.
|
4025
|
-
|
4026
|
-
|
4027
3873
|
const contextNearestOwnerKey = getNodeNearestOwnerKey(this);
|
4028
3874
|
const elm = ArrayFind.call(nodeList, elm => getNodeNearestOwnerKey(elm) === contextNearestOwnerKey);
|
4029
3875
|
return isUndefined(elm) ? null : elm;
|
@@ -4034,22 +3880,19 @@ function querySelectorPatched() {
|
|
4034
3880
|
const elm = nodeList[0];
|
4035
3881
|
return isUndefined(elm) ? null : elm;
|
4036
3882
|
}
|
4037
|
-
}
|
4038
|
-
|
4039
|
-
|
4040
|
-
|
3883
|
+
}
|
3884
|
+
// element belonging to the document
|
3885
|
+
const elm = ArrayFind.call(nodeList,
|
3886
|
+
// TODO [#1222]: remove global bypass
|
4041
3887
|
elm => isUndefined(getNodeOwnerKey(elm)) || isGlobalPatchingSkipped(this));
|
4042
3888
|
return isUndefined(elm) ? null : elm;
|
4043
3889
|
}
|
4044
3890
|
}
|
4045
|
-
|
4046
3891
|
function getFilteredArrayOfNodes(context, unfilteredNodes, shadowDomSemantic) {
|
4047
3892
|
let filtered;
|
4048
|
-
|
4049
3893
|
if (isSyntheticShadowHost(context)) {
|
4050
3894
|
// element with shadowRoot attached
|
4051
3895
|
const owner = getNodeOwner(context);
|
4052
|
-
|
4053
3896
|
if (!isUndefined(getNodeKey(context))) {
|
4054
3897
|
// it is a custom element, and we should then filter by slotted elements
|
4055
3898
|
filtered = getAllSlottedMatches(context, unfilteredNodes);
|
@@ -4062,13 +3905,10 @@ function getFilteredArrayOfNodes(context, unfilteredNodes, shadowDomSemantic) {
|
|
4062
3905
|
} else if (isNodeShadowed(context)) {
|
4063
3906
|
// element inside a shadowRoot
|
4064
3907
|
const ownerKey = getNodeOwnerKey(context);
|
4065
|
-
|
4066
3908
|
if (!isUndefined(ownerKey)) {
|
4067
3909
|
// context is handled by lwc, using getNodeNearestOwnerKey to include manually inserted elements in the same shadow.
|
4068
3910
|
filtered = ArrayFilter.call(unfilteredNodes, elm => getNodeNearestOwnerKey(elm) === ownerKey);
|
4069
|
-
} else if (shadowDomSemantic === 1
|
4070
|
-
/* ShadowDomSemantic.Enabled */
|
4071
|
-
) {
|
3911
|
+
} else if (shadowDomSemantic === 1 /* ShadowDomSemantic.Enabled */) {
|
4072
3912
|
// context is inside a shadow, we dont know which one.
|
4073
3913
|
const contextNearestOwnerKey = getNodeNearestOwnerKey(context);
|
4074
3914
|
filtered = ArrayFilter.call(unfilteredNodes, elm => getNodeNearestOwnerKey(elm) === contextNearestOwnerKey);
|
@@ -4077,20 +3917,19 @@ function getFilteredArrayOfNodes(context, unfilteredNodes, shadowDomSemantic) {
|
|
4077
3917
|
filtered = ArraySlice.call(unfilteredNodes);
|
4078
3918
|
}
|
4079
3919
|
} else {
|
4080
|
-
if (context instanceof HTMLBodyElement || shadowDomSemantic === 1
|
4081
|
-
/* ShadowDomSemantic.Enabled */
|
4082
|
-
) {
|
3920
|
+
if (context instanceof HTMLBodyElement || shadowDomSemantic === 1 /* ShadowDomSemantic.Enabled */) {
|
4083
3921
|
// `context` is document.body or element belonging to the document with the patch enabled
|
4084
|
-
filtered = ArrayFilter.call(unfilteredNodes,
|
3922
|
+
filtered = ArrayFilter.call(unfilteredNodes,
|
3923
|
+
// TODO [#1222]: remove global bypass
|
4085
3924
|
elm => isUndefined(getNodeOwnerKey(elm)) || isGlobalPatchingSkipped(context));
|
4086
3925
|
} else {
|
4087
3926
|
// `context` is outside the lwc boundary and patch is not enabled.
|
4088
3927
|
filtered = ArraySlice.call(unfilteredNodes);
|
4089
3928
|
}
|
4090
3929
|
}
|
4091
|
-
|
4092
3930
|
return filtered;
|
4093
|
-
}
|
3931
|
+
}
|
3932
|
+
// The following patched methods hide shadowed elements from global
|
4094
3933
|
// traversing mechanisms. They are simplified for performance reasons to
|
4095
3934
|
// filter by ownership and do not account for slotted elements. This
|
4096
3935
|
// compromise is fine for our synthetic shadow dom because root elements
|
@@ -4099,8 +3938,6 @@ function getFilteredArrayOfNodes(context, unfilteredNodes, shadowDomSemantic) {
|
|
4099
3938
|
// static HTMLCollection or static NodeList. We decided that this compromise
|
4100
3939
|
// is not a big problem considering the amount of code that is relying on
|
4101
3940
|
// the liveliness of these results are rare.
|
4102
|
-
|
4103
|
-
|
4104
3941
|
defineProperties(Element.prototype, {
|
4105
3942
|
querySelector: {
|
4106
3943
|
value: querySelectorPatched,
|
@@ -4111,41 +3948,30 @@ defineProperties(Element.prototype, {
|
|
4111
3948
|
querySelectorAll: {
|
4112
3949
|
value() {
|
4113
3950
|
const nodeList = arrayFromCollection(querySelectorAll$1.apply(this, ArraySlice.call(arguments)));
|
4114
|
-
|
4115
3951
|
if (!lwcRuntimeFlags.ENABLE_NODE_LIST_PATCH) {
|
4116
|
-
const filteredResults = getFilteredArrayOfNodes(this, nodeList, 0
|
4117
|
-
/* ShadowDomSemantic.Disabled */
|
4118
|
-
);
|
3952
|
+
const filteredResults = getFilteredArrayOfNodes(this, nodeList, 0 /* ShadowDomSemantic.Disabled */);
|
4119
3953
|
return createStaticNodeList(filteredResults);
|
4120
3954
|
}
|
4121
|
-
|
4122
|
-
return createStaticNodeList(getFilteredArrayOfNodes(this, nodeList, 1
|
4123
|
-
/* ShadowDomSemantic.Enabled */
|
4124
|
-
));
|
3955
|
+
return createStaticNodeList(getFilteredArrayOfNodes(this, nodeList, 1 /* ShadowDomSemantic.Enabled */));
|
4125
3956
|
},
|
4126
3957
|
|
4127
3958
|
writable: true,
|
4128
3959
|
enumerable: true,
|
4129
3960
|
configurable: true
|
4130
3961
|
}
|
4131
|
-
});
|
4132
|
-
|
3962
|
+
});
|
3963
|
+
// The following APIs are used directly by Jest internally so we avoid patching them during testing.
|
4133
3964
|
if (process.env.NODE_ENV !== 'test') {
|
4134
3965
|
defineProperties(Element.prototype, {
|
4135
3966
|
getElementsByClassName: {
|
4136
3967
|
value() {
|
4137
3968
|
const elements = arrayFromCollection(getElementsByClassName$1.apply(this, ArraySlice.call(arguments)));
|
4138
|
-
|
4139
3969
|
if (!lwcRuntimeFlags.ENABLE_HTML_COLLECTIONS_PATCH) {
|
4140
3970
|
return createStaticHTMLCollection(getNonPatchedFilteredArrayOfNodes(this, elements));
|
4141
3971
|
}
|
4142
|
-
|
4143
|
-
const filteredResults = getFilteredArrayOfNodes(this, elements, 1
|
4144
|
-
/* ShadowDomSemantic.Enabled */
|
4145
|
-
);
|
3972
|
+
const filteredResults = getFilteredArrayOfNodes(this, elements, 1 /* ShadowDomSemantic.Enabled */);
|
4146
3973
|
return createStaticHTMLCollection(filteredResults);
|
4147
3974
|
},
|
4148
|
-
|
4149
3975
|
writable: true,
|
4150
3976
|
enumerable: true,
|
4151
3977
|
configurable: true
|
@@ -4153,17 +3979,12 @@ if (process.env.NODE_ENV !== 'test') {
|
|
4153
3979
|
getElementsByTagName: {
|
4154
3980
|
value() {
|
4155
3981
|
const elements = arrayFromCollection(getElementsByTagName$1.apply(this, ArraySlice.call(arguments)));
|
4156
|
-
|
4157
3982
|
if (!lwcRuntimeFlags.ENABLE_HTML_COLLECTIONS_PATCH) {
|
4158
3983
|
return createStaticHTMLCollection(getNonPatchedFilteredArrayOfNodes(this, elements));
|
4159
3984
|
}
|
4160
|
-
|
4161
|
-
const filteredResults = getFilteredArrayOfNodes(this, elements, 1
|
4162
|
-
/* ShadowDomSemantic.Enabled */
|
4163
|
-
);
|
3985
|
+
const filteredResults = getFilteredArrayOfNodes(this, elements, 1 /* ShadowDomSemantic.Enabled */);
|
4164
3986
|
return createStaticHTMLCollection(filteredResults);
|
4165
3987
|
},
|
4166
|
-
|
4167
3988
|
writable: true,
|
4168
3989
|
enumerable: true,
|
4169
3990
|
configurable: true
|
@@ -4171,25 +3992,19 @@ if (process.env.NODE_ENV !== 'test') {
|
|
4171
3992
|
getElementsByTagNameNS: {
|
4172
3993
|
value() {
|
4173
3994
|
const elements = arrayFromCollection(getElementsByTagNameNS$1.apply(this, ArraySlice.call(arguments)));
|
4174
|
-
|
4175
3995
|
if (!lwcRuntimeFlags.ENABLE_HTML_COLLECTIONS_PATCH) {
|
4176
3996
|
return createStaticHTMLCollection(getNonPatchedFilteredArrayOfNodes(this, elements));
|
4177
3997
|
}
|
4178
|
-
|
4179
|
-
const filteredResults = getFilteredArrayOfNodes(this, elements, 1
|
4180
|
-
/* ShadowDomSemantic.Enabled */
|
4181
|
-
);
|
3998
|
+
const filteredResults = getFilteredArrayOfNodes(this, elements, 1 /* ShadowDomSemantic.Enabled */);
|
4182
3999
|
return createStaticHTMLCollection(filteredResults);
|
4183
4000
|
},
|
4184
|
-
|
4185
4001
|
writable: true,
|
4186
4002
|
enumerable: true,
|
4187
4003
|
configurable: true
|
4188
4004
|
}
|
4189
4005
|
});
|
4190
|
-
}
|
4191
|
-
|
4192
|
-
|
4006
|
+
}
|
4007
|
+
// IE11 extra patches for wrong prototypes
|
4193
4008
|
if (hasOwnProperty.call(HTMLElement.prototype, 'getElementsByClassName')) {
|
4194
4009
|
defineProperty(HTMLElement.prototype, 'getElementsByClassName', getOwnPropertyDescriptor(Element.prototype, 'getElementsByClassName'));
|
4195
4010
|
}
|
@@ -4737,21 +4552,17 @@ const {
|
|
4737
4552
|
/**
|
4738
4553
|
* This method only applies to elements with a shadow attached to them
|
4739
4554
|
*/
|
4740
|
-
|
4741
4555
|
function tabIndexGetterPatched() {
|
4742
4556
|
if (isDelegatingFocus(this) && isFalse(hasAttribute.call(this, 'tabindex'))) {
|
4743
4557
|
// this covers the case where the default tabindex should be 0 because the
|
4744
4558
|
// custom element is delegating its focus
|
4745
4559
|
return 0;
|
4746
4560
|
}
|
4747
|
-
|
4748
4561
|
return tabIndexGetter.call(this);
|
4749
4562
|
}
|
4750
4563
|
/**
|
4751
4564
|
* This method only applies to elements with a shadow attached to them
|
4752
4565
|
*/
|
4753
|
-
|
4754
|
-
|
4755
4566
|
function tabIndexSetterPatched(value) {
|
4756
4567
|
// This tabIndex setter might be confusing unless it is understood that HTML
|
4757
4568
|
// elements have default tabIndex property values. Natively focusable elements have
|
@@ -4759,53 +4570,48 @@ function tabIndexSetterPatched(value) {
|
|
4759
4570
|
// value of -1. For example, the tabIndex property value is -1 for both <x-foo> and
|
4760
4571
|
// <x-foo tabindex="-1">, but our delegatesFocus polyfill should only kick in for
|
4761
4572
|
// the latter case when the value of the tabindex attribute is -1.
|
4762
|
-
const delegatesFocus = isDelegatingFocus(this);
|
4763
|
-
|
4573
|
+
const delegatesFocus = isDelegatingFocus(this);
|
4574
|
+
// Record the state of things before invoking component setter.
|
4764
4575
|
const prevValue = tabIndexGetter.call(this);
|
4765
4576
|
const prevHasAttr = hasAttribute.call(this, 'tabindex');
|
4766
|
-
tabIndexSetter.call(this, value);
|
4767
|
-
|
4577
|
+
tabIndexSetter.call(this, value);
|
4578
|
+
// Record the state of things after invoking component setter.
|
4768
4579
|
const currValue = tabIndexGetter.call(this);
|
4769
4580
|
const currHasAttr = hasAttribute.call(this, 'tabindex');
|
4770
|
-
const didValueChange = prevValue !== currValue;
|
4581
|
+
const didValueChange = prevValue !== currValue;
|
4582
|
+
// If the tabindex attribute is initially rendered, we can assume that this setter has
|
4771
4583
|
// previously executed and a listener has been added. We must remove that listener if
|
4772
4584
|
// the tabIndex property value has changed or if the component no longer renders a
|
4773
4585
|
// tabindex attribute.
|
4774
|
-
|
4775
4586
|
if (prevHasAttr && (didValueChange || isFalse(currHasAttr))) {
|
4776
4587
|
if (prevValue === -1) {
|
4777
4588
|
ignoreFocusIn(this);
|
4778
4589
|
}
|
4779
|
-
|
4780
4590
|
if (prevValue === 0 && delegatesFocus) {
|
4781
4591
|
ignoreFocus(this);
|
4782
4592
|
}
|
4783
|
-
}
|
4593
|
+
}
|
4594
|
+
// If a tabindex attribute was not rendered after invoking its setter, it means the
|
4784
4595
|
// component is taking control. Do nothing.
|
4785
|
-
|
4786
|
-
|
4787
4596
|
if (isFalse(currHasAttr)) {
|
4788
4597
|
return;
|
4789
|
-
}
|
4598
|
+
}
|
4599
|
+
// If the tabindex attribute is initially rendered, we can assume that this setter has
|
4790
4600
|
// previously executed and a listener has been added. If the tabindex attribute is still
|
4791
4601
|
// rendered after invoking the setter AND the tabIndex property value has not changed,
|
4792
4602
|
// we don't need to do any work.
|
4793
|
-
|
4794
|
-
|
4795
4603
|
if (prevHasAttr && currHasAttr && isFalse(didValueChange)) {
|
4796
4604
|
return;
|
4797
|
-
}
|
4605
|
+
}
|
4606
|
+
// At this point we know that a tabindex attribute was rendered after invoking the
|
4798
4607
|
// setter and that either:
|
4799
4608
|
// 1) This is the first time this setter is being invoked.
|
4800
4609
|
// 2) This is not the first time this setter is being invoked and the value is changing.
|
4801
4610
|
// We need to add the appropriate listeners in either case.
|
4802
|
-
|
4803
|
-
|
4804
4611
|
if (currValue === -1) {
|
4805
4612
|
// Add the magic to skip the shadow tree
|
4806
4613
|
handleFocusIn(this);
|
4807
4614
|
}
|
4808
|
-
|
4809
4615
|
if (currValue === 0 && delegatesFocus) {
|
4810
4616
|
// Add the magic to skip the host element
|
4811
4617
|
handleFocus(this);
|
@@ -4814,64 +4620,52 @@ function tabIndexSetterPatched(value) {
|
|
4814
4620
|
/**
|
4815
4621
|
* This method only applies to elements with a shadow attached to them
|
4816
4622
|
*/
|
4817
|
-
|
4818
|
-
|
4819
4623
|
function blurPatched() {
|
4820
4624
|
if (isDelegatingFocus(this)) {
|
4821
4625
|
const currentActiveElement = getActiveElement(this);
|
4822
|
-
|
4823
4626
|
if (!isNull(currentActiveElement)) {
|
4824
4627
|
// if there is an active element, blur it (intentionally using the dot notation in case the user defines the blur routine)
|
4825
4628
|
currentActiveElement.blur();
|
4826
4629
|
return;
|
4827
4630
|
}
|
4828
4631
|
}
|
4829
|
-
|
4830
4632
|
return blur.call(this);
|
4831
4633
|
}
|
4832
|
-
|
4833
4634
|
function focusPatched() {
|
4834
4635
|
// Save enabled state
|
4835
|
-
const originallyEnabled = isKeyboardFocusNavigationRoutineEnabled();
|
4836
|
-
|
4636
|
+
const originallyEnabled = isKeyboardFocusNavigationRoutineEnabled();
|
4637
|
+
// Change state by disabling if originally enabled
|
4837
4638
|
if (originallyEnabled) {
|
4838
4639
|
disableKeyboardFocusNavigationRoutines();
|
4839
4640
|
}
|
4840
|
-
|
4841
4641
|
if (isSyntheticShadowHost(this) && isDelegatingFocus(this)) {
|
4842
4642
|
hostElementFocus.call(this);
|
4843
4643
|
return;
|
4844
|
-
}
|
4644
|
+
}
|
4645
|
+
// Typescript does not like it when you treat the `arguments` object as an array
|
4845
4646
|
// @ts-ignore type-mismatch
|
4846
|
-
|
4847
|
-
|
4848
|
-
focus.apply(this, arguments); // Restore state by enabling if originally enabled
|
4849
|
-
|
4647
|
+
focus.apply(this, arguments);
|
4648
|
+
// Restore state by enabling if originally enabled
|
4850
4649
|
if (originallyEnabled) {
|
4851
4650
|
enableKeyboardFocusNavigationRoutines();
|
4852
4651
|
}
|
4853
|
-
}
|
4652
|
+
}
|
4653
|
+
// Non-deep-traversing patches: this descriptor map includes all descriptors that
|
4854
4654
|
// do not five access to nodes beyond the immediate children.
|
4855
|
-
|
4856
|
-
|
4857
4655
|
defineProperties(HTMLElement.prototype, {
|
4858
4656
|
tabIndex: {
|
4859
4657
|
get() {
|
4860
4658
|
if (isSyntheticShadowHost(this)) {
|
4861
4659
|
return tabIndexGetterPatched.call(this);
|
4862
4660
|
}
|
4863
|
-
|
4864
4661
|
return tabIndexGetter.call(this);
|
4865
4662
|
},
|
4866
|
-
|
4867
4663
|
set(v) {
|
4868
4664
|
if (isSyntheticShadowHost(this)) {
|
4869
4665
|
return tabIndexSetterPatched.call(this, v);
|
4870
4666
|
}
|
4871
|
-
|
4872
4667
|
return tabIndexSetter.call(this, v);
|
4873
4668
|
},
|
4874
|
-
|
4875
4669
|
enumerable: true,
|
4876
4670
|
configurable: true
|
4877
4671
|
},
|
@@ -4880,10 +4674,8 @@ defineProperties(HTMLElement.prototype, {
|
|
4880
4674
|
if (isSyntheticShadowHost(this)) {
|
4881
4675
|
return blurPatched.call(this);
|
4882
4676
|
}
|
4883
|
-
|
4884
4677
|
blur.call(this);
|
4885
4678
|
},
|
4886
|
-
|
4887
4679
|
enumerable: true,
|
4888
4680
|
writable: true,
|
4889
4681
|
configurable: true
|
@@ -4894,46 +4686,38 @@ defineProperties(HTMLElement.prototype, {
|
|
4894
4686
|
// @ts-ignore type-mismatch
|
4895
4687
|
focusPatched.apply(this, arguments);
|
4896
4688
|
},
|
4897
|
-
|
4898
4689
|
enumerable: true,
|
4899
4690
|
writable: true,
|
4900
4691
|
configurable: true
|
4901
4692
|
}
|
4902
|
-
});
|
4903
|
-
|
4693
|
+
});
|
4694
|
+
// Note: In JSDOM innerText is not implemented: https://github.com/jsdom/jsdom/issues/1245
|
4904
4695
|
if (innerTextGetter !== null && innerTextSetter !== null) {
|
4905
4696
|
defineProperty(HTMLElement.prototype, 'innerText', {
|
4906
4697
|
get() {
|
4907
4698
|
if (!lwcRuntimeFlags.ENABLE_INNER_OUTER_TEXT_PATCH) {
|
4908
4699
|
return innerTextGetter.call(this);
|
4909
4700
|
}
|
4910
|
-
|
4911
4701
|
if (!lwcRuntimeFlags.ENABLE_ELEMENT_PATCH) {
|
4912
4702
|
if (isNodeShadowed(this) || isSyntheticShadowHost(this)) {
|
4913
4703
|
return getInnerText(this);
|
4914
4704
|
}
|
4915
|
-
|
4916
4705
|
return innerTextGetter.call(this);
|
4917
|
-
}
|
4918
|
-
|
4919
|
-
|
4706
|
+
}
|
4707
|
+
// TODO [#1222]: remove global bypass
|
4920
4708
|
if (isGlobalPatchingSkipped(this)) {
|
4921
4709
|
return innerTextGetter.call(this);
|
4922
4710
|
}
|
4923
|
-
|
4924
4711
|
return getInnerText(this);
|
4925
4712
|
},
|
4926
|
-
|
4927
4713
|
set(v) {
|
4928
4714
|
innerTextSetter.call(this, v);
|
4929
4715
|
},
|
4930
|
-
|
4931
4716
|
enumerable: true,
|
4932
4717
|
configurable: true
|
4933
4718
|
});
|
4934
|
-
}
|
4935
|
-
|
4936
|
-
|
4719
|
+
}
|
4720
|
+
// Note: Firefox does not have outerText, https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/outerText
|
4937
4721
|
if (outerTextGetter !== null && outerTextSetter !== null) {
|
4938
4722
|
// From https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/outerText :
|
4939
4723
|
// HTMLElement.outerText is a non-standard property. As a getter, it returns the same value as Node.innerText.
|
@@ -4943,30 +4727,24 @@ if (outerTextGetter !== null && outerTextSetter !== null) {
|
|
4943
4727
|
if (!lwcRuntimeFlags.ENABLE_INNER_OUTER_TEXT_PATCH) {
|
4944
4728
|
return outerTextGetter.call(this);
|
4945
4729
|
}
|
4946
|
-
|
4947
4730
|
if (!lwcRuntimeFlags.ENABLE_ELEMENT_PATCH) {
|
4948
4731
|
if (isNodeShadowed(this) || isSyntheticShadowHost(this)) {
|
4949
4732
|
return getInnerText(this);
|
4950
4733
|
}
|
4951
|
-
|
4952
4734
|
return outerTextGetter.call(this);
|
4953
|
-
}
|
4954
|
-
|
4955
|
-
|
4735
|
+
}
|
4736
|
+
// TODO [#1222]: remove global bypass
|
4956
4737
|
if (isGlobalPatchingSkipped(this)) {
|
4957
4738
|
return outerTextGetter.call(this);
|
4958
4739
|
}
|
4959
|
-
|
4960
4740
|
return getInnerText(this);
|
4961
4741
|
},
|
4962
|
-
|
4963
4742
|
set(v) {
|
4964
4743
|
// Invoking the `outerText` setter on a host element should trigger its disconnection, but until we merge node reactions, it will not work.
|
4965
4744
|
// 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))
|
4966
4745
|
// but the benefits don't worth the efforts.
|
4967
4746
|
outerTextSetter.call(this, v);
|
4968
4747
|
},
|
4969
|
-
|
4970
4748
|
enumerable: true,
|
4971
4749
|
configurable: true
|
4972
4750
|
});
|
@@ -5152,16 +4930,14 @@ defineProperty(Element.prototype, '$domManual$', {
|
|
5152
4930
|
* SPDX-License-Identifier: MIT
|
5153
4931
|
* For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
|
5154
4932
|
*/
|
4933
|
+
// Only used in LWC's Karma tests
|
5155
4934
|
// @ts-ignore
|
5156
|
-
|
5157
4935
|
if (process.env.NODE_ENV !== 'production' && typeof __karma__ !== 'undefined') {
|
5158
4936
|
window.addEventListener('test-dummy-flag', () => {
|
5159
4937
|
let hasFlag = false;
|
5160
|
-
|
5161
4938
|
if (lwcRuntimeFlags.DUMMY_TEST_FLAG) {
|
5162
4939
|
hasFlag = true;
|
5163
4940
|
}
|
5164
|
-
|
5165
4941
|
window.dispatchEvent(new CustomEvent('has-dummy-flag', {
|
5166
4942
|
detail: {
|
5167
4943
|
package: '@lwc/synthetic-shadow',
|
@@ -5170,4 +4946,4 @@ if (process.env.NODE_ENV !== 'production' && typeof __karma__ !== 'undefined') {
|
|
5170
4946
|
}));
|
5171
4947
|
});
|
5172
4948
|
}
|
5173
|
-
/** version: 2.
|
4949
|
+
/** version: 2.30.0 */
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@lwc/synthetic-shadow",
|
3
|
-
"version": "2.
|
3
|
+
"version": "2.30.0",
|
4
4
|
"description": "Synthetic Shadow Root for LWC",
|
5
5
|
"homepage": "https://lwc.dev/",
|
6
6
|
"repository": {
|
@@ -36,8 +36,8 @@
|
|
36
36
|
"access": "public"
|
37
37
|
},
|
38
38
|
"devDependencies": {
|
39
|
-
"@lwc/features": "2.
|
40
|
-
"@lwc/shared": "2.
|
39
|
+
"@lwc/features": "2.30.0",
|
40
|
+
"@lwc/shared": "2.30.0"
|
41
41
|
},
|
42
42
|
"nx": {
|
43
43
|
"targets": {
|