Commit e035e2bd authored by Savas Vedova's avatar Savas Vedova

Merge branch 'seleced-state-vulnerabilities-dashboard' into 'master'

Add selected state for chart button in vulnerabilities dashboard

See merge request gitlab-org/gitlab!54763
parents dc21769e 7e378cca
---
title: Add selected state for chart button in vulnerabilities dashboard
merge_request: 54763
author: Yogi (@yo)
type: changed
......@@ -35,7 +35,7 @@ export default {
<gl-button
v-for="day in days"
:key="day"
:class="{ active: activeDay === day }"
:class="{ selected: activeDay === day }"
:data-days="day"
@click="clickHandler(day)"
>
......
......@@ -18,7 +18,7 @@ describe('First class vulnerability chart component', () => {
const findTimeInfo = () => wrapper.find({ ref: 'timeInfo' });
const findChartButtons = () => wrapper.find(ChartButtons);
const findActiveChartButton = () => findChartButtons().find('.active');
const findActiveChartButton = () => findChartButtons().find('.selected');
const find90DaysChartButton = () => findChartButtons().find('[data-days="90"]');
const createComponent = ({ $apollo, propsData, stubs, data } = {}) => {
......
......@@ -26,7 +26,7 @@ describe('Vulnerability Chart Buttons', () => {
const activeDay = DAYS.ninety;
createWrapper({ activeDay });
const activeButton = wrapper.find('[data-days="90"].active');
const activeButton = wrapper.find('[data-days="90"].selected');
expect(activeButton.attributes('data-days')).toMatch('90');
});
......@@ -35,7 +35,7 @@ describe('Vulnerability Chart Buttons', () => {
const activeDay = DAYS.sixty;
createWrapper({ activeDay });
const activeButton = wrapper.find('[data-days="60"].active');
const activeButton = wrapper.find('[data-days="60"].selected');
expect(activeButton.attributes('data-days')).toMatch('60');
});
......@@ -44,7 +44,7 @@ describe('Vulnerability Chart Buttons', () => {
const activeDay = DAYS.thirty;
createWrapper({ activeDay });
const activeButton = wrapper.find('[data-days="30"].active');
const activeButton = wrapper.find('[data-days="30"].selected');
expect(activeButton.attributes('data-days')).toMatch('30');
});
......@@ -59,13 +59,13 @@ describe('Vulnerability Chart Buttons', () => {
it('should call the clickHandler', () => {
jest.spyOn(wrapper.vm, 'clickHandler');
wrapper.find('[data-days="30"].active').trigger('click', DAYS.thirty);
wrapper.find('[data-days="30"].selected').trigger('click', DAYS.thirty);
expect(wrapper.vm.clickHandler).toHaveBeenCalledWith(DAYS.thirty);
});
it('should emit a click event', () => {
wrapper.find('[data-days="30"].active').trigger('click', DAYS.thirty);
wrapper.find('[data-days="30"].selected').trigger('click', DAYS.thirty);
expect(wrapper.emitted().click[0]).toEqual([DAYS.thirty]);
});
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment