ECOM-2430: Added the tracking GA events on dashboard
This commit is contained in:
aamir-khan
82
lms/static/js/dashboard/track_events.js
Normal file
82
lms/static/js/dashboard/track_events.js
Normal file
@@ -0,0 +1,82 @@
|
||||
/**
|
||||
* Track interaction with the student dashboard..
|
||||
*/
|
||||
|
||||
var edx = edx || {};
|
||||
|
||||
(function ($) {
|
||||
'use strict';
|
||||
|
||||
edx.dashboard = edx.dashboard || {};
|
||||
|
||||
// Generate the properties object to be passed along with business intelligence events.
|
||||
edx.dashboard.generateTrackProperties = function(element){
|
||||
var $el = $(element),
|
||||
properties = {};
|
||||
|
||||
properties.category = 'dashboard';
|
||||
properties.label = $el.data("course-key");
|
||||
|
||||
return properties;
|
||||
};
|
||||
|
||||
edx.dashboard.TrackEvents = function() {
|
||||
|
||||
var course_title_link = $(".course-title > a"),
|
||||
course_image_link = $(".cover"),
|
||||
enter_course_link = $(".enter-course"),
|
||||
options_dropdown = $(".wrapper-action-more"),
|
||||
course_learn_verified = $(".verified-info"),
|
||||
find_courses_btn = $(".btn-find-courses");
|
||||
|
||||
// Emit an event when the "course title link" is clicked.
|
||||
window.analytics.trackLink(
|
||||
course_title_link,
|
||||
"edx.bi.dashboard.course_title.clicked",
|
||||
edx.dashboard.generateTrackProperties
|
||||
);
|
||||
|
||||
// Emit an event when the "course image" is clicked.
|
||||
window.analytics.trackLink(
|
||||
course_image_link,
|
||||
"edx.bi.dashboard.course_image.clicked",
|
||||
edx.dashboard.generateTrackProperties
|
||||
);
|
||||
|
||||
// Emit an event when the "View Course" button is clicked.
|
||||
window.analytics.trackLink(
|
||||
enter_course_link,
|
||||
"edx.bi.dashboard.enter_course.clicked",
|
||||
edx.dashboard.generateTrackProperties
|
||||
);
|
||||
|
||||
// Emit an event when the options dropdown is engaged.
|
||||
window.analytics.trackLink(
|
||||
options_dropdown,
|
||||
"edx.bi.dashboard.course_options_dropdown.clicked",
|
||||
edx.dashboard.generateTrackProperties
|
||||
);
|
||||
|
||||
// Emit an event when the "Learn about verified" link is clicked.
|
||||
window.analytics.trackLink(
|
||||
course_learn_verified,
|
||||
"edx.bi.dashboard.verified_info_link.clicked",
|
||||
edx.dashboard.generateTrackProperties
|
||||
);
|
||||
|
||||
// Emit an event when the "Find Courses" button is clicked.
|
||||
window.analytics.trackLink(
|
||||
find_courses_btn,
|
||||
"edx.bi.dashboard.find_courses_button.clicked",
|
||||
{
|
||||
category: "dashboard",
|
||||
label: null
|
||||
}
|
||||
);
|
||||
|
||||
};
|
||||
|
||||
$(document).ready(function() {
|
||||
edx.dashboard.TrackEvents();
|
||||
});
|
||||
})(jQuery);
|
||||
22
lms/static/js/fixtures/dashboard/dashboard.html
Normal file
22
lms/static/js/fixtures/dashboard/dashboard.html
Normal file
@@ -0,0 +1,22 @@
|
||||
<a class="cover" data-course-key="edX/DemoX/Demo_Course" href="courses/edX/DemoX/Demo_Course/info">
|
||||
<img alt="DemoX" class="course-image" src="/path/to/image.jpg">
|
||||
</a>
|
||||
|
||||
<h3 class="course-title">
|
||||
<a data-course-key="edX/DemoX/Demo_Course">
|
||||
Introduction to edX
|
||||
</a>
|
||||
</h3>
|
||||
|
||||
<div class="wrapper-action-more" data-course-key="edX/DemoX/Demo_Course">
|
||||
</div>
|
||||
|
||||
<a data-course-key="edX/DemoX/Demo_Course" class="enter-course" href="/courses/edX/DemoX/Demo_Course/info">
|
||||
View Course
|
||||
</a>
|
||||
|
||||
<a data-course-key="edX/DemoX/Demo_Course" class="verified-info" href="/what_is_verified_cert">Learn more about the verified Certificate of Achievement</a>.
|
||||
|
||||
<a href="#" class="btn-find-courses">Find New Courses</a>
|
||||
|
||||
<a href="#" class="verified-info" data-course-key="edX/DemoX/Demo_Course"></a>
|
||||
77
lms/static/js/spec/dashboard/track_events_spec.js
Normal file
77
lms/static/js/spec/dashboard/track_events_spec.js
Normal file
@@ -0,0 +1,77 @@
|
||||
(function (define) {
|
||||
'use strict';
|
||||
define([
|
||||
'jquery',
|
||||
'js/dashboard/track_events'
|
||||
],
|
||||
function($) {
|
||||
|
||||
describe("edx.dashboard.TrackEvents", function() {
|
||||
|
||||
beforeEach(function() {
|
||||
// Stub the analytics event tracker
|
||||
window.analytics = jasmine.createSpyObj('analytics', ['track', 'page', 'trackLink']);
|
||||
loadFixtures('js/fixtures/dashboard/dashboard.html');
|
||||
window.edx.dashboard.TrackEvents();
|
||||
});
|
||||
|
||||
it("sends an analytics event when the user clicks course title link", function() {
|
||||
// Verify that analytics events fire when the "course title link" is clicked.
|
||||
expect(window.analytics.trackLink).toHaveBeenCalledWith(
|
||||
$(".course-title > a"),
|
||||
"edx.bi.dashboard.course_title.clicked",
|
||||
window.edx.dashboard.generateTrackProperties
|
||||
);
|
||||
});
|
||||
|
||||
it("sends an analytics event when the user clicks course image link", function() {
|
||||
// Verify that analytics events fire when the "course image link" is clicked.
|
||||
expect(window.analytics.trackLink).toHaveBeenCalledWith(
|
||||
$(".cover"),
|
||||
"edx.bi.dashboard.course_image.clicked",
|
||||
window.edx.dashboard.generateTrackProperties
|
||||
);
|
||||
});
|
||||
|
||||
|
||||
it("sends an analytics event when the user clicks enter course link", function() {
|
||||
// Verify that analytics events fire when the "enter course link" is clicked.
|
||||
expect(window.analytics.trackLink).toHaveBeenCalledWith(
|
||||
$(".enter-course"),
|
||||
"edx.bi.dashboard.enter_course.clicked",
|
||||
window.edx.dashboard.generateTrackProperties
|
||||
);
|
||||
});
|
||||
|
||||
it("sends an analytics event when the user clicks enter course link", function() {
|
||||
// Verify that analytics events fire when the options dropdown is engaged.
|
||||
expect(window.analytics.trackLink).toHaveBeenCalledWith(
|
||||
$(".wrapper-action-more"),
|
||||
"edx.bi.dashboard.course_options_dropdown.clicked",
|
||||
window.edx.dashboard.generateTrackProperties
|
||||
);
|
||||
});
|
||||
|
||||
it("sends an analytics event when the user clicks the learned about verified track link", function() {
|
||||
//Verify that analytics events fire when the "Learned about verified track" link is clicked.
|
||||
expect(window.analytics.trackLink).toHaveBeenCalledWith(
|
||||
$(".verified-info"),
|
||||
"edx.bi.dashboard.verified_info_link.clicked",
|
||||
window.edx.dashboard.generateTrackProperties
|
||||
);
|
||||
});
|
||||
|
||||
it("sends an analytics event when the user clicks find courses button", function() {
|
||||
// Verify that analytics events fire when the "user clicks find the course" button.
|
||||
expect(window.analytics.trackLink).toHaveBeenCalledWith(
|
||||
$(".btn-find-courses"),
|
||||
"edx.bi.dashboard.find_courses_button.clicked",
|
||||
{
|
||||
category: "dashboard",
|
||||
label: null
|
||||
}
|
||||
);
|
||||
});
|
||||
});
|
||||
});
|
||||
}).call(this, window.define);
|
||||
@@ -638,6 +638,7 @@
|
||||
'lms/include/js/spec/views/notification_spec.js',
|
||||
'lms/include/js/spec/views/file_uploader_spec.js',
|
||||
'lms/include/js/spec/dashboard/donation.js',
|
||||
'lms/include/js/spec/dashboard/track_events_spec.js',
|
||||
'lms/include/js/spec/groups/views/cohorts_spec.js',
|
||||
'lms/include/js/spec/shoppingcart/shoppingcart_spec.js',
|
||||
'lms/include/js/spec/instructor_dashboard/ecommerce_spec.js',
|
||||
|
||||
Reference in New Issue
Block a user