@lwc/synthetic-shadow 2.37.0 → 2.37.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.
- package/dist/synthetic-shadow.js +211 -233
- package/package.json +3 -3
package/dist/synthetic-shadow.js
CHANGED
@@ -120,7 +120,16 @@ const KEY__NATIVE_QUERY_SELECTOR_ALL = '$nativeQuerySelectorAll$';
|
|
120
120
|
// We use this to detect symbol support in order to avoid the expensive symbol polyfill. Note that
|
121
121
|
// we can't use typeof since it will fail when transpiling.
|
122
122
|
const hasNativeSymbolSupport = /*@__PURE__*/ (() => Symbol('x').toString() === 'Symbol(x)')();
|
123
|
-
/** version: 2.37.
|
123
|
+
/** version: 2.37.1 */
|
124
|
+
|
125
|
+
/**
|
126
|
+
* Copyright (C) 2018 salesforce.com, inc.
|
127
|
+
*/
|
128
|
+
// eslint-disable-next-line no-restricted-properties
|
129
|
+
if (!_globalThis.lwcRuntimeFlags) {
|
130
|
+
Object.defineProperty(_globalThis, 'lwcRuntimeFlags', { value: create(null) });
|
131
|
+
}
|
132
|
+
/** version: 2.37.1 */
|
124
133
|
|
125
134
|
/*
|
126
135
|
* Copyright (c) 2018, salesforce.com, inc.
|
@@ -428,15 +437,6 @@ function arrayFromCollection(collection) {
|
|
428
437
|
const eventTargetPrototype = typeof EventTarget !== 'undefined' ? EventTarget.prototype : _Node.prototype;
|
429
438
|
const { addEventListener, dispatchEvent, removeEventListener } = eventTargetPrototype;
|
430
439
|
|
431
|
-
/**
|
432
|
-
* Copyright (C) 2018 salesforce.com, inc.
|
433
|
-
*/
|
434
|
-
if (!_globalThis.lwcRuntimeFlags) {
|
435
|
-
Object.defineProperty(_globalThis, 'lwcRuntimeFlags', { value: create(null) });
|
436
|
-
}
|
437
|
-
const lwcRuntimeFlags = _globalThis.lwcRuntimeFlags;
|
438
|
-
/** version: 2.37.0 */
|
439
|
-
|
440
440
|
/*
|
441
441
|
* Copyright (c) 2018, salesforce.com, inc.
|
442
442
|
* All rights reserved.
|
@@ -447,52 +447,46 @@ const lwcRuntimeFlags = _globalThis.lwcRuntimeFlags;
|
|
447
447
|
const HostElementKey = '$$HostElementKey$$';
|
448
448
|
const ShadowedNodeKey = '$$ShadowedNodeKey$$';
|
449
449
|
function fastDefineProperty(node, propName, config) {
|
450
|
-
|
451
|
-
|
452
|
-
|
453
|
-
|
454
|
-
|
455
|
-
|
456
|
-
|
457
|
-
|
458
|
-
|
459
|
-
|
460
|
-
}
|
450
|
+
const shadowedNode = node;
|
451
|
+
if (process.env.NODE_ENV !== 'production') {
|
452
|
+
// in dev, we are more restrictive
|
453
|
+
defineProperty(shadowedNode, propName, config);
|
454
|
+
}
|
455
|
+
else {
|
456
|
+
const { value } = config;
|
457
|
+
// in prod, we prioritize performance
|
458
|
+
shadowedNode[propName] = value;
|
459
|
+
}
|
461
460
|
}
|
462
461
|
function setNodeOwnerKey(node, value) {
|
463
|
-
|
464
|
-
value,
|
465
|
-
configurable: true
|
466
|
-
});
|
462
|
+
fastDefineProperty(node, HostElementKey, { value, configurable: true });
|
467
463
|
}
|
468
464
|
function setNodeKey(node, value) {
|
469
|
-
|
470
|
-
value
|
471
|
-
});
|
465
|
+
fastDefineProperty(node, ShadowedNodeKey, { value });
|
472
466
|
}
|
473
467
|
function getNodeOwnerKey(node) {
|
474
|
-
|
468
|
+
return node[HostElementKey];
|
475
469
|
}
|
476
470
|
function getNodeNearestOwnerKey(node) {
|
477
|
-
|
478
|
-
|
479
|
-
|
480
|
-
|
481
|
-
|
482
|
-
|
483
|
-
|
484
|
-
|
485
|
-
|
486
|
-
|
487
|
-
|
488
|
-
|
489
|
-
|
490
|
-
|
491
|
-
|
492
|
-
|
471
|
+
let host = node;
|
472
|
+
let hostKey;
|
473
|
+
// search for the first element with owner identity
|
474
|
+
// in case of manually inserted elements and elements slotted from Light DOM
|
475
|
+
while (!isNull(host)) {
|
476
|
+
hostKey = getNodeOwnerKey(host);
|
477
|
+
if (!isUndefined(hostKey)) {
|
478
|
+
return hostKey;
|
479
|
+
}
|
480
|
+
host = parentNodeGetter.call(host);
|
481
|
+
if (lwcRuntimeFlags.ENABLE_LIGHT_GET_ROOT_NODE_PATCH &&
|
482
|
+
!isNull(host) &&
|
483
|
+
isSyntheticSlotElement(host)) {
|
484
|
+
return undefined;
|
485
|
+
}
|
486
|
+
}
|
493
487
|
}
|
494
488
|
function getNodeKey(node) {
|
495
|
-
|
489
|
+
return node[ShadowedNodeKey];
|
496
490
|
}
|
497
491
|
/**
|
498
492
|
* This function does not traverse up for performance reasons, but is sufficient for most use
|
@@ -500,7 +494,7 @@ function getNodeKey(node) {
|
|
500
494
|
* isNodeDeepShadowed instead.
|
501
495
|
*/
|
502
496
|
function isNodeShadowed(node) {
|
503
|
-
|
497
|
+
return !isUndefined(getNodeOwnerKey(node));
|
504
498
|
}
|
505
499
|
|
506
500
|
/*
|
@@ -512,203 +506,209 @@ function isNodeShadowed(node) {
|
|
512
506
|
// when finding a slot in the DOM, we can fold it if it is contained
|
513
507
|
// inside another slot.
|
514
508
|
function foldSlotElement(slot) {
|
515
|
-
|
516
|
-
|
517
|
-
|
518
|
-
|
519
|
-
|
520
|
-
|
509
|
+
let parent = parentElementGetter.call(slot);
|
510
|
+
while (!isNull(parent) && isSlotElement(parent)) {
|
511
|
+
slot = parent;
|
512
|
+
parent = parentElementGetter.call(slot);
|
513
|
+
}
|
514
|
+
return slot;
|
521
515
|
}
|
522
516
|
function isNodeSlotted(host, node) {
|
523
|
-
|
524
|
-
|
525
|
-
|
526
|
-
|
527
|
-
|
528
|
-
|
529
|
-
|
530
|
-
|
531
|
-
|
532
|
-
|
533
|
-
|
534
|
-
|
535
|
-
|
536
|
-
|
537
|
-
|
538
|
-
|
539
|
-
|
540
|
-
|
541
|
-
|
542
|
-
|
543
|
-
|
544
|
-
|
545
|
-
|
546
|
-
|
547
|
-
|
548
|
-
|
549
|
-
|
550
|
-
|
551
|
-
|
552
|
-
|
553
|
-
|
554
|
-
|
555
|
-
|
556
|
-
|
557
|
-
|
558
|
-
|
559
|
-
|
560
|
-
|
561
|
-
|
562
|
-
|
563
|
-
|
564
|
-
|
565
|
-
|
566
|
-
|
567
|
-
|
568
|
-
|
569
|
-
|
517
|
+
if (process.env.NODE_ENV !== 'production') {
|
518
|
+
assert.invariant(host instanceof HTMLElement, `isNodeSlotted() should be called with a host as the first argument instead of ${host}`);
|
519
|
+
assert.invariant(node instanceof _Node, `isNodeSlotted() should be called with a node as the second argument instead of ${node}`);
|
520
|
+
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}`);
|
521
|
+
}
|
522
|
+
const hostKey = getNodeKey(host);
|
523
|
+
// this routine assumes that the node is coming from a different shadow (it is not owned by the host)
|
524
|
+
// just in case the provided node is not an element
|
525
|
+
let currentElement = node instanceof Element ? node : parentElementGetter.call(node);
|
526
|
+
while (!isNull(currentElement) && currentElement !== host) {
|
527
|
+
const elmOwnerKey = getNodeNearestOwnerKey(currentElement);
|
528
|
+
const parent = parentElementGetter.call(currentElement);
|
529
|
+
if (elmOwnerKey === hostKey) {
|
530
|
+
// we have reached an element inside the host's template, and only if
|
531
|
+
// that element is an slot, then the node is considered slotted
|
532
|
+
return isSlotElement(currentElement);
|
533
|
+
}
|
534
|
+
else if (parent === host) {
|
535
|
+
return false;
|
536
|
+
}
|
537
|
+
else if (!isNull(parent) && getNodeNearestOwnerKey(parent) !== elmOwnerKey) {
|
538
|
+
// we are crossing a boundary of some sort since the elm and its parent
|
539
|
+
// have different owner key. for slotted elements, this is possible
|
540
|
+
// if the parent happens to be a slot.
|
541
|
+
if (isSlotElement(parent)) {
|
542
|
+
/**
|
543
|
+
* the slot parent might be allocated inside another slot, think of:
|
544
|
+
* <x-root> (<--- root element)
|
545
|
+
* <x-parent> (<--- own by x-root)
|
546
|
+
* <x-child> (<--- own by x-root)
|
547
|
+
* <slot> (<--- own by x-child)
|
548
|
+
* <slot> (<--- own by x-parent)
|
549
|
+
* <div> (<--- own by x-root)
|
550
|
+
*
|
551
|
+
* while checking if x-parent has the div slotted, we need to traverse
|
552
|
+
* up, but when finding the first slot, we skip that one in favor of the
|
553
|
+
* most outer slot parent before jumping into its corresponding host.
|
554
|
+
*/
|
555
|
+
currentElement = getNodeOwner(foldSlotElement(parent));
|
556
|
+
if (!isNull(currentElement)) {
|
557
|
+
if (currentElement === host) {
|
558
|
+
// the slot element is a top level element inside the shadow
|
559
|
+
// of a host that was allocated into host in question
|
560
|
+
return true;
|
561
|
+
}
|
562
|
+
else if (getNodeNearestOwnerKey(currentElement) === hostKey) {
|
563
|
+
// the slot element is an element inside the shadow
|
564
|
+
// of a host that was allocated into host in question
|
565
|
+
return true;
|
566
|
+
}
|
567
|
+
}
|
568
|
+
}
|
569
|
+
else {
|
570
|
+
return false;
|
571
|
+
}
|
572
|
+
}
|
573
|
+
else {
|
574
|
+
currentElement = parent;
|
570
575
|
}
|
571
|
-
} else {
|
572
|
-
return false;
|
573
|
-
}
|
574
|
-
} else {
|
575
|
-
currentElement = parent;
|
576
576
|
}
|
577
|
-
|
578
|
-
return false;
|
577
|
+
return false;
|
579
578
|
}
|
580
579
|
function getNodeOwner(node) {
|
581
|
-
|
582
|
-
|
583
|
-
|
584
|
-
|
585
|
-
|
586
|
-
|
587
|
-
|
588
|
-
|
589
|
-
|
590
|
-
|
591
|
-
|
592
|
-
|
593
|
-
|
594
|
-
|
595
|
-
|
596
|
-
|
597
|
-
|
580
|
+
if (!(node instanceof _Node)) {
|
581
|
+
return null;
|
582
|
+
}
|
583
|
+
const ownerKey = getNodeNearestOwnerKey(node);
|
584
|
+
if (isUndefined(ownerKey)) {
|
585
|
+
return null;
|
586
|
+
}
|
587
|
+
let nodeOwner = node;
|
588
|
+
// At this point, node is a valid node with owner identity, now we need to find the owner node
|
589
|
+
// search for a custom element with a VM that owns the first element with owner identity attached to it
|
590
|
+
while (!isNull(nodeOwner) && getNodeKey(nodeOwner) !== ownerKey) {
|
591
|
+
nodeOwner = parentNodeGetter.call(nodeOwner);
|
592
|
+
}
|
593
|
+
if (isNull(nodeOwner)) {
|
594
|
+
return null;
|
595
|
+
}
|
596
|
+
return nodeOwner;
|
598
597
|
}
|
599
598
|
function isSyntheticSlotElement(node) {
|
600
|
-
|
599
|
+
return isSlotElement(node) && isNodeShadowed(node);
|
601
600
|
}
|
602
601
|
function isSlotElement(node) {
|
603
|
-
|
602
|
+
return node instanceof HTMLSlotElement;
|
604
603
|
}
|
605
604
|
function isNodeOwnedBy(owner, node) {
|
606
|
-
|
607
|
-
|
608
|
-
|
609
|
-
|
610
|
-
|
611
|
-
|
612
|
-
|
613
|
-
|
614
|
-
|
615
|
-
|
616
|
-
|
617
|
-
|
618
|
-
|
605
|
+
if (process.env.NODE_ENV !== 'production') {
|
606
|
+
assert.invariant(owner instanceof HTMLElement, `isNodeOwnedBy() should be called with an element as the first argument instead of ${owner}`);
|
607
|
+
assert.invariant(node instanceof _Node, `isNodeOwnedBy() should be called with a node as the second argument instead of ${node}`);
|
608
|
+
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}`);
|
609
|
+
}
|
610
|
+
const ownerKey = getNodeNearestOwnerKey(node);
|
611
|
+
if (isUndefined(ownerKey)) {
|
612
|
+
if (lwcRuntimeFlags.ENABLE_LIGHT_GET_ROOT_NODE_PATCH) {
|
613
|
+
// in case of root level light DOM element slotting into a synthetic shadow
|
614
|
+
const host = parentNodeGetter.call(node);
|
615
|
+
if (!isNull(host) && isSyntheticSlotElement(host)) {
|
616
|
+
return false;
|
617
|
+
}
|
618
|
+
}
|
619
|
+
// in case of manually inserted elements
|
620
|
+
return true;
|
619
621
|
}
|
620
|
-
|
621
|
-
return true;
|
622
|
-
}
|
623
|
-
return getNodeKey(owner) === ownerKey;
|
622
|
+
return getNodeKey(owner) === ownerKey;
|
624
623
|
}
|
625
624
|
function shadowRootChildNodes(root) {
|
626
|
-
|
627
|
-
|
625
|
+
const elm = getHost(root);
|
626
|
+
return getAllMatches(elm, arrayFromCollection(childNodesGetter.call(elm)));
|
628
627
|
}
|
629
628
|
function getAllSlottedMatches(host, nodeList) {
|
630
|
-
|
631
|
-
|
632
|
-
|
633
|
-
|
634
|
-
|
629
|
+
const filteredAndPatched = [];
|
630
|
+
for (let i = 0, len = nodeList.length; i < len; i += 1) {
|
631
|
+
const node = nodeList[i];
|
632
|
+
if (!isNodeOwnedBy(host, node) && isNodeSlotted(host, node)) {
|
633
|
+
ArrayPush.call(filteredAndPatched, node);
|
634
|
+
}
|
635
635
|
}
|
636
|
-
|
637
|
-
return filteredAndPatched;
|
636
|
+
return filteredAndPatched;
|
638
637
|
}
|
639
638
|
function getFirstSlottedMatch(host, nodeList) {
|
640
|
-
|
641
|
-
|
642
|
-
|
643
|
-
|
639
|
+
for (let i = 0, len = nodeList.length; i < len; i += 1) {
|
640
|
+
const node = nodeList[i];
|
641
|
+
if (!isNodeOwnedBy(host, node) && isNodeSlotted(host, node)) {
|
642
|
+
return node;
|
643
|
+
}
|
644
644
|
}
|
645
|
-
|
646
|
-
return null;
|
645
|
+
return null;
|
647
646
|
}
|
648
647
|
function getAllMatches(owner, nodeList) {
|
649
|
-
|
650
|
-
|
651
|
-
|
652
|
-
|
653
|
-
|
654
|
-
|
655
|
-
|
656
|
-
|
657
|
-
|
658
|
-
|
659
|
-
|
648
|
+
const filteredAndPatched = [];
|
649
|
+
for (let i = 0, len = nodeList.length; i < len; i += 1) {
|
650
|
+
const node = nodeList[i];
|
651
|
+
const isOwned = isNodeOwnedBy(owner, node);
|
652
|
+
if (isOwned) {
|
653
|
+
// Patch querySelector, querySelectorAll, etc
|
654
|
+
// if element is owned by VM
|
655
|
+
ArrayPush.call(filteredAndPatched, node);
|
656
|
+
}
|
657
|
+
}
|
658
|
+
return filteredAndPatched;
|
660
659
|
}
|
661
660
|
function getFirstMatch(owner, nodeList) {
|
662
|
-
|
663
|
-
|
664
|
-
|
661
|
+
for (let i = 0, len = nodeList.length; i < len; i += 1) {
|
662
|
+
if (isNodeOwnedBy(owner, nodeList[i])) {
|
663
|
+
return nodeList[i];
|
664
|
+
}
|
665
665
|
}
|
666
|
-
|
667
|
-
return null;
|
666
|
+
return null;
|
668
667
|
}
|
669
668
|
function shadowRootQuerySelector(root, selector) {
|
670
|
-
|
671
|
-
|
672
|
-
|
669
|
+
const elm = getHost(root);
|
670
|
+
const nodeList = arrayFromCollection(querySelectorAll$1.call(elm, selector));
|
671
|
+
return getFirstMatch(elm, nodeList);
|
673
672
|
}
|
674
673
|
function shadowRootQuerySelectorAll(root, selector) {
|
675
|
-
|
676
|
-
|
677
|
-
|
674
|
+
const elm = getHost(root);
|
675
|
+
const nodeList = querySelectorAll$1.call(elm, selector);
|
676
|
+
return getAllMatches(elm, arrayFromCollection(nodeList));
|
678
677
|
}
|
679
678
|
function getFilteredChildNodes(node) {
|
680
|
-
|
681
|
-
|
682
|
-
|
683
|
-
|
684
|
-
|
685
|
-
|
686
|
-
|
687
|
-
|
688
|
-
|
689
|
-
|
690
|
-
|
691
|
-
|
692
|
-
|
693
|
-
|
694
|
-
|
695
|
-
|
696
|
-
|
697
|
-
|
698
|
-
|
699
|
-
|
700
|
-
|
701
|
-
|
702
|
-
|
703
|
-
|
679
|
+
if (!isSyntheticShadowHost(node) && !isSlotElement(node)) {
|
680
|
+
// regular element - fast path
|
681
|
+
const children = childNodesGetter.call(node);
|
682
|
+
return arrayFromCollection(children);
|
683
|
+
}
|
684
|
+
if (isSyntheticShadowHost(node)) {
|
685
|
+
// we need to get only the nodes that were slotted
|
686
|
+
const slots = arrayFromCollection(querySelectorAll$1.call(node, 'slot'));
|
687
|
+
const resolver = getShadowRootResolver(getShadowRoot(node));
|
688
|
+
// Typescript is inferring the wrong function type for this particular
|
689
|
+
// overloaded method: https://github.com/Microsoft/TypeScript/issues/27972
|
690
|
+
// @ts-ignore type-mismatch
|
691
|
+
return ArrayReduce.call(slots, (seed, slot) => {
|
692
|
+
if (resolver === getShadowRootResolver(slot)) {
|
693
|
+
ArrayPush.apply(seed, getFilteredSlotAssignedNodes(slot));
|
694
|
+
}
|
695
|
+
return seed;
|
696
|
+
}, []);
|
697
|
+
}
|
698
|
+
else {
|
699
|
+
// slot element
|
700
|
+
const children = arrayFromCollection(childNodesGetter.call(node));
|
701
|
+
const resolver = getShadowRootResolver(node);
|
702
|
+
return ArrayFilter.call(children, (child) => resolver === getShadowRootResolver(child));
|
703
|
+
}
|
704
704
|
}
|
705
705
|
function getFilteredSlotAssignedNodes(slot) {
|
706
|
-
|
707
|
-
|
708
|
-
|
709
|
-
|
710
|
-
|
711
|
-
|
706
|
+
const owner = getNodeOwner(slot);
|
707
|
+
if (isNull(owner)) {
|
708
|
+
return [];
|
709
|
+
}
|
710
|
+
const childNodes = arrayFromCollection(childNodesGetter.call(slot));
|
711
|
+
return ArrayFilter.call(childNodes, (child) => !isNodeShadowed(child) || !isNodeOwnedBy(owner, child));
|
712
712
|
}
|
713
713
|
|
714
714
|
/*
|
@@ -4674,26 +4674,4 @@ defineProperty(Element.prototype, '$domManual$', {
|
|
4674
4674
|
},
|
4675
4675
|
configurable: true,
|
4676
4676
|
});
|
4677
|
-
|
4678
|
-
/*
|
4679
|
-
* Copyright (c) 2018, salesforce.com, inc.
|
4680
|
-
* All rights reserved.
|
4681
|
-
* SPDX-License-Identifier: MIT
|
4682
|
-
* For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
|
4683
|
-
*/
|
4684
|
-
// Only used in LWC's Karma tests
|
4685
|
-
if (process.env.NODE_ENV === 'test-karma-lwc') {
|
4686
|
-
window.addEventListener('test-dummy-flag', () => {
|
4687
|
-
let hasFlag = false;
|
4688
|
-
if (lwcRuntimeFlags.DUMMY_TEST_FLAG) {
|
4689
|
-
hasFlag = true;
|
4690
|
-
}
|
4691
|
-
window.dispatchEvent(new CustomEvent('has-dummy-flag', {
|
4692
|
-
detail: {
|
4693
|
-
package: '@lwc/synthetic-shadow',
|
4694
|
-
hasFlag
|
4695
|
-
}
|
4696
|
-
}));
|
4697
|
-
});
|
4698
|
-
}
|
4699
|
-
/** version: 2.37.0 */
|
4677
|
+
/** version: 2.37.1 */
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@lwc/synthetic-shadow",
|
3
|
-
"version": "2.37.
|
3
|
+
"version": "2.37.1",
|
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.37.
|
40
|
-
"@lwc/shared": "2.37.
|
39
|
+
"@lwc/features": "2.37.1",
|
40
|
+
"@lwc/shared": "2.37.1"
|
41
41
|
},
|
42
42
|
"nx": {
|
43
43
|
"targets": {
|