34

I'm using Polymer 1.0 and when there is a click on a button in Chrome a MouseEvent is generated. This MouseEvent object has a path property which is an ordered array of parent elements to the clicked button. In Firefox & Safari, however, a click is generated which does not have a path property. Is there an equivalent property of the click object which gives me the same information?

Improve this question

2 Answers 2

Reset to default
42

It's not available, but if you really would like to have this property, then you could extend the native prototype of the Event object like so:

if (!("path" in Event.prototype))
Object.defineProperty(Event.prototype, "path", {
  get: function() {
    var path = [];
    var currentElem = this.target;
    while (currentElem) {
      path.push(currentElem);
      currentElem = currentElem.parentElement;
    }
    if (path.indexOf(window) === -1 && path.indexOf(document) === -1)
      path.push(document);
    if (path.indexOf(window) === -1)
      path.push(window);
    return path;
  }
});

However if I were you, I wouldn't extend the prototype - I would create a function like mentioned above instead.

Also I would change Event.prototype to MouseEvent.prototype if you want to cover only those types of events.

Improve this answer
4
  • Awesomesauce. Not exactly the answer I was looking for, but solves my issue perfectly.
    – wogsland
    Commented Apr 25, 2016 at 16:43
  • Out of curiosity, @wogsland, what answer, or type of answer, were you hoping for?
    – David Thomas
    Commented Apr 25, 2016 at 18:21
  • 4
    I thought there would be an equivalent property in the object created in Firefox whose name I just hadn't guessed yet.
    – wogsland
    Commented Apr 25, 2016 at 18:23
  • 2
    @wogsland You could combine this answer with a check for the existence of Event.prototype.composedPath and get the best of both worlds: maximum compatibility with this code only executed in IE/Edge.
    – seyisulu
    Commented Oct 18, 2019 at 16:02
41

It seems like the e.composedPath() method might be a cross-browser version of e.path. It works in Chrome and Firefox. Not sure about Safari.

Improve this answer
4

Not the answer you're looking for? Browse other questions tagged or ask your own question.