details-element-polyfill
details-element-polyfill copied to clipboard
`ontoggle` event handler support
Hello!
This code adds a support of the ontoggle event handler in Safari, which lacks this feature:
{
const { HTMLElement : { prototype } } = window;
if(!('ontoggle' in prototype)) {
Object.defineProperties(prototype, {
ontoggle : {
configurable : true,
enumerable : true,
set(handler) {
this.__handler_ontoggle__ = typeof handler === 'function'?
handler.bind(this) :
null;
},
get() {
return this.__handler_ontoggle__;
}
},
__handler_ontoggle__ : { writable : true, value : null }
});
document.addEventListener('toggle', event => {
const target = event.target;
if(typeof target.ontoggle) target.ontoggle(event);
}, true);
}
}
Usage:
const details = document.createElement('details');
details.ontoggle(handler);
I don't know CoffeeScript, sorry. And thanks for this stuff!
According to caniuse, the latest version of Safari 10.1 does not have this issue any more. I haven't tested it myself.