Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Support
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in / Register
Toggle navigation
G
gitlab-ce
Project overview
Project overview
Details
Activity
Releases
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Issues
0
Issues
0
List
Boards
Labels
Milestones
Merge Requests
1
Merge Requests
1
Analytics
Analytics
Repository
Value Stream
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Create a new issue
Commits
Issue Boards
Open sidebar
nexedi
gitlab-ce
Commits
29017076
Commit
29017076
authored
Apr 09, 2020
by
Doug Stull
Committed by
Phil Hughes
Apr 09, 2020
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
Track user dropdown click
- when buy ci minutes shows as per spec
parent
428f35cc
Changes
4
Hide whitespace changes
Inline
Side-by-side
Showing
4 changed files
with
86 additions
and
33 deletions
+86
-33
app/assets/javascripts/header.js
app/assets/javascripts/header.js
+19
-0
app/views/layouts/header/_default.html.haml
app/views/layouts/header/_default.html.haml
+1
-1
ee/app/views/layouts/header/_buy_ci_minutes.html.haml
ee/app/views/layouts/header/_buy_ci_minutes.html.haml
+1
-1
spec/frontend/header_spec.js
spec/frontend/header_spec.js
+65
-31
No files found.
app/assets/javascripts/header.js
View file @
29017076
...
...
@@ -5,6 +5,7 @@ import { highCountTrim } from '~/lib/utils/text_utility';
import
SetStatusModalTrigger
from
'
./set_status_modal/set_status_modal_trigger.vue
'
;
import
SetStatusModalWrapper
from
'
./set_status_modal/set_status_modal_wrapper.vue
'
;
import
{
parseBoolean
}
from
'
~/lib/utils/common_utils
'
;
import
Tracking
from
'
~/tracking
'
;
/**
* Updates todo counter when todos are toggled.
...
...
@@ -73,6 +74,24 @@ function initStatusTriggers() {
}
}
export
function
initNavUserDropdownTracking
()
{
const
el
=
document
.
querySelector
(
'
.js-nav-user-dropdown
'
);
const
buyEl
=
document
.
querySelector
(
'
.js-buy-ci-minutes-link
'
);
if
(
el
&&
buyEl
)
{
const
{
trackLabel
,
trackProperty
}
=
buyEl
.
dataset
;
const
trackEvent
=
'
show_buy_ci_minutes
'
;
$
(
el
).
on
(
'
shown.bs.dropdown
'
,
()
=>
{
Tracking
.
event
(
undefined
,
trackEvent
,
{
label
:
trackLabel
,
property
:
trackProperty
,
});
});
}
}
document
.
addEventListener
(
'
DOMContentLoaded
'
,
()
=>
{
requestIdleCallback
(
initStatusTriggers
);
initNavUserDropdownTracking
();
});
app/views/layouts/header/_default.html.haml
View file @
29017076
...
...
@@ -65,7 +65,7 @@
.dropdown-menu.dropdown-menu-right
=
render
'layouts/header/help_dropdown'
-
if
header_link?
(
:user_dropdown
)
%li
.nav-item.header-user.dropdown
{
data:
{
track_label:
"profile_dropdown"
,
track_event:
"click_dropdown"
,
track_value:
""
,
qa_selector:
'user_menu'
},
class:
(
'mr-0'
if
has_impersonation_link
)
}
%li
.nav-item.header-user.
js-nav-user-dropdown.
dropdown
{
data:
{
track_label:
"profile_dropdown"
,
track_event:
"click_dropdown"
,
track_value:
""
,
qa_selector:
'user_menu'
},
class:
(
'mr-0'
if
has_impersonation_link
)
}
=
link_to
current_user
,
class:
user_dropdown_class
,
data:
{
toggle:
"dropdown"
}
do
=
image_tag
avatar_icon_for_user
(
current_user
,
23
),
width:
23
,
height:
23
,
class:
"header-user-avatar qa-user-avatar"
=
render_if_exists
'layouts/header/user_notification_dot'
,
project:
project
,
namespace:
group
...
...
ee/app/views/layouts/header/_buy_ci_minutes.html.haml
View file @
29017076
...
...
@@ -2,7 +2,7 @@
%li
=
link_to
profile_pipeline_quota_path
,
class:
'ci-minutes-emoji'
,
class:
'ci-minutes-emoji
js-buy-ci-minutes-link
'
,
data:
{
'track-event'
:
'click_buy_ci_minutes'
,
'track-label'
:
current_user
.
namespace
.
actual_plan_name
,
'track-property'
:
'user_dropdown'
}
do
=
s_
(
"CurrentUser|Buy CI minutes"
)
=
emoji_icon
(
'clock9'
,
'aria-hidden'
:
true
)
spec/frontend/header_spec.js
View file @
29017076
import
$
from
'
jquery
'
;
import
initTodoToggle
from
'
~/header
'
;
import
initTodoToggle
,
{
initNavUserDropdownTracking
}
from
'
~/header
'
;
import
{
mockTracking
,
unmockTracking
}
from
'
helpers/tracking_helper
'
;
describe
(
'
Header
'
,
()
=>
{
const
todosPendingCount
=
'
.todos-count
'
;
const
fixtureTemplate
=
'
issues/open-issue.html
'
;
describe
(
'
Todos notification
'
,
()
=>
{
const
todosPendingCount
=
'
.todos-count
'
;
const
fixtureTemplate
=
'
issues/open-issue.html
'
;
function
isTodosCountHidden
()
{
return
$
(
todosPendingCount
).
hasClass
(
'
hidden
'
);
}
function
isTodosCountHidden
()
{
return
$
(
todosPendingCount
).
hasClass
(
'
hidden
'
);
}
function
triggerToggle
(
newCount
)
{
$
(
document
).
trigger
(
'
todo:toggle
'
,
newCount
);
}
function
triggerToggle
(
newCount
)
{
$
(
document
).
trigger
(
'
todo:toggle
'
,
newCount
);
}
preloadFixtures
(
fixtureTemplate
);
beforeEach
(()
=>
{
initTodoToggle
();
loadFixtures
(
fixtureTemplate
);
});
preloadFixtures
(
fixtureTemplate
);
beforeEach
(()
=>
{
initTodoToggle
();
loadFixtures
(
fixtureTemplate
);
});
it
(
'
should update todos-count after receiving the todo:toggle event
'
,
()
=>
{
triggerToggle
(
5
);
it
(
'
should update todos-count after receiving the todo:toggle event
'
,
()
=>
{
triggerToggle
(
5
);
expect
(
$
(
todosPendingCount
).
text
()).
toEqual
(
'
5
'
);
});
expect
(
$
(
todosPendingCount
).
text
()).
toEqual
(
'
5
'
);
});
it
(
'
should hide todos-count when it is 0
'
,
()
=>
{
triggerToggle
(
0
);
it
(
'
should hide todos-count when it is 0
'
,
()
=>
{
triggerToggle
(
0
);
expect
(
isTodosCountHidden
()).
toEqual
(
true
);
});
expect
(
isTodosCountHidden
()).
toEqual
(
true
);
});
it
(
'
should show todos-count when it is more than 0
'
,
()
=>
{
triggerToggle
(
10
);
expect
(
isTodosCountHidden
()).
toEqual
(
false
);
});
describe
(
'
when todos-count is 1000
'
,
()
=>
{
beforeEach
(()
=>
{
triggerToggle
(
1000
);
});
it
(
'
should show todos-count when it is more than 0
'
,
()
=>
{
triggerToggle
(
10
);
it
(
'
should show todos-count
'
,
()
=>
{
expect
(
isTodosCountHidden
()).
toEqual
(
false
);
});
expect
(
isTodosCountHidden
()).
toEqual
(
false
);
it
(
'
should show 99+ for todos-count
'
,
()
=>
{
expect
(
$
(
todosPendingCount
).
text
()).
toEqual
(
'
99+
'
);
});
});
});
describe
(
'
when todos-count is 1000
'
,
()
=>
{
describe
(
'
Track user dropdown open
'
,
()
=>
{
let
trackingSpy
;
beforeEach
(()
=>
{
triggerToggle
(
1000
);
setFixtures
(
`
<li class="js-nav-user-dropdown">
<a class="js-buy-ci-minutes-link" data-track-event="click_buy_ci_minutes" data-track-label="free" data-track-property="user_dropdown">Buy CI minutes
</a>
</li>`
);
trackingSpy
=
mockTracking
(
'
_category_
'
,
$
(
'
.js-nav-user-dropdown
'
).
element
,
jest
.
spyOn
);
document
.
body
.
dataset
.
page
=
'
some:page
'
;
initNavUserDropdownTracking
();
});
it
(
'
should show todos-count
'
,
()
=>
{
expect
(
isTodosCountHidden
()).
toEqual
(
false
);
afterEach
(
()
=>
{
unmockTracking
(
);
});
it
(
'
should show 99+ for todos-count
'
,
()
=>
{
expect
(
$
(
todosPendingCount
).
text
()).
toEqual
(
'
99+
'
);
it
(
'
sends a tracking event when the dropdown is opened and contains Buy CI minutes link
'
,
()
=>
{
$
(
'
.js-nav-user-dropdown
'
).
trigger
(
'
shown.bs.dropdown
'
);
expect
(
trackingSpy
).
toHaveBeenCalledTimes
(
1
);
expect
(
trackingSpy
).
toHaveBeenCalledWith
(
undefined
,
'
show_buy_ci_minutes
'
,
{
label
:
'
free
'
,
property
:
'
user_dropdown
'
,
});
});
});
});
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment