2020-03-13 15:44:24 +05:30
|
|
|
import { GlBreakpointInstance as bp } from '@gitlab/ui/dist/utils';
|
2021-03-11 19:13:27 +05:30
|
|
|
import { HOUR_IN_MS, FREQUENT_ITEMS } from '~/frequent_items/constants';
|
2020-02-01 01:16:34 +05:30
|
|
|
import {
|
|
|
|
isMobile,
|
|
|
|
getTopFrequentItems,
|
|
|
|
updateExistingFrequentItem,
|
|
|
|
sanitizeItem,
|
|
|
|
} from '~/frequent_items/utils';
|
2018-11-08 19:23:39 +05:30
|
|
|
import { mockProject, unsortedFrequentItems, sortedFrequentItems } from './mock_data';
|
|
|
|
|
|
|
|
describe('Frequent Items utils spec', () => {
|
|
|
|
describe('isMobile', () => {
|
2020-03-13 15:44:24 +05:30
|
|
|
it('returns true when the screen is medium ', () => {
|
2020-05-24 23:13:21 +05:30
|
|
|
jest.spyOn(bp, 'getBreakpointSize').mockReturnValue('md');
|
2020-03-13 15:44:24 +05:30
|
|
|
|
|
|
|
expect(isMobile()).toBe(true);
|
|
|
|
});
|
|
|
|
|
2018-11-08 19:23:39 +05:30
|
|
|
it('returns true when the screen is small ', () => {
|
2020-05-24 23:13:21 +05:30
|
|
|
jest.spyOn(bp, 'getBreakpointSize').mockReturnValue('sm');
|
2018-11-08 19:23:39 +05:30
|
|
|
|
|
|
|
expect(isMobile()).toBe(true);
|
|
|
|
});
|
|
|
|
|
|
|
|
it('returns true when the screen is extra-small ', () => {
|
2020-05-24 23:13:21 +05:30
|
|
|
jest.spyOn(bp, 'getBreakpointSize').mockReturnValue('xs');
|
2018-11-08 19:23:39 +05:30
|
|
|
|
|
|
|
expect(isMobile()).toBe(true);
|
|
|
|
});
|
|
|
|
|
2020-03-13 15:44:24 +05:30
|
|
|
it('returns false when the screen is larger than medium ', () => {
|
2020-05-24 23:13:21 +05:30
|
|
|
jest.spyOn(bp, 'getBreakpointSize').mockReturnValue('lg');
|
2018-11-08 19:23:39 +05:30
|
|
|
|
|
|
|
expect(isMobile()).toBe(false);
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
describe('getTopFrequentItems', () => {
|
|
|
|
it('returns empty array if no items provided', () => {
|
|
|
|
const result = getTopFrequentItems();
|
|
|
|
|
|
|
|
expect(result.length).toBe(0);
|
|
|
|
});
|
|
|
|
|
|
|
|
it('returns correct amount of items for mobile', () => {
|
2020-05-24 23:13:21 +05:30
|
|
|
jest.spyOn(bp, 'getBreakpointSize').mockReturnValue('md');
|
2018-11-08 19:23:39 +05:30
|
|
|
const result = getTopFrequentItems(unsortedFrequentItems);
|
|
|
|
|
|
|
|
expect(result.length).toBe(FREQUENT_ITEMS.LIST_COUNT_MOBILE);
|
|
|
|
});
|
|
|
|
|
|
|
|
it('returns correct amount of items for desktop', () => {
|
2020-05-24 23:13:21 +05:30
|
|
|
jest.spyOn(bp, 'getBreakpointSize').mockReturnValue('xl');
|
2018-11-08 19:23:39 +05:30
|
|
|
const result = getTopFrequentItems(unsortedFrequentItems);
|
|
|
|
|
|
|
|
expect(result.length).toBe(FREQUENT_ITEMS.LIST_COUNT_DESKTOP);
|
|
|
|
});
|
|
|
|
|
|
|
|
it('sorts frequent items in order of frequency and lastAccessedOn', () => {
|
2020-05-24 23:13:21 +05:30
|
|
|
jest.spyOn(bp, 'getBreakpointSize').mockReturnValue('xl');
|
2018-11-08 19:23:39 +05:30
|
|
|
const result = getTopFrequentItems(unsortedFrequentItems);
|
|
|
|
const expectedResult = sortedFrequentItems.slice(0, FREQUENT_ITEMS.LIST_COUNT_DESKTOP);
|
|
|
|
|
|
|
|
expect(result).toEqual(expectedResult);
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
describe('updateExistingFrequentItem', () => {
|
2021-09-04 01:27:46 +05:30
|
|
|
const LAST_ACCESSED = 1497979281815;
|
|
|
|
const WITHIN_AN_HOUR = LAST_ACCESSED + HOUR_IN_MS;
|
|
|
|
const OVER_AN_HOUR = WITHIN_AN_HOUR + 1;
|
|
|
|
const EXISTING_ITEM = Object.freeze({
|
|
|
|
...mockProject,
|
|
|
|
frequency: 1,
|
|
|
|
lastAccessedOn: 1497979281815,
|
2018-11-08 19:23:39 +05:30
|
|
|
});
|
|
|
|
|
2021-09-04 01:27:46 +05:30
|
|
|
it.each`
|
|
|
|
desc | existingProps | newProps | expected
|
|
|
|
${'updates item if accessed over an hour ago'} | ${{}} | ${{ lastAccessedOn: OVER_AN_HOUR }} | ${{ lastAccessedOn: Date.now(), frequency: 2 }}
|
|
|
|
${'does not update is accessed with an hour'} | ${{}} | ${{ lastAccessedOn: WITHIN_AN_HOUR }} | ${{ lastAccessedOn: EXISTING_ITEM.lastAccessedOn, frequency: 1 }}
|
|
|
|
${'updates if lastAccessedOn not found'} | ${{ lastAccessedOn: undefined }} | ${{ lastAccessedOn: WITHIN_AN_HOUR }} | ${{ lastAccessedOn: Date.now(), frequency: 2 }}
|
|
|
|
`('$desc', ({ existingProps, newProps, expected }) => {
|
2018-11-08 19:23:39 +05:30
|
|
|
const newItem = {
|
2021-09-04 01:27:46 +05:30
|
|
|
...EXISTING_ITEM,
|
|
|
|
...newProps,
|
2018-11-08 19:23:39 +05:30
|
|
|
};
|
2021-09-04 01:27:46 +05:30
|
|
|
const existingItem = {
|
|
|
|
...EXISTING_ITEM,
|
|
|
|
...existingProps,
|
2018-11-08 19:23:39 +05:30
|
|
|
};
|
|
|
|
|
2021-09-04 01:27:46 +05:30
|
|
|
const result = updateExistingFrequentItem(existingItem, newItem);
|
|
|
|
|
|
|
|
expect(result).toEqual({
|
|
|
|
...newItem,
|
|
|
|
...expected,
|
|
|
|
});
|
2018-11-08 19:23:39 +05:30
|
|
|
});
|
|
|
|
});
|
2020-02-01 01:16:34 +05:30
|
|
|
|
|
|
|
describe('sanitizeItem', () => {
|
|
|
|
it('strips HTML tags for name and namespace', () => {
|
|
|
|
const input = {
|
|
|
|
name: '<br><b>test</b>',
|
|
|
|
namespace: '<br>test',
|
|
|
|
id: 1,
|
|
|
|
};
|
|
|
|
|
|
|
|
expect(sanitizeItem(input)).toEqual({ name: 'test', namespace: 'test', id: 1 });
|
|
|
|
});
|
2020-03-28 13:19:24 +05:30
|
|
|
|
|
|
|
it("skips `name` key if it doesn't exist on the item", () => {
|
|
|
|
const input = {
|
|
|
|
namespace: '<br>test',
|
|
|
|
id: 1,
|
|
|
|
};
|
|
|
|
|
|
|
|
expect(sanitizeItem(input)).toEqual({ namespace: 'test', id: 1 });
|
|
|
|
});
|
|
|
|
|
|
|
|
it("skips `namespace` key if it doesn't exist on the item", () => {
|
|
|
|
const input = {
|
|
|
|
name: '<br><b>test</b>',
|
|
|
|
id: 1,
|
|
|
|
};
|
|
|
|
|
|
|
|
expect(sanitizeItem(input)).toEqual({ name: 'test', id: 1 });
|
|
|
|
});
|
2020-02-01 01:16:34 +05:30
|
|
|
});
|
2018-11-08 19:23:39 +05:30
|
|
|
});
|