How can I iterate through the property names of the prototype of an html element?

Question

For example, I can iterate through the properties in Element.prototype by using

Object.getOwnPropertyNames(Element.prototype).forEach(/*does the thing*/)

but I can't seem to find a way to iterate through the properties of an element like "audio". Trying to iterate over HTMLAudioElement for example just yields an array with ["constructor"] when it definitely has more properties than that. Does anyone know how to do this?

More background: I'm trying to build a proxy class that hands values to an element but triggers an event. The class needs to have the same properties as the element it's acting as a proxy for.

Answer 1

HTMLAudioElement has no specific properties as it inherits its properties from its parent, HTMLMediaElement, and from HTMLElement.

Object.getOwnPropertyNames(HTMLMediaElement)

outputs:

["length", "name", "arguments", "caller", "prototype", "NETWORK_EMPTY",
 "NETWORK_IDLE", "NETWORK_LOADING", "NETWORK_NO_SOURCE", 
 "HAVE_NOTHING", "HAVE_METADATA", "HAVE_CURRENT_DATA", 
 "HAVE_FUTURE_DATA", "HAVE_ENOUGH_DATA", "toString"]

https://developer.mozilla.org/en/docs/Web/API/HTMLAudioElement

As @self pointed out in the comments below, you could also use:

Object.getOwnPropertyNames(HTMLAudioElement.__proto__)

to get the same result, without having to know which class HTMLAudioElement inherits from.

Answer 2

In Firefox I was able to get all properties of the audio element with for in.

for (let prop in Audio.prototype) {
    console.log(prop);
}

I used this to build an array I could then use in Chrome and Firefox.

const audioProps = ["load", "canPlayType", "fastSeek", "play", "pause", "addTextTrack", "mozCaptureStream", "mozCaptureStreamUntilEnded", "mozGetMetadata", "setMediaKeys", "seekToNextFrame", "error", "src", "currentSrc", "crossOrigin", "networkState", "preload", "buffered", "readyState", "seeking", "currentTime", "duration", "paused", "defaultPlaybackRate", "playbackRate", "played", "seekable", "ended", "autoplay", "loop", "controls", "volume", "muted", "defaultMuted", "textTracks", "srcObject", "mozPreservesPitch", "mozAudioCaptured", "mozFragmentEnd", "mediaKeys", "onencrypted", "onwaitingforkey", "NETWORK_EMPTY", "NETWORK_IDLE", "NETWORK_LOADING", "NETWORK_NO_SOURCE", "HAVE_NOTHING", "HAVE_METADATA", "HAVE_CURRENT_DATA", "HAVE_FUTURE_DATA", "HAVE_ENOUGH_DATA", "click", "focus", "blur", "title", "lang", "dir", "innerText", "hidden", "accessKey", "accessKeyLabel", "draggable", "contentEditable", "isContentEditable", "spellcheck", "nonce", "offsetParent", "offsetTop", "offsetLeft", "offsetWidth", "offsetHeight", "oncopy", "oncut", "onpaste", "style", "onabort", "onblur", "onfocus", "onauxclick", "onbeforeinput", "oncanplay", "oncanplaythrough", "onchange", "onclick", "onclose", "oncontextmenu", "oncuechange", "ondblclick", "ondrag", "ondragend", "ondragenter", "ondragexit", "ondragleave", "ondragover", "ondragstart", "ondrop", "ondurationchange", "onemptied", "onended", "onformdata", "oninput", "oninvalid", "onkeydown", "onkeypress", "onkeyup", "onload", "onloadeddata", "onloadedmetadata", "onloadend", "onloadstart", "onmousedown", "onmouseenter", "onmouseleave", "onmousemove", "onmouseout", "onmouseover", "onmouseup", "onwheel", "onpause", "onplay", "onplaying", "onprogress", "onratechange", "onreset", "onresize", "onscroll", "onseeked", "onseeking", "onselect", "onstalled", "onsubmit", "onsuspend", "ontimeupdate", "onvolumechange", "onwaiting", "onselectstart", "ontoggle", "onpointercancel", "onpointerdown", "onpointerup", "onpointermove", "onpointerout", "onpointerover", "onpointerenter", "onpointerleave", "ongotpointercapture", "onlostpointercapture", "onmozfullscreenchange", "onmozfullscreenerror", "onanimationcancel", "onanimationend", "onanimationiteration", "onanimationstart", "ontransitioncancel", "ontransitionend", "ontransitionrun", "ontransitionstart", "onwebkitanimationend", "onwebkitanimationiteration", "onwebkitanimationstart", "onwebkittransitionend", "dataset", "tabIndex", "onerror", "getAttributeNames", "getAttribute", "getAttributeNS", "toggleAttribute", "setAttribute", "setAttributeNS", "removeAttribute", "removeAttributeNS", "hasAttribute", "hasAttributeNS", "hasAttributes", "closest", "matches", "webkitMatchesSelector", "getElementsByTagName", "getElementsByTagNameNS", "getElementsByClassName", "insertAdjacentElement", "insertAdjacentText", "mozMatchesSelector", "setPointerCapture", "releasePointerCapture", "hasPointerCapture", "setCapture", "releaseCapture", "getAttributeNode", "setAttributeNode", "removeAttributeNode", "getAttributeNodeNS", "setAttributeNodeNS", "getClientRects", "getBoundingClientRect", "scrollIntoView", "scroll", "scrollTo", "scrollBy", "insertAdjacentHTML", "querySelector", "querySelectorAll", "attachShadow", "requestFullscreen", "mozRequestFullScreen", "requestPointerLock", "animate", "getAnimations", "before", "after", "replaceWith", "remove", "prepend", "append", "replaceChildren", "namespaceURI", "prefix", "localName", "tagName", "id", "className", "classList", "part", "attributes", "scrollTop", "scrollLeft", "scrollWidth", "scrollHeight", "clientTop", "clientLeft", "clientWidth", "clientHeight", "scrollTopMax", "scrollLeftMax", "innerHTML", "outerHTML", "shadowRoot", "assignedSlot", "slot", "onfullscreenchange", "onfullscreenerror", "previousElementSibling", "nextElementSibling", "children", "firstElementChild", "lastElementChild", "childElementCount", "getRootNode", "hasChildNodes", "insertBefore", "appendChild", "replaceChild", "removeChild", "normalize", "cloneNode", "isSameNode", "isEqualNode", "compareDocumentPosition", "contains", "lookupPrefix", "lookupNamespaceURI", "isDefaultNamespace", "nodeType", "nodeName", "baseURI", "isConnected", "ownerDocument", "parentNode", "parentElement", "childNodes", "firstChild", "lastChild", "previousSibling", "nextSibling", "nodeValue", "textContent", "ELEMENT_NODE", "ATTRIBUTE_NODE", "TEXT_NODE", "CDATA_SECTION_NODE", "ENTITY_REFERENCE_NODE", "ENTITY_NODE", "PROCESSING_INSTRUCTION_NODE", "COMMENT_NODE", "DOCUMENT_NODE", "DOCUMENT_TYPE_NODE", "DOCUMENT_FRAGMENT_NODE", "NOTATION_NODE", "DOCUMENT_POSITION_DISCONNECTED", "DOCUMENT_POSITION_PRECEDING", "DOCUMENT_POSITION_FOLLOWING", "DOCUMENT_POSITION_CONTAINS", "DOCUMENT_POSITION_CONTAINED_BY", "DOCUMENT_POSITION_IMPLEMENTATION_SPECIFIC", "addEventListener", "removeEventListener", "dispatchEvent"];