Search code examples
javascriptmatomo

how does Piwik track link click events?


I personally do not use Piwik. I have developed a JavaScript tool/library for creating a menu system in SharePoint and someone who uses my library was asking about incorporating Piwik.

From what I have read I can see that Piwik catches/tracks click events. I suspect it does that by default for <a> tags that have a href attribute.

My JS library creates <div> elements with an onclick event. I've read and understand that I can manually fire a click event using Piwik's trackLink function function. I wanted to avoid doing that for numerous reasons.

So I wanted to see how exactly Piwik tracks click events so I can figure out how I can incorporate it in a more general way. I thought maybe I could make my onclick event fake something by creating an <a> element and executing it's click event but wasn't sure if that would work.


Solution

  • Have a look at Piwik's JS tracker source code.

    For example:

    • enableLinkTracking()

      The default behaviour is to use actual click events. However, some browsers (e.g., Firefox, Opera, and Konqueror) don't generate click events for the middle mouse button.

      To capture more "clicks", the pseudo click-handler uses mousedown + mouseup events. This is not industry standard and is vulnerable to false positives (e.g., drag events).

    • addClickListener()

          function addClickListener(element, enable) {
              addEventListener(element, 'click', clickHandler(enable), false);
      
              if (enable) {
                  addEventListener(element, 'mouseup', clickHandler(enable), false);
                  addEventListener(element, 'mousedown', clickHandler(enable), false);
                  addEventListener(element, 'contextmenu', clickHandler(enable), false);
              }
          }