Skip to content

Commit

Permalink
HUB-97: Log choice of verify users
Browse files Browse the repository at this point in the history 
We'd like to see what choices exisiting Verify users make on the
service sign-in page. Therefore we're calling a Verify endpoint using
an ajax call and based on the user cookie to decide whether it's a
Verify user and report accordingly. This is a baseline test to learn about the users' behaviour.

Co-Authored-by: Jakub Miarka <[email protected]>
  • Loading branch information
@rachelthecodesmith
rachelthecodesmith and Jakub Miarka committed Jul 27, 2018
1 parent d8a3794 commit 9ee5f80
Show file tree
Hide file tree
Showing 2 changed files with 127 additions and 8 deletions.
34 changes: 29 additions & 5 deletions app/assets/javascripts/modules/track-radio-group.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,21 +8,45 @@ window.GOVUK.Modules = window.GOVUK.Modules || {};

GOVUK.Modules.TrackRadioGroup = function () {
this.start = function (element) {
element.on('submit', function (event) {
track(element)

checkVerifyUser(element)
}

function track (element, withHint) {
element.on('submit', function (event) {

var options = { transport: 'beacon' }

var $submittedForm = $(event.target)

var $checkedOption = $submittedForm.find('input:checked')

var checkedValue = $checkedOption.val()
var checkedValue = $checkedOption.val();

if (typeof checkedValue === 'undefined') {
checkedValue = 'submitted-without-choosing'
}

GOVUK.analytics.trackEvent('Radio button chosen', checkedValue, options)
GOVUK.analytics.trackEvent('Radio button chosen', checkedValue + (withHint ? '-with-hint' : ''), options)
})
}

function checkVerifyUser (element) {
$.ajax({
url: 'https://www.signin.service.gov.uk/hint',
cache: false,
dataType: 'jsonp',
timeout: 3000
}).then(function(data){
GOVUK.Modules.TrackRadioGroup.trackVerifyUser(element, data);
}, function(e){console.log("error", e)})
}

this.trackVerifyUser = function (element, data) {
if (data != null && data.value === true) {
GOVUK.analytics.trackEvent('verify-hint', 'shown', { transport: 'beacon'});
track(element, data.value);
}
}
}
})(window, window.GOVUK)
})(window, window.GOVUK);
101 changes: 98 additions & 3 deletions spec/javascripts/track-radio-group.spec.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
var $ = window.jQuery

describe('A radio group tracker', function () {
'use strict'


var GOVUK = window.GOVUK
var tracker
Expand All @@ -20,7 +20,7 @@ describe('A radio group tracker', function () {
'<form onsubmit="event.preventDefault()">' +
'<input type="radio" name="sign-in-option" value="government-gateway">' +
'<input type="radio" name="sign-in-option" value="govuk-verify">' +
'<input type="radio" name="sign-in-option" value="lost-account-details">' +
'<input type="radio" name="sign-in-option" value="create-an-account">' +
'<button>Submit</button>' +
'</form>' +
'</div>'
Expand All @@ -30,6 +30,7 @@ describe('A radio group tracker', function () {
tracker.start(element)
})


it('tracks government-gateway checked radio when clicking submit', function () {
element.find('input[value="government-gateway"]').trigger('click')
element.find('form').trigger('submit')
Expand All @@ -46,7 +47,101 @@ describe('A radio group tracker', function () {
expect(GOVUK.analytics.trackEvent).toHaveBeenCalledWith(
'Radio button chosen', 'govuk-verify', { transport: 'beacon' }
)
})
});

it('tracks govuk-verify-with-hint event when clicking submit if user has visited verify', function () {
var data = {
status: 'OK',
value: true
}
tracker.trackVerifyUser(element, data)
element.find('input[value="govuk-verify"]').trigger('click')
element.find('form').trigger('submit')

expect(GOVUK.analytics.trackEvent).toHaveBeenCalledWith(
'verify-hint', 'shown', { transport: 'beacon' }
)
expect(GOVUK.analytics.trackEvent).toHaveBeenCalledWith(
'Radio button chosen', 'govuk-verify', { transport: 'beacon' }
)
expect(GOVUK.analytics.trackEvent).toHaveBeenCalledWith(
'Radio button chosen', 'govuk-verify-with-hint', { transport: 'beacon' }
)
});

it('does not track govuk-verify-with-hint event when clicking submit if user has not visited verify', function () {
var data = {
status: 'OK',
value: false
}
tracker.trackVerifyUser(element, data)
expect(GOVUK.analytics.trackEvent).not.toHaveBeenCalledWith(
'verify-hint', 'shown', { transport: 'beacon' }
)
element.find('input[value="govuk-verify"]').trigger('click')
element.find('form').trigger('submit')

expect(GOVUK.analytics.trackEvent).toHaveBeenCalledWith(
'Radio button chosen', 'govuk-verify', { transport: 'beacon' }
)
expect(GOVUK.analytics.trackEvent).not.toHaveBeenCalledWith(
'Radio button chosen', 'govuk-verify-with-hint', { transport: 'beacon' }
)
});

it('does not track govuk-verify-with-hint event when clicking submit if verify value is not boolean', function () {
var data = {
status: 'OK',
value: 'bar'
}
tracker.trackVerifyUser(element, data)
element.find('input[value="govuk-verify"]').trigger('click')
element.find('form').trigger('submit')

expect(GOVUK.analytics.trackEvent).not.toHaveBeenCalledWith(
'verify-hint', 'shown', { transport: 'beacon' }
)
expect(GOVUK.analytics.trackEvent).toHaveBeenCalledWith(
'Radio button chosen', 'govuk-verify', { transport: 'beacon' }
)
expect(GOVUK.analytics.trackEvent).not.toHaveBeenCalledWith(
'Radio button chosen', 'govuk-verify-with-hint', { transport: 'beacon' }
)
});

it('does not track govuk-verify-with-hint event when clicking submit if verify response is null', function () {
var data = null
tracker.trackVerifyUser(element, data)
element.find('input[value="govuk-verify"]').trigger('click')
element.find('form').trigger('submit')

expect(GOVUK.analytics.trackEvent).not.toHaveBeenCalledWith(
'verify-hint', 'shown', { transport: 'beacon' }
)
expect(GOVUK.analytics.trackEvent).toHaveBeenCalledWith(
'Radio button chosen', 'govuk-verify', { transport: 'beacon' }
)
expect(GOVUK.analytics.trackEvent).not.toHaveBeenCalledWith(
'Radio button chosen', 'govuk-verify-with-hint', { transport: 'beacon' }
)
});

it('does not track govuk-verify-with-hint event when clicking submit if verify response is not an object', function () {
var data = 'string'
tracker.trackVerifyUser(element, data)
element.find('input[value="govuk-verify"]').trigger('click')
element.find('form').trigger('submit')

expect(GOVUK.analytics.trackEvent).not.toHaveBeenCalledWith(
'verify-hint', 'shown', { transport: 'beacon' }
)
expect(GOVUK.analytics.trackEvent).toHaveBeenCalledWith(
'Radio button chosen', 'govuk-verify', { transport: 'beacon' }
)
expect(GOVUK.analytics.trackEvent).not.toHaveBeenCalledWith(
'Radio button chosen', 'govuk-verify-with-hint', { transport: 'beacon' }
)
});

it('tracks no choice when clicking submit and checked nothing', function () {
element.find('form').trigger('submit')
Expand Down

0 comments on commit 9ee5f80

Please sign in to comment.