Add freeze-element-property scriptlet

gorhill · gorhill · commit 05f01f6be4e7 · 2026-03-25T11:52:55.000-04:00
@Scriptlet freeze-element-property @description Conditionally prevent assignment to an element property. @param property The property name to freeze. @param [selector] Optional. The element must matches `selector` for the prevention to take place. @param [pattern] Optional. A pattern to match against the stringified assigned value. The pattern can be a plain string, or a regex. Prepend with `!` to reverse the match condition. The scriptlet `prevent-innerHTML` is now an alias for `##+js(freeze-element-property, innerHTML, ...)`
diff --git a/src/js/resources/prevent-innerHTML.js b/src/js/resources/prevent-innerHTML.js
@@ -24,29 +24,44 @@ import { registerScriptlet } from './base.js';
 import { safeSelf } from './safe-self.js';
 
 /**
- * @scriptlet prevent-innerHTML
+ * @scriptlet freeze-element-property
  * 
  * @description
- * Conditionally prevent assignment to `innerHTML` property.
+ * Conditionally prevent assignment to an element property.
+ * 
+ * @param property
+ * The property name to freeze.
  * 
  * @param [selector]
  * Optional. The element must matches `selector` for the prevention to take
  * place.
  * 
  * @param [pattern]
- * Optional. A pattern to match against the assigned value. The pattern can be
- * a plain string, or a regex. Prepend with `!` to reverse the match condition.
+ * Optional. A pattern to match against the stringified assigned value. The
+ * pattern can be a plain string, or a regex. Prepend with `!` to reverse the
+ * match condition.
  * 
  * */
 
-export function preventInnerHTML(
+function freezeElementProperty(
+    property = '',
     selector = '',
     pattern = ''
 ) {
     const safe = safeSelf();
-    const logPrefix = safe.makeLogPrefix('prevent-innerHTML', selector, pattern);
+    const logPrefix = safe.makeLogPrefix('freeze-element-property', property, selector, pattern);
     const matcher = safe.initPattern(pattern, { canNegate: true });
-    const current = safe.Object_getOwnPropertyDescriptor(Element.prototype, 'innerHTML');
+    const owner = (( ) => {
+        if ( Object.hasOwn(Element.prototype, property) ) {
+            return Element.prototype;
+        }
+        if ( Object.hasOwn(HTMLElement.prototype, property) ) {
+            return HTMLElement.prototype;
+        }
+        return null;
+    })();
+    if ( owner === null ) { return; }
+    const current = safe.Object_getOwnPropertyDescriptor(owner, property);
     if ( current === undefined ) { return; }
     const shouldPreventSet = (elem, a) => {
         if ( selector !== '' ) {
@@ -55,15 +70,15 @@ export function preventInnerHTML(
         }
         return safe.testPattern(matcher, `${a}`);
     };
-    Object.defineProperty(Element.prototype, 'innerHTML', {
+    Object.defineProperty(owner, property, {
         get: function() {
             return current.get
                 ? current.get.call(this)
                 : current.value;
         },
         set: function(a) {
             if ( shouldPreventSet(this, a) ) {
-                safe.uboLog(logPrefix, 'Prevented');
+                safe.uboLog(logPrefix, 'Assignment prevented');
             } else if ( current.set ) {
                 current.set.call(this, a);
             }
@@ -74,18 +89,18 @@ export function preventInnerHTML(
         },
     });
 }
-registerScriptlet(preventInnerHTML, {
-    name: 'prevent-innerHTML.js',
+registerScriptlet(freezeElementProperty, {
+    name: 'freeze-element-property.js',
     dependencies: [
         safeSelf,
     ],
 });
 
 /**
- * @scriptlet prevent-textContent
+ * @scriptlet prevent-innerHTML
  * 
  * @description
- * Conditionally prevent assignment to `textContent` property.
+ * Conditionally prevent assignment to `innerHTML` property.
  * 
  * @param [selector]
  * Optional. The element must matches `selector` for the prevention to take
@@ -97,44 +112,15 @@ registerScriptlet(preventInnerHTML, {
  * 
  * */
 
-export function preventTextContent(
+function preventInnerHTML(
     selector = '',
     pattern = ''
 ) {
-    const safe = safeSelf();
-    const logPrefix = safe.makeLogPrefix('prevent-textContent', selector, pattern);
-    const matcher = safe.initPattern(pattern, { canNegate: true });
-    const current = safe.Object_getOwnPropertyDescriptor(Element.prototype, 'textContent');
-    if ( current === undefined ) { return; }
-    const shouldPreventSet = (elem, a) => {
-        if ( selector !== '' ) {
-            if ( typeof elem.matches !== 'function' ) { return false; }
-            if ( elem.matches(selector) === false ) { return false; }
-        }
-        return safe.testPattern(matcher, `${a}`);
-    };
-    Object.defineProperty(Element.prototype, 'textContent', {
-        get: function() {
-            return current.get
-                ? current.get.call(this)
-                : current.value;
-        },
-        set: function(a) {
-            if ( shouldPreventSet(this, a) ) {
-                safe.uboLog(logPrefix, 'Prevented');
-            } else if ( current.set ) {
-                current.set.call(this, a);
-            }
-            if ( safe.logLevel > 1 ) {
-                safe.uboLog(logPrefix, `Assigned:\n${a}`);
-            }
-            current.value = a;
-        },
-    });
+    freezeElementProperty('innerHTML', selector, pattern);
 }
 registerScriptlet(preventInnerHTML, {
-    name: 'prevent-textContent.js',
+    name: 'prevent-innerHTML.js',
     dependencies: [
-        safeSelf,
+        freezeElementProperty,
     ],
 });
