@lwc/engine-core 8.1.0 → 8.1.2

package/dist/index.js

@@ -3933,6 +3933,65 @@ function isVStaticPartText(vnode) {
     return vnode.type === 0 /* VStaticPartType.Text */;
 }
 
+const sanitizedHtmlContentSymbol = Symbol('lwc-get-sanitized-html-content');
+function isSanitizedHtmlContent(object) {
+    return isObject(object) && !isNull(object) && sanitizedHtmlContentSymbol in object;
+}
+function unwrapIfNecessary(object) {
+    return isSanitizedHtmlContent(object) ? object[sanitizedHtmlContentSymbol] : object;
+}
+/**
+ * Wrap a pre-sanitized string designated for `.innerHTML` via `lwc:inner-html`
+ * as an object with a Symbol that only we have access to.
+ * @param sanitizedString
+ * @returns SanitizedHtmlContent
+ */
+function createSanitizedHtmlContent(sanitizedString) {
+    return create(null, {
+        [sanitizedHtmlContentSymbol]: {
+            value: sanitizedString,
+            configurable: false,
+            writable: false,
+        },
+    });
+}
+/**
+ * Safely call setProperty on an Element while handling any SanitizedHtmlContent objects correctly
+ *
+ * @param setProperty - renderer.setProperty
+ * @param elm - Element
+ * @param key - key to set
+ * @param value -  value to set
+ */
+function safelySetProperty(setProperty, elm, key, value) {
+    // See W-16614337
+    // we support setting innerHTML to `undefined` because it's inherently safe
+    if ((key === 'innerHTML' || key === 'outerHTML') && !isUndefined$1(value)) {
+        if (isSanitizedHtmlContent(value)) {
+            // it's a SanitizedHtmlContent object
+            setProperty(elm, key, value[sanitizedHtmlContentSymbol]);
+        }
+        else {
+            // not a SanitizedHtmlContent object
+            if (process.env.NODE_ENV !== 'production') {
+                logWarn(`Cannot set property "${key}". Instead, use lwc:inner-html or lwc:dom-manual.`);
+            }
+        }
+    }
+    else {
+        setProperty(elm, key, value);
+    }
+}
+/**
+ * Given two objects (likely either a string or a SanitizedHtmlContent object), return true if their
+ * string values are equivalent.
+ * @param first
+ * @param second
+ */
+function isSanitizedHtmlContentEqual(first, second) {
+    return unwrapIfNecessary(first) === unwrapIfNecessary(second);
+}
+
 /*
  * Copyright (c) 2018, salesforce.com, inc.
  * All rights reserved.
@@ -3963,7 +4022,7 @@ function patchAttributes(oldVnode, vnode, renderer) {
             // Use kebabCaseToCamelCase directly because we don't want to set props like `ariaLabel` or `tabIndex`
             // on a custom element versus just using the more reliable attribute format.
             if (external && (propName = kebabCaseToCamelCase(key)) in elm) {
-                setProperty(elm, propName, cur);
+                safelySetProperty(setProperty, elm, propName, cur);
             }
             else if (StringCharCodeAt.call(key, 3) === ColonCharCode) {
                 // Assume xml namespace
@@ -4043,7 +4102,7 @@ function patchProps(oldVnode, vnode, renderer) {
                     logWarn(`Unknown public property "${key}" of element <${elm.tagName.toLowerCase()}>. This is either a typo on the corresponding attribute "${htmlPropertyToAttribute(key)}", or the attribute does not exist in this browser or DOM implementation.`);
                 }
             }
-            setProperty(elm, key, cur);
+            safelySetProperty(setProperty, elm, key, cur);
         }
     }
 }
@@ -5751,7 +5810,8 @@ function setSanitizeHtmlContentHook(newHookImpl) {
 }
 // [s]anitize [h]tml [c]ontent
 function shc(content) {
-    return sanitizeHtmlContentHook(content);
+    const sanitizedString = sanitizeHtmlContentHook(content);
+    return createSanitizedHtmlContent(sanitizedString);
 }
 /**
  * [ncls] - Normalize class name attribute.
@@ -7649,6 +7709,8 @@ function hydrateComment(node, vnode, renderer) {
         }
     }
     const { setProperty } = renderer;
+    // We only set the `nodeValue` property here (on a comment), so we don't need
+    // to sanitize the content as HTML using `safelySetProperty`
     setProperty(node, NODE_VALUE_PROP, vnode.text ?? null);
     vnode.elm = node;
     return node;
@@ -7695,7 +7757,7 @@ function hydrateElement(elm, vnode, renderer) {
         const { data: { props }, } = vnode;
         const { getProperty } = renderer;
         if (!isUndefined$1(props) && !isUndefined$1(props.innerHTML)) {
-            if (getProperty(elm, 'innerHTML') === props.innerHTML) {
+            if (isSanitizedHtmlContentEqual(getProperty(elm, 'innerHTML'), props.innerHTML)) {
                 // Do a shallow clone since VNodeData may be shared across VNodes due to hoist optimization
                 vnode.data = {
                     ...vnode.data,
@@ -8369,5 +8431,5 @@ function readonly(obj) {
 }
 
 export { LightningElement, profilerControl as __unstable__ProfilerControl, reportingControl as __unstable__ReportingControl, api$1 as api, computeShadowAndRenderMode, connectRootElement, createContextProviderWithRegister, createVM, disconnectRootElement, freezeTemplate, getAssociatedVMIfPresent, getComponentAPIVersion, getComponentConstructor, getComponentDef, getComponentHtmlPrototype, hydrateRoot, isComponentConstructor, parseFragment, parseSVGFragment, readonly, registerComponent, registerDecorators, registerTemplate, runFormAssociatedCallback, runFormDisabledCallback, runFormResetCallback, runFormStateRestoreCallback, sanitizeAttribute, setHooks, shouldBeFormAssociated, swapComponent, swapStyle, swapTemplate, track, unwrap, wire };
-/** version: 8.1.0 */
+/** version: 8.1.2 */
 //# sourceMappingURL=index.js.map