Skip to content
This repository has been archived by the owner on Mar 18, 2021. It is now read-only.

Commit

Permalink
COM-20077-GA-event-doesnt-work
Browse files Browse the repository at this point in the history
  • Loading branch information
ciastektk committed Dec 12, 2018
1 parent a95fa38 commit d7bf42a
Show file tree
Hide file tree
Showing 18 changed files with 357 additions and 172 deletions.
4 changes: 3 additions & 1 deletion .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -34,7 +34,9 @@
!var/SymfonyRequirements.php
/vendor/
/web/bundles/

/node_modules/
/package-lock.json
/web/assets/js/compiled/
.php~

# Legacy related ignores, that are generated by composer (settings not handled out of the box)
Expand Down
14 changes: 8 additions & 6 deletions .travis.yml
Original file line number Diff line number Diff line change
@@ -1,8 +1,10 @@
# Tests cannot be run from metarepo - it's a public repository, which doesn't have access to private repositories on Travis (for security reasons).
# The actual test setup is in Page Builder bundle.
language: php
php:
- '5.6'
language: node_js

node_js:
- '11'

install:
- npm install

script:
- echo 'Test suite moved to PageBuilder bundle'
- npm test
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@

{% import _self as Helper %}

<div class="window">
<div class="window" data-ga-action="eZ launchpad documentation widget">
<div class="titlebar">
<div class="buttons">
<div class="close">
Expand Down
4 changes: 3 additions & 1 deletion app/Resources/views/themes/ezplatform/full/bundle.html.twig
Original file line number Diff line number Diff line change
@@ -1,13 +1,15 @@
{% extends '@ezdesign/pagelayout.html.twig' %}

{% block gaCategory %}packages{% endblock %}

{% block content %}
<div class="bundle">
<div class="container">
<div class="row">
<div class="col-12">
<div class="bundle__banner bundle__banner--orange">
<h1 class="bundle__header">{{ bundle.packageId }}</h1>
<a href="{{ ez_field_value(content, 'packagist_url') }}" class="bundle__header-btn">Install Package</a>
<a href="{{ ez_field_value(content, 'packagist_url') }}" class="bundle__header-btn" data-ga-action="Package Click" data-ga-label="{{ bundle.packageId }}">Install Package</a>
</div>
</div>
</div>
Expand Down
Original file line number Diff line number Diff line change
@@ -1,5 +1,7 @@
{% extends '@ezdesign/pagelayout.html.twig' %}

{% block gaCategory %}packages{% endblock %}

{% block content %}
<section class="bundle-list">
<div class="bundle-list__header">
Expand Down Expand Up @@ -66,7 +68,7 @@
}
} only %}
<div class="row">
<div class="button-load-more mx-auto pagerfanta">
<div class="mx-auto pagerfanta">
{{ pagerfanta(pager, 'bundles_list') }}
</div>
</div>
Expand Down
2 changes: 2 additions & 0 deletions app/Resources/views/themes/ezplatform/full/home.html.twig
Original file line number Diff line number Diff line change
@@ -1,5 +1,7 @@
{% extends '@ezdesign/pagelayout.html.twig' %}

{% block gaCategory %}downloads{% endblock %}

{% block main %}
<main class="white-background">
{% endblock %}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -25,4 +25,3 @@
</div>
</a>
</div>

5 changes: 4 additions & 1 deletion app/Resources/views/themes/ezplatform/pagelayout.html.twig
Original file line number Diff line number Diff line change
Expand Up @@ -35,7 +35,7 @@
{% block canonical %}
{% endblock %}
</head>
<body>
<body data-ga-category="{% block gaCategory %}{% endblock %}">
{% block main %}
<main>
{% endblock %}
Expand All @@ -60,6 +60,9 @@
'bundles/ezplatformadminuiassets/vendors/bootstrap/dist/js/bootstrap.min.js'
'assets/js/prism.js'
'assets/js/app.js'
'assets/js/Utils.js'
'assets/js/GoogleAnalyticsItem.js'
'assets/js/GoogleAnalyticsService.js'
%}
<script type="text/javascript" src="{{ asset_url }}"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/lightbox2/2.10.0/js/lightbox.min.js"></script>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -7,48 +7,47 @@
<ul class="nav nav-pills nav-justified" role="tablist">
{% if not ez_is_field_empty(content, 'composer_description') %}
<li class="nav-item">
<a href="#composer-option" class="nav-link active show" data-toggle="tab" role="tab">
<a href="#composer-option" class="nav-link active show" data-toggle="tab" data-ga-action="Composer tab" role="tab">
<img src="{{ asset('images/composer.svg', 'ezdesign') }}" alt="Download" class="download">
<div class="label">Composer</div>
<span class="label">Composer</span>
</a>
</li>
{% endif %}
<li class="nav-item">
<a href="#ezlaunchpad-option" class="nav-link" data-toggle="tab" role="tab">
<a href="#ezlaunchpad-option" class="nav-link" data-toggle="tab" data-ga-action="eZ launchpad tab" role="tab">
<img src="{{ asset('images/ez-launchpad.svg', 'ezdesign') }}" alt="eZ Launchpad" class="download">
<div class="label">eZ Launchpad</div>
<span class="label">eZ Launchpad</span>
</a>
</li>
{% if not ez_is_field_empty(content, 'platform_sh_description') %}
<li class="nav-item">
<a href="#platform-sh-option" class="nav-link" data-toggle="tab" role="tab">
<a href="#platform-sh-option" class="nav-link" data-toggle="tab" data-ga-action="platform.sh tab" role="tab">
<img src="{{ asset('images/platform-sh-logo.svg', 'ezdesign') }}" alt="Download" class="download">
<div class="label">platform.sh</div>
<span class="label">platform.sh</span>
</a>
</li>
{% endif %}
{% if not ez_is_field_empty(content, 'download_description') %}
<li class="nav-item">
<a href="#download-option" class="nav-link" data-toggle="tab" role="tab">
<a href="#download-option" class="nav-link" data-toggle="tab" data-ga-action="Download tab" role="tab">
<img src="{{ asset('images/download.svg', 'ezdesign') }}" alt="Download" class="download">
<div class="label">Download</div>
<span class="label">Download</span>
</a>
</li>
{% endif %}
</ul>

<div class="tab-content">
{% if not ez_is_field_empty(content, 'composer_description') %}
<div role="tabpanel" class="tab-pane active" id="composer-option">
<div class="details">
<h3>Composer</h3>
<div class="description text-center">
<div data-ga-action="Composer documentation" class="description text-center ga-link-listener">
{{ ez_render_field(content, 'composer_description') }}
</div>
</div>
<div class="launch text-center">
<img src="{{ asset('images/pulley-hero.svg', 'ezdesign') }}" alt="Platform.sh" class="hero">
<a href="//doc.ezplatform.com/en/latest/getting_started/install_using_composer/" class="btn btn-primary">Install with composer</a>
<a href="//doc.ezplatform.com/en/latest/getting_started/install_using_composer/" class="btn btn-primary" data-ga-action="Install with Composer">Install with composer</a>
</div>
</div>
{% endif %}
Expand All @@ -61,7 +60,6 @@
{{ ez_render_field(content, 'download_description') }}
</div>
</div>

<table class="table table-striped text-center download-table">
<thead>
<tr>
Expand All @@ -72,7 +70,7 @@
</thead>
<tbody>
{% if betas is not empty %}
<tr class="beta">
<tr class="beta" data-ga-action="Download" data-ga-label="{{ ez_field_value(release, 'release_version') }}">
<th scope="row">
<a href="{{ ez_field_value(betas|first, 'file') }}">{{ ez_render_field(betas|first, 'release_version') }}</a>
</th>
Expand All @@ -88,7 +86,7 @@
{% endif %}

{% for release in releases %}
<tr class="releases">
<tr class="releases" data-ga-action="Download" data-ga-label="{{ ez_field_value(release, 'release_version') }}">
<th scope="row"{% if ez_field_value(release, 'lts').bool %} class="lts"{% endif %}>
<a href="{{ ez_field_value(release, 'file') }}">{{ ez_render_field(release, 'release_version') }}</a>
</th>
Expand All @@ -107,7 +105,7 @@

<tr class="releases ezpublish">
<th colspan="3">
Looking for <a href="http://share.ez.no">eZ Publish / eZ Publish Platform</a> ?
Looking for <a href="http://share.ez.no" data-ga-action="Download eZ publish">eZ Publish / eZ Publish Platform</a> ?
</th>
</tr>
</tbody>
Expand All @@ -126,13 +124,13 @@

<div class="launch text-center">
<img src="{{ asset('images/platform-sh-rocket.svg', 'ezdesign') }}" alt="Platform.sh" class="rocket">
<a href="//accounts.platform.sh/platform/trial/ezplatform/setup?branch=demo" class="btn btn-primary">Deploy on platform.sh</a>
<a href="//accounts.platform.sh/platform/trial/ezplatform/setup?branch=demo" class="btn btn-primary" data-ga-action="platform.sh deploy">Deploy on platform.sh</a>
</div>
</div>
{% endif %}

<div role="tabpanel" class="tab-pane" id="ezlaunchpad-option">
<div class="details">
<div class="details" data-ga-action="eZ launchpad documentation">
<h3>eZ Launchpad</h3>
{% if content.fields['launchpad_description'] is defined and not ez_is_field_empty(content, 'launchpad_description') %}
<div class="description text-center">
Expand Down
23 changes: 23 additions & 0 deletions package.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,23 @@
{
"name": "ezplatform.com",
"version": "2.3.0",
"author": "eZ Systems",
"homepage": "ez.no",
"scripts": {
"test": "mocha ./test/*.spec.js"
},
"devDependencies": {
"chai": "^4.2.0",
"chai-dom": "^1.8.1",
"chai-subset": "^1.6.0",
"eslint": "^5.10.0",
"eslint-config-prettier": "^3.3.0",
"eslint-plugin-prettier": "^3.0.0",
"eslint-plugin-react": "^7.11.1",
"jquery": "^3.3.1",
"jsdom": "^13.0.0",
"mocha": "^5.2.0",
"prettier": "1.15.3",
"sinon": "^7.1.1"
}
}
44 changes: 44 additions & 0 deletions test/googleAnalyticsItem.spec.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,44 @@
const expect = require('chai').use(require('chai-subset')).expect,
GoogleAnalyticsItem = require('../web/assets/js/GoogleAnalyticsItem');

describe('GoogleAnalyticsItem', () => {
let gaItem;

beforeEach(() => {
gaItem = new GoogleAnalyticsItem('event', 'Downloads', 'Download', 'Label', 'Transport');
});

it('should return instance of GoogleAnalyticsItem', () => {
expect(gaItem).to.be.instanceOf(GoogleAnalyticsItem);
});

it('should be an object with own property hitType', () => {
expect(gaItem).to.be.an('object').that.has.own.property('hitType');
});

it('should be an object with own property eventCategory', () => {
expect(gaItem).to.be.an('object').that.has.own.property('eventCategory');
});

it('should be an object with own property eventAction', () => {
expect(gaItem).to.be.an('object').that.has.own.property('eventAction');
});

it('should be an object with own property eventLabel', () => {
expect(gaItem).to.be.an('object').that.has.own.property('eventLabel');
});

it('should be an object with own property transport', () => {
expect(gaItem).to.be.an('object').that.has.own.property('transport');
});

it('should be an object contain subset', () => {
expect(gaItem).to.be.an('object').that.containSubset({
'hitType': 'event',
'eventCategory': 'Downloads',
'eventAction': 'Download',
'eventLabel': 'Label',
'transport': 'Transport'
});
});
});
94 changes: 94 additions & 0 deletions test/googleAnalyticsService.spec.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,94 @@
const expect = require('chai').use(require('chai-dom')).expect;
const sinon = require('sinon');
const { JSDOM } = require('jsdom');
const GoogleAnalyticsService = require('../web/assets/js/GoogleAnalyticsService');
const GoogleAnalyticsItem = require('../web/assets/js/GoogleAnalyticsItem');

describe('GoogleAnalyticsService', () => {
let gaService;
let document;
let jQuery;
let eventClick;

const template = '/html/gaTemplate.html';
const gaDataAttr = 'data-ga-action';
const gaCategoryAttr = 'data-ga-category';
const gaLabelAttr = 'data-ga-label';

beforeEach(() => {
gaService = new GoogleAnalyticsService();
eventClick = sinon.spy();

return JSDOM.fromFile(__dirname + template)
.then(dom => {
document = dom.window.document;
jQuery = require('jquery')(dom.window);
jQuery(document).on('click', eventClick);

return document;
})
.catch(error => {
console.log(error);
});
});

it('should return instance of GoogleAnalyticsService', () => {
expect(gaService).to.be.instanceOf(GoogleAnalyticsService);
});

it('should find selectors with data attribute data-ga-action', () => {
expect(document.querySelectorAll(`[${gaDataAttr}]`)).not.to.have.lengthOf(0);
});

it('should return value for each data-ga-action attribute', () => {
const selectors = document.querySelectorAll(`[${gaDataAttr}]`);

selectors.forEach(selector => {
expect(gaService.getGAAction(selector), selector.outerHTML).not.to.have.lengthOf(0);
});
});

it('should return true if body has data-ga-category attribute', () => {
expect(document.body).to.have.attribute(gaCategoryAttr);
});

it('should return value for data-ga-category attribute', () => {
expect(document.querySelector(`[${gaCategoryAttr}]`).getAttribute(gaCategoryAttr)).not.to.have.lengthOf(0);
});

it('should return Google Analytics Label if data-ga-label attribute exists', () => {
const selectors = document.querySelectorAll(`[${gaLabelAttr}]`);

selectors.forEach(selector => {
expect(gaService.getGALabel(selector), selector.outerHTML).not.to.have.lengthOf(0);
});
});

it('should rewrite data attributes to child selector when ga-link-listener class exists', () => {
const selector = document.querySelector('.ga-link-listener');
const childSelector = gaService.rewriteByChildSelector(selector);

expect(childSelector.dataset).containSubset(selector.dataset);
});

it('should create GoogleAnalyticsItem object after click on data-ga-action event', () => {
const selectors = document.querySelectorAll(`[${gaDataAttr}]`);
let gaItem;

selectors.forEach(selector => {
selector.addEventListener('click', () => {
gaItem = new GoogleAnalyticsItem('event', 'Downloads', 'Download', 'Label', 'Transport');
});
jQuery(selector).click();
expect(gaItem).to.be.instanceOf(GoogleAnalyticsItem).that.containSubset({
'hitType': 'event',
'eventCategory': 'Downloads',
'eventAction': 'Download',
'eventLabel': 'Label',
'transport': 'Transport',
});
});

expect(eventClick.callCount).to.equal(selectors.length);
});
});
13 changes: 13 additions & 0 deletions test/html/gaTemplate.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
<!DOCTYPE html>
<html>
<head></head>
<body data-ga-category="category-name">
<p data-ga-action="action1">Action name</p>
<p data-ga-action="action2">Action name</p>
<p data-ga-label="label">Label</p>
<p data-ga-label="label2">Label</p>
<div class="ga-link-listener" data-ga-action="Action rewrite" data-ga-label="label">
<a href="#">Test</a>
</div>
</body>
</html>

0 comments on commit d7bf42a

Please sign in to comment.