Attaching keyboard events to an SVG Element inside HTML

As user Erik Dahlström suggested, you (first) need to add an event listener for focus.

svgRect.addEventListener('focus', function(){
    this.addEventListener('keypress',function(e){
        console.log(e.keyCode);
    });
}, svgRect);

A simple answer might be that the 'focusable' attribute isn't supported in those browsers. For key event listeners on e.g a <rect> to make any sense there needs to be a concept of focus inside the svg.


Tudormi's code works fine, but be careful of memmoryleaks, because everytime you focus svgRect, new keypress event will be registered on that element.