2020-03-13 15:44:24 +05:30
import { GlBreakpointInstance as bp } from '@gitlab/ui/dist/utils' ;
2022-07-16 23:28:13 +05:30
import { FIFTEEN _MINUTES _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' , ( ) => {
2022-10-11 01:57:18 +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 ) ;
} ) ;
2022-10-11 01:57:18 +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 ) ;
} ) ;
2022-10-11 01:57:18 +05:30
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 ) ;
} ) ;
2022-10-11 01:57:18 +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 ;
2022-07-16 23:28:13 +05:30
const WITHIN _FIFTEEN _MINUTES = LAST _ACCESSED + FIFTEEN _MINUTES _IN _MS ;
const OVER _FIFTEEN _MINUTES = WITHIN _FIFTEEN _MINUTES + 1 ;
2021-09-04 01:27:46 +05:30
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 `
2022-07-16 23:28:13 +05:30
desc | existingProps | newProps | expected
$ { 'updates item if accessed over 15 minutes ago' } | $ { { } } | $ { { lastAccessedOn : OVER _FIFTEEN _MINUTES } } | $ { { lastAccessedOn : Date . now ( ) , frequency : 2 } }
$ { 'does not update is accessed with 15 minutes' } | $ { { } } | $ { { lastAccessedOn : WITHIN _FIFTEEN _MINUTES } } | $ { { lastAccessedOn : EXISTING _ITEM . lastAccessedOn , frequency : 1 } }
$ { 'updates if lastAccessedOn not found' } | $ { { lastAccessedOn : undefined } } | $ { { lastAccessedOn : WITHIN _FIFTEEN _MINUTES } } | $ { { lastAccessedOn : Date . now ( ) , frequency : 2 } }
2021-09-04 01:27:46 +05:30
` (' $ 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
} ) ;