import $ from 'jquery'; import { setHTMLFixture } from './helpers/fixtures'; import Tracking from '~/tracking'; describe('Tracking', () => { beforeEach(() => { window.snowplow = window.snowplow || (() => {}); }); describe('.event', () => { let snowplowSpy = null; beforeEach(() => { snowplowSpy = jest.spyOn(window, 'snowplow'); }); it('tracks to snowplow (our current tracking system)', () => { Tracking.event('_category_', '_eventName_', { label: '_label_' }); expect(snowplowSpy).toHaveBeenCalledWith('trackStructEvent', '_category_', '_eventName_', { label: '_label_', property: '', value: '', }); }); it('skips tracking if snowplow is unavailable', () => { window.snowplow = false; Tracking.event('_category_', '_eventName_'); expect(snowplowSpy).not.toHaveBeenCalled(); }); }); describe('tracking interface events', () => { let eventSpy = null; let subject = null; beforeEach(() => { eventSpy = jest.spyOn(Tracking, 'event'); subject = new Tracking('_category_'); setHTMLFixture(`
`); }); it('binds to clicks on elements matching [data-track-event]', () => { subject.bind(document); $('[data-track-event="click_input1"]').click(); expect(eventSpy).toHaveBeenCalledWith('_category_', 'click_input1', { label: '_label_', value: '_value_', property: '', }); }); it('allows value override with the data-track-value attribute', () => { subject.bind(document); $('[data-track-event="click_input2"]').click(); expect(eventSpy).toHaveBeenCalledWith('_category_', 'click_input2', { label: '', value: '_value_override_', property: '', }); }); it('handles checkbox values correctly', () => { subject.bind(document); const $checkbox = $('[data-track-event="toggle_checkbox"]'); $checkbox.click(); // unchecking expect(eventSpy).toHaveBeenCalledWith('_category_', 'toggle_checkbox', { label: '', property: '', value: false, }); $checkbox.click(); // checking expect(eventSpy).toHaveBeenCalledWith('_category_', 'toggle_checkbox', { label: '', property: '', value: '_value_', }); }); it('handles bootstrap dropdowns', () => { new Tracking('_category_').bind(document); const $dropdown = $('[data-track-event="toggle_dropdown"]'); $dropdown.trigger('show.bs.dropdown'); // showing expect(eventSpy).toHaveBeenCalledWith('_category_', 'toggle_dropdown_show', { label: '', property: '', value: '', }); $dropdown.trigger('hide.bs.dropdown'); // hiding expect(eventSpy).toHaveBeenCalledWith('_category_', 'toggle_dropdown_hide', { label: '', property: '', value: '', }); }); }); });