@lwc/engine-core 2.11.0 → 2.11.4
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/engine-core.cjs.js +332 -257
- package/dist/engine-core.js +333 -258
- package/package.json +4 -5
- package/types/framework/component.d.ts +2 -2
- package/types/framework/hydration.d.ts +1 -2
- package/types/framework/main.d.ts +2 -1
- package/types/framework/rendering.d.ts +3 -1
- package/types/framework/vm.d.ts +1 -2
package/dist/engine-core.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/* proxy-compat-disable */
|
|
2
|
-
import { seal, create, isFunction as isFunction$1, ArrayPush as ArrayPush$1, isUndefined as isUndefined$1, ArrayIndexOf, ArraySplice, StringToLowerCase, ArrayJoin, isNull, isFrozen, defineProperty, assign, forEach, keys, AriaPropNameToAttrNameMap, getPropertyDescriptor, defineProperties, getOwnPropertyNames as getOwnPropertyNames$1, getPrototypeOf as getPrototypeOf$1, setPrototypeOf, isObject, assert, KEY__SYNTHETIC_MODE, toString as toString$1, isFalse, isTrue, getOwnPropertyDescriptor as getOwnPropertyDescriptor$1, LWC_VERSION_COMMENT_REGEX, LWC_VERSION, freeze, htmlPropertyToAttribute, ArraySlice, hasOwnProperty as hasOwnProperty$1, StringCharCodeAt, XML_NAMESPACE, XLINK_NAMESPACE, isString, StringSlice, SVG_NAMESPACE, KEY__SHADOW_RESOLVER, isArray as isArray$1, isNumber, StringReplace, KEY__SCOPED_CSS, noop, ArrayUnshift
|
|
2
|
+
import { seal, create, isFunction as isFunction$1, ArrayPush as ArrayPush$1, isUndefined as isUndefined$1, ArrayIndexOf, ArraySplice, StringToLowerCase, ArrayJoin, isNull, isFrozen, defineProperty, assign, forEach, keys, AriaPropNameToAttrNameMap, getPropertyDescriptor, defineProperties, getOwnPropertyNames as getOwnPropertyNames$1, getPrototypeOf as getPrototypeOf$1, setPrototypeOf, isObject, assert, KEY__SYNTHETIC_MODE, toString as toString$1, isFalse, isTrue, getOwnPropertyDescriptor as getOwnPropertyDescriptor$1, LWC_VERSION_COMMENT_REGEX, LWC_VERSION, freeze, htmlPropertyToAttribute, ArraySlice, hasOwnProperty as hasOwnProperty$1, StringCharCodeAt, XML_NAMESPACE, XLINK_NAMESPACE, isString, StringSlice, SVG_NAMESPACE, KEY__SHADOW_RESOLVER, isArray as isArray$1, isNumber, StringReplace, KEY__SCOPED_CSS, noop, ArrayUnshift } from '@lwc/shared';
|
|
3
3
|
import { runtimeFlags } from '@lwc/features';
|
|
4
4
|
export { setFeatureFlag, setFeatureFlagForTest } from '@lwc/features';
|
|
5
5
|
|
|
@@ -2304,6 +2304,12 @@ function checkVersionMismatch(func, type) {
|
|
|
2304
2304
|
}
|
|
2305
2305
|
}
|
|
2306
2306
|
|
|
2307
|
+
/*
|
|
2308
|
+
* Copyright (c) 2018, salesforce.com, inc.
|
|
2309
|
+
* All rights reserved.
|
|
2310
|
+
* SPDX-License-Identifier: MIT
|
|
2311
|
+
* For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
|
|
2312
|
+
*/
|
|
2307
2313
|
const signedTemplateSet = new Set();
|
|
2308
2314
|
function defaultEmptyTemplate() {
|
|
2309
2315
|
return [];
|
|
@@ -2321,6 +2327,30 @@ function registerTemplate(tpl) {
|
|
|
2321
2327
|
checkVersionMismatch(tpl, 'template');
|
|
2322
2328
|
}
|
|
2323
2329
|
signedTemplateSet.add(tpl);
|
|
2330
|
+
// FIXME[@W-10950976]: the template object should be frozen, and it should not be possible to set
|
|
2331
|
+
// the stylesheets or stylesheetToken(s). For backwards compat, though, we shim stylesheetTokens
|
|
2332
|
+
// on top of stylesheetToken for anyone who is accessing the old internal API.
|
|
2333
|
+
// Details: https://salesforce.quip.com/v1rmAFu2cKAr
|
|
2334
|
+
defineProperty(tpl, 'stylesheetTokens', {
|
|
2335
|
+
get() {
|
|
2336
|
+
const { stylesheetToken } = this;
|
|
2337
|
+
if (isUndefined$1(stylesheetToken)) {
|
|
2338
|
+
return stylesheetToken;
|
|
2339
|
+
}
|
|
2340
|
+
// Shim for the old `stylesheetTokens` property
|
|
2341
|
+
// See https://github.com/salesforce/lwc/pull/2332/files#diff-7901555acef29969adaa6583185b3e9bce475cdc6f23e799a54e0018cb18abaa
|
|
2342
|
+
return {
|
|
2343
|
+
hostAttribute: `${stylesheetToken}-host`,
|
|
2344
|
+
shadowAttribute: stylesheetToken,
|
|
2345
|
+
};
|
|
2346
|
+
},
|
|
2347
|
+
set(value) {
|
|
2348
|
+
// If the value is null or some other exotic object, you would be broken anyway in the past
|
|
2349
|
+
// because the engine would try to access hostAttribute/shadowAttribute, which would throw an error.
|
|
2350
|
+
// However it may be undefined in newer versions of LWC, so we need to guard against that case.
|
|
2351
|
+
this.stylesheetToken = isUndefined$1(value) ? undefined : value.shadowAttribute;
|
|
2352
|
+
},
|
|
2353
|
+
});
|
|
2324
2354
|
// chaining this method as a way to wrap existing
|
|
2325
2355
|
// assignment of templates easily, without too much transformation
|
|
2326
2356
|
return tpl;
|
|
@@ -4702,11 +4732,15 @@ const signedTemplateMap = new Map();
|
|
|
4702
4732
|
* INTERNAL: This function can only be invoked by compiled code. The compiler
|
|
4703
4733
|
* will prevent this function from being imported by userland code.
|
|
4704
4734
|
*/
|
|
4705
|
-
function registerComponent(
|
|
4706
|
-
|
|
4707
|
-
|
|
4735
|
+
function registerComponent(
|
|
4736
|
+
// We typically expect a LightningElementConstructor, but technically you can call this with anything
|
|
4737
|
+
Ctor, { tmpl }) {
|
|
4738
|
+
if (isFunction$1(Ctor)) {
|
|
4739
|
+
if (process.env.NODE_ENV !== 'production') {
|
|
4740
|
+
checkVersionMismatch(Ctor, 'component');
|
|
4741
|
+
}
|
|
4742
|
+
signedTemplateMap.set(Ctor, tmpl);
|
|
4708
4743
|
}
|
|
4709
|
-
signedTemplateMap.set(Ctor, tmpl);
|
|
4710
4744
|
// chaining this method as a way to wrap existing assignment of component constructor easily,
|
|
4711
4745
|
// without too much transformation
|
|
4712
4746
|
return Ctor;
|
|
@@ -4795,236 +4829,6 @@ function invokeServiceHook(vm, cbs) {
|
|
|
4795
4829
|
}
|
|
4796
4830
|
}
|
|
4797
4831
|
|
|
4798
|
-
/*
|
|
4799
|
-
* Copyright (c) 2022, salesforce.com, inc.
|
|
4800
|
-
* All rights reserved.
|
|
4801
|
-
* SPDX-License-Identifier: MIT
|
|
4802
|
-
* For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
|
|
4803
|
-
*/
|
|
4804
|
-
function hydrate(vnode, node) {
|
|
4805
|
-
switch (vnode.type) {
|
|
4806
|
-
case 0 /* Text */:
|
|
4807
|
-
hydrateText(vnode, node);
|
|
4808
|
-
break;
|
|
4809
|
-
case 1 /* Comment */:
|
|
4810
|
-
hydrateComment(vnode, node);
|
|
4811
|
-
break;
|
|
4812
|
-
case 2 /* Element */:
|
|
4813
|
-
hydrateElement(vnode, node);
|
|
4814
|
-
break;
|
|
4815
|
-
case 3 /* CustomElement */:
|
|
4816
|
-
hydrateCustomElement(vnode, node);
|
|
4817
|
-
break;
|
|
4818
|
-
}
|
|
4819
|
-
}
|
|
4820
|
-
function hydrateText(vnode, node) {
|
|
4821
|
-
var _a;
|
|
4822
|
-
if (process.env.NODE_ENV !== 'production') {
|
|
4823
|
-
validateNodeType(vnode, node, 3 /* TEXT */);
|
|
4824
|
-
const nodeValue = getProperty(node, 'nodeValue');
|
|
4825
|
-
if (nodeValue !== vnode.text && !(nodeValue === '\u200D' && vnode.text === '')) {
|
|
4826
|
-
logWarn('Hydration mismatch: text values do not match, will recover from the difference', vnode.owner);
|
|
4827
|
-
}
|
|
4828
|
-
}
|
|
4829
|
-
// always set the text value to the one from the vnode.
|
|
4830
|
-
setText(node, (_a = vnode.text) !== null && _a !== void 0 ? _a : null);
|
|
4831
|
-
vnode.elm = node;
|
|
4832
|
-
}
|
|
4833
|
-
function hydrateComment(vnode, node) {
|
|
4834
|
-
var _a;
|
|
4835
|
-
if (process.env.NODE_ENV !== 'production') {
|
|
4836
|
-
validateNodeType(vnode, node, 8 /* COMMENT */);
|
|
4837
|
-
if (getProperty(node, 'nodeValue') !== vnode.text) {
|
|
4838
|
-
logWarn('Hydration mismatch: comment values do not match, will recover from the difference', vnode.owner);
|
|
4839
|
-
}
|
|
4840
|
-
}
|
|
4841
|
-
// always set the text value to the one from the vnode.
|
|
4842
|
-
setProperty(node, 'nodeValue', (_a = vnode.text) !== null && _a !== void 0 ? _a : null);
|
|
4843
|
-
vnode.elm = node;
|
|
4844
|
-
}
|
|
4845
|
-
function hydrateElement(vnode, node) {
|
|
4846
|
-
if (process.env.NODE_ENV !== 'production') {
|
|
4847
|
-
validateNodeType(vnode, node, 1 /* ELEMENT */);
|
|
4848
|
-
validateElement(vnode, node);
|
|
4849
|
-
}
|
|
4850
|
-
const elm = node;
|
|
4851
|
-
vnode.elm = elm;
|
|
4852
|
-
const { context } = vnode.data;
|
|
4853
|
-
const isDomManual = Boolean(!isUndefined$1(context) && !isUndefined$1(context.lwc) && context.lwc.dom === "manual" /* Manual */);
|
|
4854
|
-
if (isDomManual) {
|
|
4855
|
-
// it may be that this element has lwc:inner-html, we need to diff and in case are the same,
|
|
4856
|
-
// remove the innerHTML from props so it reuses the existing dom elements.
|
|
4857
|
-
const { props } = vnode.data;
|
|
4858
|
-
if (!isUndefined$1(props) && !isUndefined$1(props.innerHTML)) {
|
|
4859
|
-
if (getProperty(elm, 'innerHTML') === props.innerHTML) {
|
|
4860
|
-
// Do a shallow clone since VNodeData may be shared across VNodes due to hoist optimization
|
|
4861
|
-
vnode.data = Object.assign(Object.assign({}, vnode.data), { props: cloneAndOmitKey(props, 'innerHTML') });
|
|
4862
|
-
}
|
|
4863
|
-
else {
|
|
4864
|
-
logWarn(`Mismatch hydrating element <${getProperty(elm, 'tagName').toLowerCase()}>: innerHTML values do not match for element, will recover from the difference`, vnode.owner);
|
|
4865
|
-
}
|
|
4866
|
-
}
|
|
4867
|
-
}
|
|
4868
|
-
patchElementPropsAndAttrs(vnode);
|
|
4869
|
-
if (!isDomManual) {
|
|
4870
|
-
hydrateChildren(getChildNodes(vnode.elm), vnode.children, vnode.owner);
|
|
4871
|
-
}
|
|
4872
|
-
}
|
|
4873
|
-
function hydrateCustomElement(vnode, node) {
|
|
4874
|
-
if (process.env.NODE_ENV !== 'production') {
|
|
4875
|
-
validateNodeType(vnode, node, 1 /* ELEMENT */);
|
|
4876
|
-
validateElement(vnode, node);
|
|
4877
|
-
}
|
|
4878
|
-
const elm = node;
|
|
4879
|
-
const { sel, mode, ctor, owner } = vnode;
|
|
4880
|
-
const vm = createVM(elm, ctor, {
|
|
4881
|
-
mode,
|
|
4882
|
-
owner,
|
|
4883
|
-
tagName: sel,
|
|
4884
|
-
});
|
|
4885
|
-
vnode.elm = elm;
|
|
4886
|
-
vnode.vm = vm;
|
|
4887
|
-
allocateChildren(vnode, vm);
|
|
4888
|
-
patchElementPropsAndAttrs(vnode);
|
|
4889
|
-
// Insert hook section:
|
|
4890
|
-
if (process.env.NODE_ENV !== 'production') {
|
|
4891
|
-
assert.isTrue(vm.state === 0 /* created */, `${vm} cannot be recycled.`);
|
|
4892
|
-
}
|
|
4893
|
-
runConnectedCallback(vm);
|
|
4894
|
-
if (vm.renderMode !== 0 /* Light */) {
|
|
4895
|
-
// VM is not rendering in Light DOM, we can proceed and hydrate the slotted content.
|
|
4896
|
-
// Note: for Light DOM, this is handled while hydrating the VM
|
|
4897
|
-
hydrateChildren(getChildNodes(vnode.elm), vnode.children, vm);
|
|
4898
|
-
}
|
|
4899
|
-
hydrateVM(vm);
|
|
4900
|
-
}
|
|
4901
|
-
function hydrateChildren(elmChildren, children, vm) {
|
|
4902
|
-
if (process.env.NODE_ENV !== 'production') {
|
|
4903
|
-
const filteredVNodes = ArrayFilter.call(children, (vnode) => !!vnode);
|
|
4904
|
-
if (elmChildren.length !== filteredVNodes.length) {
|
|
4905
|
-
logError(`Hydration mismatch: incorrect number of rendered nodes, expected ${filteredVNodes.length} but found ${elmChildren.length}.`, vm);
|
|
4906
|
-
throwHydrationError();
|
|
4907
|
-
}
|
|
4908
|
-
}
|
|
4909
|
-
let childNodeIndex = 0;
|
|
4910
|
-
for (let i = 0; i < children.length; i++) {
|
|
4911
|
-
const childVnode = children[i];
|
|
4912
|
-
if (!isNull(childVnode)) {
|
|
4913
|
-
const childNode = elmChildren[childNodeIndex];
|
|
4914
|
-
hydrate(childVnode, childNode);
|
|
4915
|
-
childNodeIndex++;
|
|
4916
|
-
}
|
|
4917
|
-
}
|
|
4918
|
-
}
|
|
4919
|
-
function patchElementPropsAndAttrs(vnode) {
|
|
4920
|
-
applyEventListeners(vnode);
|
|
4921
|
-
patchProps(null, vnode);
|
|
4922
|
-
}
|
|
4923
|
-
function throwHydrationError() {
|
|
4924
|
-
assert.fail('Server rendered elements do not match client side generated elements');
|
|
4925
|
-
}
|
|
4926
|
-
function validateNodeType(vnode, node, nodeType) {
|
|
4927
|
-
if (getProperty(node, 'nodeType') !== nodeType) {
|
|
4928
|
-
logError('Hydration mismatch: incorrect node type received', vnode.owner);
|
|
4929
|
-
assert.fail('Hydration mismatch: incorrect node type received.');
|
|
4930
|
-
}
|
|
4931
|
-
}
|
|
4932
|
-
function validateElement(vnode, elm) {
|
|
4933
|
-
if (vnode.sel.toLowerCase() !== getProperty(elm, 'tagName').toLowerCase()) {
|
|
4934
|
-
logError(`Hydration mismatch: expecting element with tag "${vnode.sel.toLowerCase()}" but found "${getProperty(elm, 'tagName').toLowerCase()}".`, vnode.owner);
|
|
4935
|
-
throwHydrationError();
|
|
4936
|
-
}
|
|
4937
|
-
const hasIncompatibleAttrs = validateAttrs(vnode, elm);
|
|
4938
|
-
const hasIncompatibleClass = validateClassAttr(vnode, elm);
|
|
4939
|
-
const hasIncompatibleStyle = validateStyleAttr(vnode, elm);
|
|
4940
|
-
const isVNodeAndElementCompatible = hasIncompatibleAttrs && hasIncompatibleClass && hasIncompatibleStyle;
|
|
4941
|
-
if (!isVNodeAndElementCompatible) {
|
|
4942
|
-
throwHydrationError();
|
|
4943
|
-
}
|
|
4944
|
-
}
|
|
4945
|
-
function validateAttrs(vnode, elm) {
|
|
4946
|
-
const { data: { attrs = {} }, } = vnode;
|
|
4947
|
-
let nodesAreCompatible = true;
|
|
4948
|
-
// Validate attributes, though we could always recovery from those by running the update mods.
|
|
4949
|
-
// Note: intentionally ONLY matching vnodes.attrs to elm.attrs, in case SSR is adding extra attributes.
|
|
4950
|
-
for (const [attrName, attrValue] of Object.entries(attrs)) {
|
|
4951
|
-
const elmAttrValue = getAttribute(elm, attrName);
|
|
4952
|
-
if (String(attrValue) !== elmAttrValue) {
|
|
4953
|
-
logError(`Mismatch hydrating element <${getProperty(elm, 'tagName').toLowerCase()}>: attribute "${attrName}" has different values, expected "${attrValue}" but found "${elmAttrValue}"`, vnode.owner);
|
|
4954
|
-
nodesAreCompatible = false;
|
|
4955
|
-
}
|
|
4956
|
-
}
|
|
4957
|
-
return nodesAreCompatible;
|
|
4958
|
-
}
|
|
4959
|
-
function validateClassAttr(vnode, elm) {
|
|
4960
|
-
const { data: { className, classMap }, } = vnode;
|
|
4961
|
-
let nodesAreCompatible = true;
|
|
4962
|
-
let vnodeClassName;
|
|
4963
|
-
if (!isUndefined$1(className) && String(className) !== getProperty(elm, 'className')) {
|
|
4964
|
-
// className is used when class is bound to an expr.
|
|
4965
|
-
nodesAreCompatible = false;
|
|
4966
|
-
vnodeClassName = className;
|
|
4967
|
-
}
|
|
4968
|
-
else if (!isUndefined$1(classMap)) {
|
|
4969
|
-
// classMap is used when class is set to static value.
|
|
4970
|
-
const classList = getClassList(elm);
|
|
4971
|
-
let computedClassName = '';
|
|
4972
|
-
// all classes from the vnode should be in the element.classList
|
|
4973
|
-
for (const name in classMap) {
|
|
4974
|
-
computedClassName += ' ' + name;
|
|
4975
|
-
if (!classList.contains(name)) {
|
|
4976
|
-
nodesAreCompatible = false;
|
|
4977
|
-
}
|
|
4978
|
-
}
|
|
4979
|
-
vnodeClassName = computedClassName.trim();
|
|
4980
|
-
if (classList.length > keys(classMap).length) {
|
|
4981
|
-
nodesAreCompatible = false;
|
|
4982
|
-
}
|
|
4983
|
-
}
|
|
4984
|
-
if (!nodesAreCompatible) {
|
|
4985
|
-
logError(`Mismatch hydrating element <${getProperty(elm, 'tagName').toLowerCase()}>: attribute "class" has different values, expected "${vnodeClassName}" but found "${getProperty(elm, 'className')}"`, vnode.owner);
|
|
4986
|
-
}
|
|
4987
|
-
return nodesAreCompatible;
|
|
4988
|
-
}
|
|
4989
|
-
function validateStyleAttr(vnode, elm) {
|
|
4990
|
-
const { data: { style, styleDecls }, } = vnode;
|
|
4991
|
-
const elmStyle = getAttribute(elm, 'style') || '';
|
|
4992
|
-
let vnodeStyle;
|
|
4993
|
-
let nodesAreCompatible = true;
|
|
4994
|
-
if (!isUndefined$1(style) && style !== elmStyle) {
|
|
4995
|
-
nodesAreCompatible = false;
|
|
4996
|
-
vnodeStyle = style;
|
|
4997
|
-
}
|
|
4998
|
-
else if (!isUndefined$1(styleDecls)) {
|
|
4999
|
-
const parsedVnodeStyle = parseStyleText(elmStyle);
|
|
5000
|
-
const expectedStyle = [];
|
|
5001
|
-
// styleMap is used when style is set to static value.
|
|
5002
|
-
for (let i = 0, n = styleDecls.length; i < n; i++) {
|
|
5003
|
-
const [prop, value, important] = styleDecls[i];
|
|
5004
|
-
expectedStyle.push(`${prop}: ${value + (important ? ' important!' : '')}`);
|
|
5005
|
-
const parsedPropValue = parsedVnodeStyle[prop];
|
|
5006
|
-
if (isUndefined$1(parsedPropValue)) {
|
|
5007
|
-
nodesAreCompatible = false;
|
|
5008
|
-
}
|
|
5009
|
-
else if (!parsedPropValue.startsWith(value)) {
|
|
5010
|
-
nodesAreCompatible = false;
|
|
5011
|
-
}
|
|
5012
|
-
else if (important && !parsedPropValue.endsWith('!important')) {
|
|
5013
|
-
nodesAreCompatible = false;
|
|
5014
|
-
}
|
|
5015
|
-
}
|
|
5016
|
-
if (keys(parsedVnodeStyle).length > styleDecls.length) {
|
|
5017
|
-
nodesAreCompatible = false;
|
|
5018
|
-
}
|
|
5019
|
-
vnodeStyle = ArrayJoin.call(expectedStyle, ';');
|
|
5020
|
-
}
|
|
5021
|
-
if (!nodesAreCompatible) {
|
|
5022
|
-
// style is used when class is bound to an expr.
|
|
5023
|
-
logError(`Mismatch hydrating element <${getProperty(elm, 'tagName').toLowerCase()}>: attribute "style" has different values, expected "${vnodeStyle}" but found "${elmStyle}".`, vnode.owner);
|
|
5024
|
-
}
|
|
5025
|
-
return nodesAreCompatible;
|
|
5026
|
-
}
|
|
5027
|
-
|
|
5028
4832
|
/*
|
|
5029
4833
|
* Copyright (c) 2018, salesforce.com, inc.
|
|
5030
4834
|
* All rights reserved.
|
|
@@ -5070,32 +4874,12 @@ function connectRootElement(elm) {
|
|
|
5070
4874
|
/* GlobalHydrate */
|
|
5071
4875
|
, vm);
|
|
5072
4876
|
}
|
|
5073
|
-
function hydrateRootElement(elm) {
|
|
5074
|
-
const vm = getAssociatedVM(elm);
|
|
5075
|
-
runConnectedCallback(vm);
|
|
5076
|
-
hydrateVM(vm);
|
|
5077
|
-
}
|
|
5078
4877
|
function disconnectRootElement(elm) {
|
|
5079
4878
|
const vm = getAssociatedVM(elm);
|
|
5080
4879
|
resetComponentStateWhenRemoved(vm);
|
|
5081
4880
|
}
|
|
5082
4881
|
function appendVM(vm) {
|
|
5083
4882
|
rehydrate(vm);
|
|
5084
|
-
}
|
|
5085
|
-
function hydrateVM(vm) {
|
|
5086
|
-
if (isTrue(vm.isDirty)) {
|
|
5087
|
-
// manually diffing/patching here.
|
|
5088
|
-
// This routine is:
|
|
5089
|
-
// patchShadowRoot(vm, children);
|
|
5090
|
-
// -> addVnodes.
|
|
5091
|
-
const children = renderComponent(vm);
|
|
5092
|
-
vm.children = children;
|
|
5093
|
-
const vmChildren = vm.renderMode === 0
|
|
5094
|
-
/* Light */
|
|
5095
|
-
? getChildNodes(vm.elm) : getChildNodes(vm.elm.shadowRoot);
|
|
5096
|
-
hydrateChildren(vmChildren, children, vm);
|
|
5097
|
-
runRenderedCallback(vm);
|
|
5098
|
-
}
|
|
5099
4883
|
} // just in case the component comes back, with this we guarantee re-rendering it
|
|
5100
4884
|
// while preventing any attempt to rehydration until after reinsertion.
|
|
5101
4885
|
|
|
@@ -5400,7 +5184,6 @@ function runRenderedCallback(vm) {
|
|
|
5400
5184
|
, vm);
|
|
5401
5185
|
}
|
|
5402
5186
|
}
|
|
5403
|
-
|
|
5404
5187
|
let rehydrateQueue = [];
|
|
5405
5188
|
|
|
5406
5189
|
function flushRehydrationQueue() {
|
|
@@ -6057,6 +5840,298 @@ function readonly(obj) {
|
|
|
6057
5840
|
return reactiveMembrane.getReadOnlyProxy(obj);
|
|
6058
5841
|
}
|
|
6059
5842
|
|
|
5843
|
+
/*
|
|
5844
|
+
* Copyright (c) 2022, salesforce.com, inc.
|
|
5845
|
+
* All rights reserved.
|
|
5846
|
+
* SPDX-License-Identifier: MIT
|
|
5847
|
+
* For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
|
|
5848
|
+
*/
|
|
5849
|
+
// flag indicating if the hydration recovered from the DOM mismatch
|
|
5850
|
+
let hasMismatch = false;
|
|
5851
|
+
function hydrateRoot(vm) {
|
|
5852
|
+
hasMismatch = false;
|
|
5853
|
+
runConnectedCallback(vm);
|
|
5854
|
+
hydrateVM(vm);
|
|
5855
|
+
if (hasMismatch) {
|
|
5856
|
+
logError('Hydration completed with errors.', vm);
|
|
5857
|
+
}
|
|
5858
|
+
}
|
|
5859
|
+
function hydrateVM(vm) {
|
|
5860
|
+
const children = renderComponent(vm);
|
|
5861
|
+
vm.children = children;
|
|
5862
|
+
const parentNode = vm.renderRoot;
|
|
5863
|
+
hydrateChildren(getFirstChild(parentNode), children, parentNode, vm);
|
|
5864
|
+
runRenderedCallback(vm);
|
|
5865
|
+
}
|
|
5866
|
+
function hydrateNode(node, vnode) {
|
|
5867
|
+
let hydratedNode;
|
|
5868
|
+
switch (vnode.type) {
|
|
5869
|
+
case 0 /* Text */:
|
|
5870
|
+
hydratedNode = hydrateText(node, vnode);
|
|
5871
|
+
break;
|
|
5872
|
+
case 1 /* Comment */:
|
|
5873
|
+
hydratedNode = hydrateComment(node, vnode);
|
|
5874
|
+
break;
|
|
5875
|
+
case 2 /* Element */:
|
|
5876
|
+
hydratedNode = hydrateElement(node, vnode);
|
|
5877
|
+
break;
|
|
5878
|
+
case 3 /* CustomElement */:
|
|
5879
|
+
hydratedNode = hydrateCustomElement(node, vnode);
|
|
5880
|
+
break;
|
|
5881
|
+
}
|
|
5882
|
+
return nextSibling(hydratedNode);
|
|
5883
|
+
}
|
|
5884
|
+
function hydrateText(node, vnode) {
|
|
5885
|
+
var _a;
|
|
5886
|
+
if (!hasCorrectNodeType(vnode, node, 3 /* TEXT */)) {
|
|
5887
|
+
return handleMismatch(node, vnode);
|
|
5888
|
+
}
|
|
5889
|
+
if (process.env.NODE_ENV !== 'production') {
|
|
5890
|
+
const nodeValue = getProperty(node, 'nodeValue');
|
|
5891
|
+
if (nodeValue !== vnode.text && !(nodeValue === '\u200D' && vnode.text === '')) {
|
|
5892
|
+
logWarn('Hydration mismatch: text values do not match, will recover from the difference', vnode.owner);
|
|
5893
|
+
}
|
|
5894
|
+
}
|
|
5895
|
+
setText(node, (_a = vnode.text) !== null && _a !== void 0 ? _a : null);
|
|
5896
|
+
vnode.elm = node;
|
|
5897
|
+
return node;
|
|
5898
|
+
}
|
|
5899
|
+
function hydrateComment(node, vnode) {
|
|
5900
|
+
var _a;
|
|
5901
|
+
if (!hasCorrectNodeType(vnode, node, 8 /* COMMENT */)) {
|
|
5902
|
+
return handleMismatch(node, vnode);
|
|
5903
|
+
}
|
|
5904
|
+
if (process.env.NODE_ENV !== 'production') {
|
|
5905
|
+
const nodeValue = getProperty(node, 'nodeValue');
|
|
5906
|
+
if (nodeValue !== vnode.text) {
|
|
5907
|
+
logWarn('Hydration mismatch: comment values do not match, will recover from the difference', vnode.owner);
|
|
5908
|
+
}
|
|
5909
|
+
}
|
|
5910
|
+
setProperty(node, 'nodeValue', (_a = vnode.text) !== null && _a !== void 0 ? _a : null);
|
|
5911
|
+
vnode.elm = node;
|
|
5912
|
+
return node;
|
|
5913
|
+
}
|
|
5914
|
+
function hydrateElement(elm, vnode) {
|
|
5915
|
+
if (!hasCorrectNodeType(vnode, elm, 1 /* ELEMENT */) ||
|
|
5916
|
+
!isMatchingElement(vnode, elm)) {
|
|
5917
|
+
return handleMismatch(elm, vnode);
|
|
5918
|
+
}
|
|
5919
|
+
vnode.elm = elm;
|
|
5920
|
+
const { context } = vnode.data;
|
|
5921
|
+
const isDomManual = Boolean(!isUndefined$1(context) && !isUndefined$1(context.lwc) && context.lwc.dom === "manual" /* Manual */);
|
|
5922
|
+
if (isDomManual) {
|
|
5923
|
+
// it may be that this element has lwc:inner-html, we need to diff and in case are the same,
|
|
5924
|
+
// remove the innerHTML from props so it reuses the existing dom elements.
|
|
5925
|
+
const { props } = vnode.data;
|
|
5926
|
+
if (!isUndefined$1(props) && !isUndefined$1(props.innerHTML)) {
|
|
5927
|
+
if (getProperty(elm, 'innerHTML') === props.innerHTML) {
|
|
5928
|
+
// Do a shallow clone since VNodeData may be shared across VNodes due to hoist optimization
|
|
5929
|
+
vnode.data = Object.assign(Object.assign({}, vnode.data), { props: cloneAndOmitKey(props, 'innerHTML') });
|
|
5930
|
+
}
|
|
5931
|
+
else {
|
|
5932
|
+
if (process.env.NODE_ENV !== 'production') {
|
|
5933
|
+
logWarn(`Mismatch hydrating element <${getProperty(elm, 'tagName').toLowerCase()}>: innerHTML values do not match for element, will recover from the difference`, vnode.owner);
|
|
5934
|
+
}
|
|
5935
|
+
}
|
|
5936
|
+
}
|
|
5937
|
+
}
|
|
5938
|
+
patchElementPropsAndAttrs(vnode);
|
|
5939
|
+
if (!isDomManual) {
|
|
5940
|
+
hydrateChildren(getFirstChild(elm), vnode.children, elm, vnode.owner);
|
|
5941
|
+
}
|
|
5942
|
+
return elm;
|
|
5943
|
+
}
|
|
5944
|
+
function hydrateCustomElement(elm, vnode) {
|
|
5945
|
+
if (!hasCorrectNodeType(vnode, elm, 1 /* ELEMENT */) ||
|
|
5946
|
+
!isMatchingElement(vnode, elm)) {
|
|
5947
|
+
return handleMismatch(elm, vnode);
|
|
5948
|
+
}
|
|
5949
|
+
const { sel, mode, ctor, owner } = vnode;
|
|
5950
|
+
const vm = createVM(elm, ctor, {
|
|
5951
|
+
mode,
|
|
5952
|
+
owner,
|
|
5953
|
+
tagName: sel,
|
|
5954
|
+
});
|
|
5955
|
+
vnode.elm = elm;
|
|
5956
|
+
vnode.vm = vm;
|
|
5957
|
+
allocateChildren(vnode, vm);
|
|
5958
|
+
patchElementPropsAndAttrs(vnode);
|
|
5959
|
+
// Insert hook section:
|
|
5960
|
+
if (process.env.NODE_ENV !== 'production') {
|
|
5961
|
+
assert.isTrue(vm.state === 0 /* created */, `${vm} cannot be recycled.`);
|
|
5962
|
+
}
|
|
5963
|
+
runConnectedCallback(vm);
|
|
5964
|
+
if (vm.renderMode !== 0 /* Light */) {
|
|
5965
|
+
// VM is not rendering in Light DOM, we can proceed and hydrate the slotted content.
|
|
5966
|
+
// Note: for Light DOM, this is handled while hydrating the VM
|
|
5967
|
+
hydrateChildren(getFirstChild(elm), vnode.children, elm, vm);
|
|
5968
|
+
}
|
|
5969
|
+
hydrateVM(vm);
|
|
5970
|
+
return elm;
|
|
5971
|
+
}
|
|
5972
|
+
function hydrateChildren(node, children, parentNode, owner) {
|
|
5973
|
+
let hasWarned = false;
|
|
5974
|
+
let nextNode = node;
|
|
5975
|
+
let anchor = null;
|
|
5976
|
+
for (let i = 0; i < children.length; i++) {
|
|
5977
|
+
const childVnode = children[i];
|
|
5978
|
+
if (!isNull(childVnode)) {
|
|
5979
|
+
if (nextNode) {
|
|
5980
|
+
nextNode = hydrateNode(nextNode, childVnode);
|
|
5981
|
+
anchor = childVnode.elm;
|
|
5982
|
+
}
|
|
5983
|
+
else {
|
|
5984
|
+
hasMismatch = true;
|
|
5985
|
+
if (process.env.NODE_ENV !== 'production') {
|
|
5986
|
+
if (!hasWarned) {
|
|
5987
|
+
hasWarned = true;
|
|
5988
|
+
logError(`Hydration mismatch: incorrect number of rendered nodes. Client produced more nodes than the server.`, owner);
|
|
5989
|
+
}
|
|
5990
|
+
}
|
|
5991
|
+
mount(childVnode, parentNode, anchor);
|
|
5992
|
+
anchor = childVnode.elm;
|
|
5993
|
+
}
|
|
5994
|
+
}
|
|
5995
|
+
}
|
|
5996
|
+
if (nextNode) {
|
|
5997
|
+
hasMismatch = true;
|
|
5998
|
+
if (process.env.NODE_ENV !== 'production') {
|
|
5999
|
+
if (!hasWarned) {
|
|
6000
|
+
logError(`Hydration mismatch: incorrect number of rendered nodes. Server rendered more nodes than the client.`, owner);
|
|
6001
|
+
}
|
|
6002
|
+
}
|
|
6003
|
+
do {
|
|
6004
|
+
const current = nextNode;
|
|
6005
|
+
nextNode = nextSibling(nextNode);
|
|
6006
|
+
removeNode(current, parentNode);
|
|
6007
|
+
} while (nextNode);
|
|
6008
|
+
}
|
|
6009
|
+
}
|
|
6010
|
+
function handleMismatch(node, vnode, msg) {
|
|
6011
|
+
hasMismatch = true;
|
|
6012
|
+
if (!isUndefined$1(msg)) {
|
|
6013
|
+
if (process.env.NODE_ENV !== 'production') {
|
|
6014
|
+
logError(msg, vnode.owner);
|
|
6015
|
+
}
|
|
6016
|
+
}
|
|
6017
|
+
const parentNode = getProperty(node, 'parentNode');
|
|
6018
|
+
mount(vnode, parentNode, node);
|
|
6019
|
+
removeNode(node, parentNode);
|
|
6020
|
+
return vnode.elm;
|
|
6021
|
+
}
|
|
6022
|
+
function patchElementPropsAndAttrs(vnode) {
|
|
6023
|
+
applyEventListeners(vnode);
|
|
6024
|
+
patchProps(null, vnode);
|
|
6025
|
+
}
|
|
6026
|
+
function hasCorrectNodeType(vnode, node, nodeType) {
|
|
6027
|
+
if (getProperty(node, 'nodeType') !== nodeType) {
|
|
6028
|
+
if (process.env.NODE_ENV !== 'production') {
|
|
6029
|
+
logError('Hydration mismatch: incorrect node type received', vnode.owner);
|
|
6030
|
+
}
|
|
6031
|
+
return false;
|
|
6032
|
+
}
|
|
6033
|
+
return true;
|
|
6034
|
+
}
|
|
6035
|
+
function isMatchingElement(vnode, elm) {
|
|
6036
|
+
if (vnode.sel.toLowerCase() !== getProperty(elm, 'tagName').toLowerCase()) {
|
|
6037
|
+
if (process.env.NODE_ENV !== 'production') {
|
|
6038
|
+
logError(`Hydration mismatch: expecting element with tag "${vnode.sel.toLowerCase()}" but found "${getProperty(elm, 'tagName').toLowerCase()}".`, vnode.owner);
|
|
6039
|
+
}
|
|
6040
|
+
return false;
|
|
6041
|
+
}
|
|
6042
|
+
const hasIncompatibleAttrs = validateAttrs(vnode, elm);
|
|
6043
|
+
const hasIncompatibleClass = validateClassAttr(vnode, elm);
|
|
6044
|
+
const hasIncompatibleStyle = validateStyleAttr(vnode, elm);
|
|
6045
|
+
return hasIncompatibleAttrs && hasIncompatibleClass && hasIncompatibleStyle;
|
|
6046
|
+
}
|
|
6047
|
+
function validateAttrs(vnode, elm) {
|
|
6048
|
+
const { data: { attrs = {} }, } = vnode;
|
|
6049
|
+
let nodesAreCompatible = true;
|
|
6050
|
+
// Validate attributes, though we could always recovery from those by running the update mods.
|
|
6051
|
+
// Note: intentionally ONLY matching vnodes.attrs to elm.attrs, in case SSR is adding extra attributes.
|
|
6052
|
+
for (const [attrName, attrValue] of Object.entries(attrs)) {
|
|
6053
|
+
const elmAttrValue = getAttribute(elm, attrName);
|
|
6054
|
+
if (String(attrValue) !== elmAttrValue) {
|
|
6055
|
+
if (process.env.NODE_ENV !== 'production') {
|
|
6056
|
+
logError(`Mismatch hydrating element <${getProperty(elm, 'tagName').toLowerCase()}>: attribute "${attrName}" has different values, expected "${attrValue}" but found "${elmAttrValue}"`, vnode.owner);
|
|
6057
|
+
}
|
|
6058
|
+
nodesAreCompatible = false;
|
|
6059
|
+
}
|
|
6060
|
+
}
|
|
6061
|
+
return nodesAreCompatible;
|
|
6062
|
+
}
|
|
6063
|
+
function validateClassAttr(vnode, elm) {
|
|
6064
|
+
const { data: { className, classMap }, } = vnode;
|
|
6065
|
+
let nodesAreCompatible = true;
|
|
6066
|
+
let vnodeClassName;
|
|
6067
|
+
if (!isUndefined$1(className) && String(className) !== getProperty(elm, 'className')) {
|
|
6068
|
+
// className is used when class is bound to an expr.
|
|
6069
|
+
nodesAreCompatible = false;
|
|
6070
|
+
vnodeClassName = className;
|
|
6071
|
+
}
|
|
6072
|
+
else if (!isUndefined$1(classMap)) {
|
|
6073
|
+
// classMap is used when class is set to static value.
|
|
6074
|
+
const classList = getClassList(elm);
|
|
6075
|
+
let computedClassName = '';
|
|
6076
|
+
// all classes from the vnode should be in the element.classList
|
|
6077
|
+
for (const name in classMap) {
|
|
6078
|
+
computedClassName += ' ' + name;
|
|
6079
|
+
if (!classList.contains(name)) {
|
|
6080
|
+
nodesAreCompatible = false;
|
|
6081
|
+
}
|
|
6082
|
+
}
|
|
6083
|
+
vnodeClassName = computedClassName.trim();
|
|
6084
|
+
if (classList.length > keys(classMap).length) {
|
|
6085
|
+
nodesAreCompatible = false;
|
|
6086
|
+
}
|
|
6087
|
+
}
|
|
6088
|
+
if (!nodesAreCompatible) {
|
|
6089
|
+
if (process.env.NODE_ENV !== 'production') {
|
|
6090
|
+
logError(`Mismatch hydrating element <${getProperty(elm, 'tagName').toLowerCase()}>: attribute "class" has different values, expected "${vnodeClassName}" but found "${getProperty(elm, 'className')}"`, vnode.owner);
|
|
6091
|
+
}
|
|
6092
|
+
}
|
|
6093
|
+
return nodesAreCompatible;
|
|
6094
|
+
}
|
|
6095
|
+
function validateStyleAttr(vnode, elm) {
|
|
6096
|
+
const { data: { style, styleDecls }, } = vnode;
|
|
6097
|
+
const elmStyle = getAttribute(elm, 'style') || '';
|
|
6098
|
+
let vnodeStyle;
|
|
6099
|
+
let nodesAreCompatible = true;
|
|
6100
|
+
if (!isUndefined$1(style) && style !== elmStyle) {
|
|
6101
|
+
nodesAreCompatible = false;
|
|
6102
|
+
vnodeStyle = style;
|
|
6103
|
+
}
|
|
6104
|
+
else if (!isUndefined$1(styleDecls)) {
|
|
6105
|
+
const parsedVnodeStyle = parseStyleText(elmStyle);
|
|
6106
|
+
const expectedStyle = [];
|
|
6107
|
+
// styleMap is used when style is set to static value.
|
|
6108
|
+
for (let i = 0, n = styleDecls.length; i < n; i++) {
|
|
6109
|
+
const [prop, value, important] = styleDecls[i];
|
|
6110
|
+
expectedStyle.push(`${prop}: ${value + (important ? ' important!' : '')}`);
|
|
6111
|
+
const parsedPropValue = parsedVnodeStyle[prop];
|
|
6112
|
+
if (isUndefined$1(parsedPropValue)) {
|
|
6113
|
+
nodesAreCompatible = false;
|
|
6114
|
+
}
|
|
6115
|
+
else if (!parsedPropValue.startsWith(value)) {
|
|
6116
|
+
nodesAreCompatible = false;
|
|
6117
|
+
}
|
|
6118
|
+
else if (important && !parsedPropValue.endsWith('!important')) {
|
|
6119
|
+
nodesAreCompatible = false;
|
|
6120
|
+
}
|
|
6121
|
+
}
|
|
6122
|
+
if (keys(parsedVnodeStyle).length > styleDecls.length) {
|
|
6123
|
+
nodesAreCompatible = false;
|
|
6124
|
+
}
|
|
6125
|
+
vnodeStyle = ArrayJoin.call(expectedStyle, ';');
|
|
6126
|
+
}
|
|
6127
|
+
if (!nodesAreCompatible) {
|
|
6128
|
+
if (process.env.NODE_ENV !== 'production') {
|
|
6129
|
+
logError(`Mismatch hydrating element <${getProperty(elm, 'tagName').toLowerCase()}>: attribute "style" has different values, expected "${vnodeStyle}" but found "${elmStyle}".`, vnode.owner);
|
|
6130
|
+
}
|
|
6131
|
+
}
|
|
6132
|
+
return nodesAreCompatible;
|
|
6133
|
+
}
|
|
6134
|
+
|
|
6060
6135
|
/*
|
|
6061
6136
|
* Copyright (c) 2018, salesforce.com, inc.
|
|
6062
6137
|
* All rights reserved.
|
|
@@ -6070,5 +6145,5 @@ function setHooks(hooks) {
|
|
|
6070
6145
|
setSanitizeHtmlContentHook(hooks.sanitizeHtmlContent);
|
|
6071
6146
|
}
|
|
6072
6147
|
|
|
6073
|
-
export { LightningElement, profilerControl as __unstable__ProfilerControl, api$1 as api, connectRootElement, createContextProvider, createVM, disconnectRootElement, getAssociatedVMIfPresent, getComponentDef, getComponentHtmlPrototype, getUpgradableConstructor,
|
|
6074
|
-
/* version: 2.11.
|
|
6148
|
+
export { LightningElement, profilerControl as __unstable__ProfilerControl, api$1 as api, connectRootElement, createContextProvider, createVM, disconnectRootElement, getAssociatedVMIfPresent, getComponentDef, getComponentHtmlPrototype, getUpgradableConstructor, hydrateRoot, isComponentConstructor, readonly, register, registerComponent, registerDecorators, registerTemplate, sanitizeAttribute, setAddEventListener, setAssertInstanceOfHTMLElement, setAttachShadow, setCreateComment, setCreateElement, setCreateText, setDefineCustomElement, setDispatchEvent, setGetAttribute, setGetBoundingClientRect, setGetChildNodes, setGetChildren, setGetClassList, setGetCustomElement, setGetElementsByClassName, setGetElementsByTagName, setGetFirstChild, setGetFirstElementChild, setGetLastChild, setGetLastElementChild, setGetProperty, setHTMLElement, setHooks, setInsert, setInsertGlobalStylesheet, setInsertStylesheet, setIsConnected, setIsHydrating, setIsNativeShadowDefined, setIsSyntheticShadowDefined, setNextSibling, setQuerySelector, setQuerySelectorAll, setRemove, setRemoveAttribute, setRemoveEventListener, setSetAttribute, setSetCSSStyleProperty, setSetProperty, setSetText, setSsr, swapComponent, swapStyle, swapTemplate, track, unwrap, wire };
|
|
6149
|
+
/* version: 2.11.4 */
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@lwc/engine-core",
|
|
3
|
-
"version": "2.11.
|
|
3
|
+
"version": "2.11.4",
|
|
4
4
|
"description": "Core LWC engine APIs.",
|
|
5
5
|
"homepage": "https://lwc.dev/",
|
|
6
6
|
"repository": {
|
|
@@ -24,14 +24,13 @@
|
|
|
24
24
|
"types/"
|
|
25
25
|
],
|
|
26
26
|
"dependencies": {
|
|
27
|
-
"@lwc/features": "2.11.
|
|
28
|
-
"@lwc/shared": "2.11.
|
|
27
|
+
"@lwc/features": "2.11.4",
|
|
28
|
+
"@lwc/shared": "2.11.4"
|
|
29
29
|
},
|
|
30
30
|
"devDependencies": {
|
|
31
31
|
"observable-membrane": "2.0.0"
|
|
32
32
|
},
|
|
33
33
|
"publishConfig": {
|
|
34
34
|
"access": "public"
|
|
35
|
-
}
|
|
36
|
-
"gitHead": "94040389ab8fc717b8753e503f659489480a327d"
|
|
35
|
+
}
|
|
37
36
|
}
|