From 71d96b4317065db85fc68907ce5fa6d02b3efbd3 Mon Sep 17 00:00:00 2001 From: Adlen Date: Tue, 12 Apr 2016 14:50:34 +0200 Subject: [PATCH] Feat(event) - added nonInteraction option --- README.md | 1 + index.client.js | 27 +++++++++++++++---------- tests/unit/index.client.js | 40 ++++++++++++++++++++++---------------- 3 files changed, 41 insertions(+), 27 deletions(-) diff --git a/README.md b/README.md index 3884b6c..643c6a5 100644 --- a/README.md +++ b/README.md @@ -65,6 +65,7 @@ this.props.i13n.executeEvent('pageview', { * `action` - The type of interaction, default set as `click`. * `label` - Useful for categorizing events, default set as the value of [i13nNode.getText](https://github.com/yahoo/react-i13n/blob/master/docs/api/I13nNode.md#gettexttarget). * `value` - Values must be non-negative. Useful to pass counts (e.g. 4 times). + * `nonInteraction` - Boolean to indicate a [non-interaction event](https://support.google.com/analytics/answer/1033068#NonInteractionEvents). You can integrate I13nAnchor provided by react-i13n to track the normal links. diff --git a/index.client.js b/index.client.js index 30a6c00..781beaa 100644 --- a/index.client.js +++ b/index.client.js @@ -2,6 +2,9 @@ var debug = require('debug')('GAI13nPlugin'); var DEFAULT_CATEGORY = 'all'; var DEFAULT_ACTION = 'click'; var DEFAULT_LABEL = ''; +var DEFAULT_VALUE = 0; +var DEFAULT_TRANSPORT = 'none'; +var DEFAULT_NON_INTERACTION = false; var _command = function (payload, callback) { ga.apply(this, [(payload.tracker ? (payload.tracker + '.') : '') + payload.commandName].concat(payload.arguments)); @@ -82,22 +85,26 @@ ReactI13nGoogleAnalytics.prototype.getPlugin = function () { */ click: function (payload, callback) { var i13nNode = payload.i13nNode; - var params = ['event'] if (i13nNode) { var model = i13nNode.getMergedModel(); - params.push(model.category || DEFAULT_CATEGORY); - params.push(model.action || DEFAULT_ACTION); - params.push(model.label || i13nNode.getText(payload.target) || DEFAULT_LABEL); - if (model.value) { - params.push(model.value); - } - params.push({ + var hitType = 'event'; + var params = { + hitType: hitType, + eventCategory: model.category || DEFAULT_CATEGORY, + eventAction: model.action || DEFAULT_ACTION, + eventLabel: model.label || i13nNode.getText(payload.target) || DEFAULT_LABEL, + eventValue: model.value || DEFAULT_VALUE, + transport: model.transport || DEFAULT_TRANSPORT, + nonInteraction: model.nonInteraction || DEFAULT_NON_INTERACTION, hitCallback: callback - }); + }; _command.call(this, { tracker: model.tracker || '', commandName: 'send', - arguments: params + arguments: [ + hitType, + params + ] }); } else { callback && callback(); diff --git a/tests/unit/index.client.js b/tests/unit/index.client.js index 9de4870..e766d38 100644 --- a/tests/unit/index.client.js +++ b/tests/unit/index.client.js @@ -99,15 +99,17 @@ describe('ga plugin client', function () { it('ga will fire event beacon for click handler', function (done) { var reactI13nGoogleAnalytics = new ReactI13nGoogleAnalytics('foo'); var tracker = 'myTracker'; - var i13nNode = new I13nNode(null, {tracker: tracker, category: 'foo', action: 'bar', label: 'baz', value: 1}); - global.ga = function (actionSend, actionName, category, action, label, value, options) { + var i13nNode = new I13nNode(null, {tracker: tracker, category: 'foo', action: 'bar', label: 'baz', nonInteraction: true, value: 1}); + global.ga = function (actionSend, actionName, fieldsObject) { expect(actionSend).to.eql(tracker + '.send'); expect(actionName).to.eql('event'); - expect(category).to.eql('foo'); - expect(action).to.eql('bar'); - expect(label).to.eql('baz'); - expect(value).to.eql(1); - options.hitCallback && options.hitCallback(); + expect(fieldsObject.eventCategory).to.eql('foo'); + expect(fieldsObject.eventAction).to.eql('bar'); + expect(fieldsObject.eventLabel).to.eql('baz'); + expect(fieldsObject.eventValue).to.eql(1); + expect(fieldsObject.nonInteraction).to.eql(true); + + fieldsObject.hitCallback && fieldsObject.hitCallback(); }; reactI13nGoogleAnalytics.getPlugin().eventHandlers.click({ i13nNode: i13nNode @@ -118,18 +120,20 @@ describe('ga plugin client', function () { it('ga will fire click for command handler with default tracker', function (done) { var reactI13nGoogleAnalytics = new ReactI13nGoogleAnalytics('foo'); - global.ga = function (actionSend, actionName, category, action) { + global.ga = function (actionSend, actionName, fieldsObject) { expect(actionSend).to.eql('send'); expect(actionName).to.eql('event'); - expect(category).to.eql('Outbound Link'); - expect(action).to.eql('click'); + expect(fieldsObject.eventCategory).to.eql('Outbound Link'); + expect(fieldsObject.eventAction).to.eql('click'); }; reactI13nGoogleAnalytics.getPlugin().eventHandlers.command({ commandName: 'send', arguments: [ 'event', - 'Outbound Link', - 'click' + { + eventCategory: 'Outbound Link', + eventAction: 'click' + } ] }, function beaconCallback () { done(); @@ -139,19 +143,21 @@ describe('ga plugin client', function () { it('ga will fire click for command handler with customized tracker', function (done) { var reactI13nGoogleAnalytics = new ReactI13nGoogleAnalytics('foo'); var tracker = 'myTracker'; - global.ga = function (actionSend, actionName, category, action) { + global.ga = function (actionSend, actionName, fieldsObject) { expect(actionSend).to.eql(tracker + '.send'); expect(actionName).to.eql('event'); - expect(category).to.eql('Outbound Link'); - expect(action).to.eql('click'); + expect(fieldsObject.eventCategory).to.eql('Outbound Link'); + expect(fieldsObject.eventAction).to.eql('click'); }; reactI13nGoogleAnalytics.getPlugin().eventHandlers.command({ tracker: tracker, commandName: 'send', arguments: [ 'event', - 'Outbound Link', - 'click' + { + eventCategory: 'Outbound Link', + eventAction: 'click' + } ] }, function beaconCallback () { done();