Event listener for html5 details node state change

I am trying to add an event listener to detect a change in the state of an HTML5 details node.

Initially I tried attaching a listener to the open and close events as it makes logical sense to me for a details node to have those listeners, but it doesn’t and I do not see any mention of them in the html5 spec.

I tried (in Google Chrome) the change event, since the html5 spec (and Inspect Element confirms) that the way to open and close details is to add/remove the open attribute. I was hoping that the node gaining/losing an attribute would trigger the change event, but apparently it does not.

How the hell do I trigger a script action off of the changing of state of a details node?

Answer

Did you try using the DOMAttrModified mutation event?