Created attachment 239989 [details] testcase There is a <use> element references a <rect> element, the <use> element has a mousedown event and <rect> element has a mouseover event. The mouseover event on <rect> element changes its own color. When the <rect> element's color changed, the mousedown event on <use> element can't be fired. <svg id="svg-root" width="100%" height="100%" viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> <defs> <!-- SVGElementInstance animates fill on mouseover --> <rect id="rect" width="50" height="50" fill="red" onmouseover="document.getElementById('rect').setAttribute('fill','blue')" onmouseout="document.getElementById('rect').setAttribute('fill','red')" /> </defs> <use id="use3" fill="red" x="30" y="100" xlink:href="#rect" onmousedown="document.getElementById('rect').setAttribute('stroke','black')" onmouseup="document.getElementById('rect').setAttribute('stroke','none')"/> </g> </svg>
Safari, Chrome, and Firefox all agree on rendering for this test case. I don't believe there is any remaining compatibility issue.