Add support for set and get attribute with a NS (#471)

Author: jonathanKingston

integration-test/test-pages/runtime-checks/pages/basic-run.html

@@ -176,6 +176,32 @@
             ];
         });
 
+        test('Support namespaces', async () => {
+            const scriptElement = document.createElement('script');
+            scriptElement.id = 'scriptyNS';
+            scriptElement.setAttribute('type', 'application/javascript');
+            scriptElement.setAttributeNS(null, 'src', 'test://url');
+
+            const getAttributeNS = scriptElement.getAttributeNS(null, 'src');
+            const getAttribute = scriptElement.getAttribute('src');
+
+            document.body.appendChild(scriptElement);
+            const hadInspectorNode = scriptElement === document.querySelector('ddg-runtime-checks:last-of-type');
+            // Continue to modify the script element after it has been added to the DOM
+            scriptElement.madeUpProp = 'val';
+            const instanceofResult = scriptElement instanceof HTMLScriptElement;
+            const scripty = document.querySelector('#scriptyNS');
+
+            return [
+                { name: 'hadInspectorNode', result: hadInspectorNode, expected: true },
+                { name: 'expect script to match', result: scripty, expected: scriptElement },
+                { name: 'scripty.getAttribute', result: getAttribute, expected: 'test://url' },
+                { name: 'scripty.getAttributeNS', result: getAttribute, expected: 'test://url' },
+                { name: 'scripty.type', result: scripty.type, expected: 'application/javascript' },
+                { name: 'scripty.id', result: scripty.id, expected: 'scriptyNS' }
+            ];
+        });
+
         // eslint-disable-next-line no-undef
         renderResults();
     </script>

src/features/runtime-checks.js

@@ -35,7 +35,9 @@ const supportedSinks = ['src']
 // Store the original methods so we can call them without any side effects
 const defaultElementMethods = {
     setAttribute: HTMLElement.prototype.setAttribute,
+    setAttributeNS: HTMLElement.prototype.setAttributeNS,
     getAttribute: HTMLElement.prototype.getAttribute,
+    getAttributeNS: HTMLElement.prototype.getAttributeNS,
     removeAttribute: HTMLElement.prototype.removeAttribute,
     remove: HTMLElement.prototype.remove,
     removeChild: HTMLElement.prototype.removeChild
@@ -259,6 +261,13 @@ class DDGRuntimeChecks extends HTMLElement {
         return this._callMethod('getAttribute', name, value)
     }
 
+    getAttributeNS (namespace, name, value) {
+        if (namespace) {
+            return this._callMethod('getAttributeNS', namespace, name, value)
+        }
+        return Reflect.apply(DDGRuntimeChecks.prototype.getAttribute, this, [name, value])
+    }
+
     setAttribute (name, value) {
         if (shouldFilterKey(this.#tagName, 'attribute', name)) return
         if (supportedSinks.includes(name)) {
@@ -268,6 +277,13 @@ class DDGRuntimeChecks extends HTMLElement {
         return this._callMethod('setAttribute', name, value)
     }
 
+    setAttributeNS (namespace, name, value) {
+        if (namespace) {
+            return this._callMethod('setAttributeNS', namespace, name, value)
+        }
+        return Reflect.apply(DDGRuntimeChecks.prototype.setAttribute, this, [name, value])
+    }
+
     removeAttribute (name) {
         if (shouldFilterKey(this.#tagName, 'attribute', name)) return
         if (supportedSinks.includes(name)) {