adopted-ember-addons / adopted-ember-addons/ember-metrics

option `hitCallback` doesn't work for google analytics.

Open
#102 3 comments 0 reactions 0 assignees View on GitHub
Dominant language
TypeScript
Stars
367
Forks
158
PR merge metrics
No merged PRs in 30d

Description

I'm trying to track outbound link navigations, and found that the way to do this with google analytics is to send an event and in the options set a `hitCallback` key to a function that will be called when the event has been received. This just flat out doesn't seem to work.. here's my component.js:

``` js
function exitToMessenger() {
console.log('redirecting to messenger.com!!')
window.location.href = 'https://www.messenger.com/t/heyimlea';
}

export default Ember.Component.extend({
metrics: Ember.inject.service(),
actions: {
sendToMessenger() {
console.log('send to messenger called')
var metrics = Ember.get(this, 'metrics')

var eventData = {
hitType: 'event',
eventCategory: 'Outbound Link',
eventAction: 'click',
eventLabel: 'Sent to messenger!',
eventValue: 'https://www.messenger.com/t/heyimlea'
};

// if (navigator.sendBeacon) {
// //https://github.com/googleanalytics/autotrack/blob/bcdd409c22430553a2a43275386877bf37600e68/lib/plugins/outbound-form-tracker.js#L77
// //https://developer.mozilla.org/en-US/docs/Web/API/Navigator/sendBeacon
// eventData.transport = 'beacon'
// metrics.trackEvent(eventData)
// //metrics.trackPage({page: '/sent2messenger', title: "exiting to messenger" });
// //be sure analytics.js calls sendBeacon before exiting
// setTimeout(exitToMessenger, 4)
// } else {
eventData.hitCallback = exitToMessenger;
metrics.trackEvent(eventData)
// }
}
}
```

Searching something along the lines of 'analytics track outbound link' I find this help article from google analytics suggesting this method: https://support.google.com/analytics/answer/1136920?hl=en
Here's the docs on hitCallback: https://developers.google.com/analytics/devguides/collection/analyticsjs/sending-hits#hitcallback

I'd love to get this fixed and tested asap so that the ember community can have one comprehensive addon for analytics

Contributor guide

Open the contributing guide

Research direction

Start with component.js and the metrics.trackEvent call, then trace how eventData options reach the Google Analytics integration. Compare hitCallback handling with the linked Google Analytics documentation and add a regression test that confirms the callback is invoked for the outbound event.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript
Domain
analytics
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.