import setWindowLocation from 'helpers/set_window_location_helper'; import { TEST_HOST } from 'helpers/test_constants'; import * as urlUtils from '~/lib/utils/url_utility'; import { safeUrls, unsafeUrls } from './mock_data'; const shas = { valid: [ 'ad9be38573f9ee4c4daec22673478c2dd1d81cd8', '76e07a692f65a2f4fd72f107a3e83908bea9b7eb', '9dd8f215b1e8605b1d59eaf9df1178081cda0aaf', 'f2e0be58c4091b033203bae1cc0302febd54117d', ], invalid: [ 'zd9be38573f9ee4c4daec22673478c2dd1d81cd8', ':6e07a692f65a2f4fd72f107a3e83908bea9b7eb', '-dd8f215b1e8605b1d59eaf9df1178081cda0aaf', ' 2e0be58c4091b033203bae1cc0302febd54117d', ], }; beforeEach(() => { setWindowLocation(TEST_HOST); }); describe('URL utility', () => { describe('parseUrlPathname', () => { it('returns an absolute url when given an absolute url', () => { expect(urlUtils.parseUrlPathname('/some/absolute/url')).toBe('/some/absolute/url'); }); it('returns an absolute url when given a relative url', () => { expect(urlUtils.parseUrlPathname('some/relative/url')).toBe('/some/relative/url'); }); it('returns an absolute url that includes the document.location path when given a relative url', () => { // Change the location to see the `/mypath/` included in the result setWindowLocation(`${TEST_HOST}/mypath/`); expect(urlUtils.parseUrlPathname('some/relative/url')).toBe('/mypath/some/relative/url'); }); it('encodes certain character in the url', () => { expect(urlUtils.parseUrlPathname('test="a b"')).toBe('/test=%22a%20b%22'); }); }); describe('webIDEUrl', () => { it('escapes special characters', () => { expect(urlUtils.webIDEUrl('/gitlab-org/gitlab-#-foss/merge_requests/1')).toBe( '/-/ide/project/gitlab-org/gitlab-%23-foss/merge_requests/1', ); }); describe('without relative_url_root', () => { it('returns IDE path with route', () => { expect(urlUtils.webIDEUrl('/gitlab-org/gitlab-foss/merge_requests/1')).toBe( '/-/ide/project/gitlab-org/gitlab-foss/merge_requests/1', ); }); }); describe('with relative_url_root', () => { beforeEach(() => { gon.relative_url_root = '/gitlab'; }); it('returns IDE path with route', () => { expect(urlUtils.webIDEUrl('/gitlab/gitlab-org/gitlab-foss/merge_requests/1')).toBe( '/gitlab/-/ide/project/gitlab-org/gitlab-foss/merge_requests/1', ); }); }); }); describe('getParameterValues', () => { beforeEach(() => { setWindowLocation('https://gitlab.com?test=passing&multiple=1&multiple=2'); }); it('returns empty array for no params', () => { expect(urlUtils.getParameterValues()).toEqual([]); }); it('returns empty array for non-matching params', () => { expect(urlUtils.getParameterValues('notFound')).toEqual([]); }); it('returns single match', () => { expect(urlUtils.getParameterValues('test')).toEqual(['passing']); }); it('returns multiple matches', () => { expect(urlUtils.getParameterValues('multiple')).toEqual(['1', '2']); }); it('accepts url as second arg', () => { const url = 'https://gitlab.com?everything=works'; expect(urlUtils.getParameterValues('everything', url)).toEqual(['works']); expect(urlUtils.getParameterValues('test', url)).toEqual([]); }); }); describe('mergeUrlParams', () => { const { mergeUrlParams } = urlUtils; it('adds w', () => { expect(mergeUrlParams({ w: 1 }, '#frag')).toBe('?w=1#frag'); expect(mergeUrlParams({ w: 1 }, '')).toBe('?w=1'); expect(mergeUrlParams({ w: 1 }, '/path#frag')).toBe('/path?w=1#frag'); expect(mergeUrlParams({ w: 1 }, 'https://host/path')).toBe('https://host/path?w=1'); expect(mergeUrlParams({ w: 1 }, 'https://host/path#frag')).toBe('https://host/path?w=1#frag'); expect(mergeUrlParams({ w: 1 }, 'https://h/p?k1=v1#frag')).toBe('https://h/p?k1=v1&w=1#frag'); expect(mergeUrlParams({ w: 'null' }, '')).toBe('?w=null'); }); it('adds multiple params', () => { expect(mergeUrlParams({ a: 1, b: 2, c: 3 }, '#frag')).toBe('?a=1&b=2&c=3#frag'); }); it('updates w', () => { expect(mergeUrlParams({ w: 2 }, '/path?w=1#frag')).toBe('/path?w=2#frag'); expect(mergeUrlParams({ w: 2 }, 'https://host/path?w=1')).toBe('https://host/path?w=2'); }); it('removes null w', () => { expect(mergeUrlParams({ w: null }, '?w=1#frag')).toBe('#frag'); expect(mergeUrlParams({ w: null }, '/path?w=1#frag')).toBe('/path#frag'); expect(mergeUrlParams({ w: null }, 'https://host/path?w=1')).toBe('https://host/path'); expect(mergeUrlParams({ w: null }, 'https://host/path?w=1#frag')).toBe( 'https://host/path#frag', ); expect(mergeUrlParams({ w: null }, 'https://h/p?k1=v1&w=1#frag')).toBe( 'https://h/p?k1=v1#frag', ); }); it('adds and updates encoded param values', () => { expect(mergeUrlParams({ foo: '&', q: '?' }, '?foo=%23#frag')).toBe('?foo=%26&q=%3F#frag'); expect(mergeUrlParams({ foo: 'a value' }, '')).toBe('?foo=a%20value'); expect(mergeUrlParams({ foo: 'a value' }, '?foo=1')).toBe('?foo=a%20value'); }); it('adds and updates encoded param names', () => { expect(mergeUrlParams({ 'a name': 1 }, '')).toBe('?a%20name=1'); expect(mergeUrlParams({ 'a name': 2 }, '?a%20name=1')).toBe('?a%20name=2'); expect(mergeUrlParams({ 'a name': null }, '?a%20name=1')).toBe(''); }); it('treats "+" as "%20"', () => { expect(mergeUrlParams({ ref: 'bogus' }, '?a=lorem+ipsum&ref=charlie')).toBe( '?a=lorem%20ipsum&ref=bogus', ); }); it('treats question marks and slashes as part of the query', () => { expect(mergeUrlParams({ ending: '!' }, '?ending=?&foo=bar')).toBe('?ending=!&foo=bar'); expect(mergeUrlParams({ ending: '!' }, 'https://host/path?ending=?&foo=bar')).toBe( 'https://host/path?ending=!&foo=bar', ); expect(mergeUrlParams({ ending: '?' }, '?ending=!&foo=bar')).toBe('?ending=%3F&foo=bar'); expect(mergeUrlParams({ ending: '?' }, 'https://host/path?ending=!&foo=bar')).toBe( 'https://host/path?ending=%3F&foo=bar', ); expect(mergeUrlParams({ ending: '!', op: '+' }, '?ending=?&op=/')).toBe('?ending=!&op=%2B'); expect(mergeUrlParams({ ending: '!', op: '+' }, 'https://host/path?ending=?&op=/')).toBe( 'https://host/path?ending=!&op=%2B', ); expect(mergeUrlParams({ op: '+' }, '?op=/&foo=bar')).toBe('?op=%2B&foo=bar'); expect(mergeUrlParams({ op: '+' }, 'https://host/path?op=/&foo=bar')).toBe( 'https://host/path?op=%2B&foo=bar', ); }); it('sorts params in alphabetical order with sort option', () => { expect(mergeUrlParams({ c: 'c', b: 'b', a: 'a' }, 'https://host/path', { sort: true })).toBe( 'https://host/path?a=a&b=b&c=c', ); expect( mergeUrlParams({ alpha: 'alpha' }, 'https://host/path?op=/&foo=bar', { sort: true }), ).toBe('https://host/path?alpha=alpha&foo=bar&op=%2F'); }); describe('with spread array option', () => { const spreadArrayOptions = { spreadArrays: true }; it('maintains multiple values', () => { expect(mergeUrlParams({}, '?array[]=foo&array[]=bar', spreadArrayOptions)).toBe( '?array[]=foo&array[]=bar', ); }); it('overrides multiple values with one', () => { expect( mergeUrlParams({ array: ['baz'] }, '?array[]=foo&array[]=bar', spreadArrayOptions), ).toBe('?array[]=baz'); }); it('removes existing params', () => { expect( mergeUrlParams({ array: null }, '?array[]=foo&array[]=bar', spreadArrayOptions), ).toBe(''); }); it('removes existing params and keeps others', () => { expect( mergeUrlParams( { array: null }, '?array[]=foo&array[]=bar&other=quis', spreadArrayOptions, ), ).toBe('?other=quis'); }); it('removes existing params along others', () => { expect( mergeUrlParams( { array: null, other: 'quis' }, '?array[]=foo&array[]=bar', spreadArrayOptions, ), ).toBe('?other=quis'); }); it('handles empty arrays along other parameters', () => { expect(mergeUrlParams({ array: [], other: 'quis' }, '?array=baz', spreadArrayOptions)).toBe( '?array[]=&other=quis', ); }); it('handles multiple values along other parameters', () => { expect( mergeUrlParams( { array: ['foo', 'bar'], other: 'quis' }, '?array=baz', spreadArrayOptions, ), ).toBe('?array[]=foo&array[]=bar&other=quis'); }); it('handles array values with encoding', () => { expect( mergeUrlParams({ array: ['foo+', 'bar,baz'] }, '?array[]=%2Fbaz', spreadArrayOptions), ).toBe('?array[]=foo%2B&array[]=bar%2Cbaz'); }); it('handles multiple arrays', () => { expect( mergeUrlParams( { array1: ['foo+', 'bar,baz'], array2: ['quis', 'quux'] }, '?array1[]=%2Fbaz', spreadArrayOptions, ), ).toBe('?array1[]=foo%2B&array1[]=bar%2Cbaz&array2[]=quis&array2[]=quux'); }); }); describe('without spread array option', () => { it('maintains multiple values', () => { expect(mergeUrlParams({}, '?array=foo%2Cbar')).toBe('?array=foo%2Cbar'); }); it('overrides multiple values with one', () => { expect(mergeUrlParams({ array: ['baz'] }, '?array=foo%2Cbar')).toBe('?array=baz'); }); it('removes existing params', () => { expect(mergeUrlParams({ array: null }, '?array=foo%2Cbar')).toBe(''); }); it('removes existing params and keeps others', () => { expect(mergeUrlParams({ array: null }, '?array=foo&array=bar&other=quis')).toBe( '?other=quis', ); }); it('removes existing params along others', () => { expect(mergeUrlParams({ array: null, other: 'quis' }, '?array=foo&array=bar')).toBe( '?other=quis', ); }); it('handles empty arrays along other parameters', () => { expect(mergeUrlParams({ array: [], other: 'quis' }, '?array=baz')).toBe( '?array=&other=quis', ); }); it('handles multiple values along other parameters', () => { expect(mergeUrlParams({ array: ['foo', 'bar'], other: 'quis' }, '?array=baz')).toBe( '?array=foo%2Cbar&other=quis', ); }); it('handles array values with encoding', () => { expect(mergeUrlParams({ array: ['foo+', 'bar,baz'] }, '?array=%2Fbaz')).toBe( '?array=foo%2B%2Cbar%2Cbaz', ); }); it('handles multiple arrays', () => { expect( mergeUrlParams( { array1: ['foo+', 'bar,baz'], array2: ['quis', 'quux'] }, '?array1=%2Fbaz', ), ).toBe('?array1=foo%2B%2Cbar%2Cbaz&array2=quis%2Cquux'); }); }); }); describe('removeParams', () => { describe('when url is passed', () => { it('removes query param with encoded ampersand', () => { const url = urlUtils.removeParams(['filter'], '/mail?filter=n%3Djoe%26l%3Dhome'); expect(url).toBe('/mail'); }); it('should remove param when url has no other params', () => { const url = urlUtils.removeParams(['size'], '/feature/home?size=5'); expect(url).toBe('/feature/home'); }); it('should remove param when url has other params', () => { const url = urlUtils.removeParams(['size'], '/feature/home?q=1&size=5&f=html'); expect(url).toBe('/feature/home?q=1&f=html'); }); it('should remove param and preserve fragment', () => { const url = urlUtils.removeParams(['size'], '/feature/home?size=5#H2'); expect(url).toBe('/feature/home#H2'); }); it('should remove multiple params', () => { const url = urlUtils.removeParams(['z', 'a'], '/home?z=11111&l=en_US&a=true#H2'); expect(url).toBe('/home?l=en_US#H2'); }); }); }); describe('doesHashExistInUrl', () => { beforeEach(() => { setWindowLocation('#note_1'); }); it('should return true when the given string exists in the URL hash', () => { expect(urlUtils.doesHashExistInUrl('note_')).toBe(true); }); it('should return false when the given string does not exist in the URL hash', () => { expect(urlUtils.doesHashExistInUrl('doesnotexist')).toBe(false); }); }); describe('urlContainsSha', () => { it('returns true when there is a valid 40-character SHA1 hash in the URL', () => { shas.valid.forEach((sha) => { expect(urlUtils.urlContainsSha({ url: `http://urlstuff/${sha}/moreurlstuff` })).toBe(true); }); }); it('returns false when there is not a valid 40-character SHA1 hash in the URL', () => { shas.invalid.forEach((str) => { expect(urlUtils.urlContainsSha({ url: `http://urlstuff/${str}/moreurlstuff` })).toBe(false); }); }); }); describe('getShaFromUrl', () => { let validUrls = []; let invalidUrls = []; beforeAll(() => { validUrls = shas.valid.map((sha) => `http://urlstuff/${sha}/moreurlstuff`); invalidUrls = shas.invalid.map((str) => `http://urlstuff/${str}/moreurlstuff`); }); it('returns the valid 40-character SHA1 hash from the URL', () => { validUrls.forEach((url, idx) => { expect(urlUtils.getShaFromUrl({ url })).toBe(shas.valid[idx]); }); }); it('returns null from a URL with no valid 40-character SHA1 hash', () => { invalidUrls.forEach((url) => { expect(urlUtils.getShaFromUrl({ url })).toBeNull(); }); }); }); describe('setUrlFragment', () => { it('should set fragment when url has no fragment', () => { const url = urlUtils.setUrlFragment('/home/feature', 'usage'); expect(url).toBe('/home/feature#usage'); }); it('should set fragment when url has existing fragment', () => { const url = urlUtils.setUrlFragment('/home/feature#overview', 'usage'); expect(url).toBe('/home/feature#usage'); }); it('should set fragment when given fragment includes #', () => { const url = urlUtils.setUrlFragment('/home/feature#overview', '#install'); expect(url).toBe('/home/feature#install'); }); }); describe('updateHistory', () => { const state = { key: 'prop' }; const title = 'TITLE'; const url = 'URL'; const win = { history: { pushState: jest.fn(), replaceState: jest.fn(), }, }; beforeEach(() => { win.history.pushState.mockReset(); win.history.replaceState.mockReset(); }); it('should call replaceState if the replace option is true', () => { urlUtils.updateHistory({ state, title, url, replace: true, win }); expect(win.history.replaceState).toHaveBeenCalledWith(state, title, url); expect(win.history.pushState).not.toHaveBeenCalled(); }); it('should call pushState if the replace option is missing', () => { urlUtils.updateHistory({ state, title, url, win }); expect(win.history.replaceState).not.toHaveBeenCalled(); expect(win.history.pushState).toHaveBeenCalledWith(state, title, url); }); it('should call pushState if the replace option is false', () => { urlUtils.updateHistory({ state, title, url, replace: false, win }); expect(win.history.replaceState).not.toHaveBeenCalled(); expect(win.history.pushState).toHaveBeenCalledWith(state, title, url); }); }); describe('getBaseURL', () => { beforeEach(() => { setWindowLocation('https://gitlab.com'); }); it('returns correct base URL', () => { expect(urlUtils.getBaseURL()).toBe('https://gitlab.com'); }); }); describe('isAbsolute', () => { it.each` url | valid ${'https://gitlab.com/'} | ${true} ${'http://gitlab.com/'} | ${true} ${'/users/sign_in'} | ${false} ${' https://gitlab.com'} | ${false} ${'somepath.php?url=https://gitlab.com'} | ${false} ${'notaurl'} | ${false} ${'../relative_url'} | ${false} ${''} | ${false} `('returns $valid for $url', ({ url, valid }) => { expect(urlUtils.isAbsolute(url)).toBe(valid); }); }); describe('isRootRelative', () => { it.each` url | valid ${'https://gitlab.com/'} | ${false} ${'http://gitlab.com/'} | ${false} ${'/users/sign_in'} | ${true} ${' https://gitlab.com'} | ${false} ${'/somepath.php?url=https://gitlab.com'} | ${true} ${'notaurl'} | ${false} ${'../relative_url'} | ${false} ${''} | ${false} ${'//other-host.test'} | ${false} `('returns $valid for $url', ({ url, valid }) => { expect(urlUtils.isRootRelative(url)).toBe(valid); }); }); describe('isAbsoluteOrRootRelative', () => { it.each` url | valid ${'https://gitlab.com/'} | ${true} ${'http://gitlab.com/'} | ${true} ${'/users/sign_in'} | ${true} ${' https://gitlab.com'} | ${false} ${'/somepath.php?url=https://gitlab.com'} | ${true} ${'notaurl'} | ${false} ${'../relative_url'} | ${false} ${''} | ${false} `('returns $valid for $url', ({ url, valid }) => { expect(urlUtils.isAbsoluteOrRootRelative(url)).toBe(valid); }); }); describe('isExternal', () => { const gitlabUrl = 'https://gitlab.com/'; beforeEach(() => { gon.gitlab_url = gitlabUrl; }); it.each` url | urlType | external ${'/gitlab-org/gitlab-test/-/issues/2'} | ${'relative'} | ${false} ${gitlabUrl} | ${'absolute and internal'} | ${false} ${`${gitlabUrl}/gitlab-org/gitlab-test`} | ${'absolute and internal'} | ${false} ${'http://jira.atlassian.net/browse/IG-1'} | ${'absolute and external'} | ${true} `('returns $external for $url ($urlType)', ({ url, external }) => { expect(urlUtils.isExternal(url)).toBe(external); }); }); describe('isBase64DataUrl', () => { it.each` url | valid ${undefined} | ${false} ${'http://gitlab.com'} | ${false} ${'data:image/png;base64,abcdef'} | ${true} ${'data:application/smil+xml;base64,abcdef'} | ${true} ${'data:application/vnd.syncml+xml;base64,abcdef'} | ${true} ${'data:application/vnd.3m.post-it-notes;base64,abcdef'} | ${true} ${'notaurl'} | ${false} ${'../relative_url'} | ${false} ${''} | ${false} `('returns $valid for $url', ({ url, valid }) => { expect(urlUtils.isBase64DataUrl(url)).toBe(valid); }); }); describe('isBlobUrl', () => { it.each` url | valid ${undefined} | ${false} ${'blob:http://gitlab.com/abcd'} | ${true} ${'data:image/png;base64,abcdef'} | ${false} ${'notaurl'} | ${false} ${'../relative_url'} | ${false} ${''} | ${false} `('returns $valid for $url', ({ url, valid }) => { expect(urlUtils.isBlobUrl(url)).toBe(valid); }); }); describe('relativePathToAbsolute', () => { it.each` path | base | result ${'./foo'} | ${'bar/'} | ${'/bar/foo'} ${'../john.md'} | ${'bar/baz/foo.php'} | ${'/bar/john.md'} ${'../images/img.png'} | ${'bar/baz/foo.php'} | ${'/bar/images/img.png'} ${'../images/Image 1.png'} | ${'bar/baz/foo.php'} | ${'/bar/images/Image 1.png'} ${'/images/img.png'} | ${'bar/baz/foo.php'} | ${'/images/img.png'} ${'/images/img.png'} | ${'bar/baz//foo.php'} | ${'/images/img.png'} ${'/images//img.png'} | ${'bar/baz/foo.php'} | ${'/images/img.png'} ${'/images/img.png'} | ${'/bar/baz/foo.php'} | ${'/images/img.png'} ${'../john.md'} | ${'/bar/baz/foo.php'} | ${'/bar/john.md'} ${'../john.md'} | ${'///bar/baz/foo.php'} | ${'/bar/john.md'} ${'/images/img.png'} | ${'https://gitlab.com/user/project/'} | ${'https://gitlab.com/images/img.png'} ${'/images/img.png'} | ${'https://gitlab.com////user/project/'} | ${'https://gitlab.com/images/img.png'} ${'/images////img.png'} | ${'https://gitlab.com/user/project/'} | ${'https://gitlab.com/images/img.png'} ${'../images/img.png'} | ${'https://gitlab.com/user/project/'} | ${'https://gitlab.com/user/images/img.png'} ${'../images/Image 1.png'} | ${'https://gitlab.com/user/project/'} | ${'https://gitlab.com/user/images/Image%201.png'} `( 'converts relative path "$path" with base "$base" to absolute path => "expected"', ({ path, base, result }) => { expect(urlUtils.relativePathToAbsolute(path, base)).toBe(result); }, ); }); describe('isSafeUrl', () => { describe('with URL constructor support', () => { it.each(safeUrls)('returns true for %s', (url) => { expect(urlUtils.isSafeURL(url)).toBe(true); }); it.each(unsafeUrls)('returns false for %s', (url) => { expect(urlUtils.isSafeURL(url)).toBe(false); }); }); }); describe('sanitizeUrl', () => { it.each(safeUrls)('returns the url for %s', (url) => { expect(urlUtils.sanitizeUrl(url)).toBe(url); }); it.each(unsafeUrls)('returns `about:blank` for %s', (url) => { expect(urlUtils.sanitizeUrl(url)).toBe('about:blank'); }); }); describe('getNormalizedURL', () => { it.each` url | base | result ${'./foo'} | ${''} | ${'http://test.host/foo'} ${'../john.md'} | ${''} | ${'http://test.host/john.md'} ${'/images/img.png'} | ${'https://gitlab.com'} | ${'https://gitlab.com/images/img.png'} ${'/images/../img.png'} | ${'https://gitlab.com'} | ${'https://gitlab.com/img.png'} ${'/images/./img.png'} | ${'https://gitlab.com'} | ${'https://gitlab.com/images/img.png'} ${'./images/img.png'} | ${'https://gitlab.com/user/project'} | ${'https://gitlab.com/user/images/img.png'} ${'../images/../img.png'} | ${'https://gitlab.com/user/project'} | ${'https://gitlab.com/img.png'} ${'/images/img.png'} | ${'https://gitlab.com/user/project'} | ${'https://gitlab.com/images/img.png'} ${'/images/../img.png'} | ${'https://gitlab.com/user/project'} | ${'https://gitlab.com/img.png'} ${'/images/./img.png'} | ${'https://gitlab.com/user/project'} | ${'https://gitlab.com/images/img.png'} `( 'converts url "$url" with base "$base" to normalized url => "expected"', ({ url, base, result }) => { expect(urlUtils.getNormalizedURL(url, base)).toBe(result); }, ); }); describe('getWebSocketProtocol', () => { it.each` protocol | expectation ${'http:'} | ${'ws:'} ${'https:'} | ${'wss:'} `('returns "$expectation" with "$protocol" protocol', ({ protocol, expectation }) => { setWindowLocation(`${protocol}//example.com`); expect(urlUtils.getWebSocketProtocol()).toBe(expectation); }); }); describe('getWebSocketUrl', () => { it('joins location host to path', () => { setWindowLocation('http://example.com'); const path = '/lorem/ipsum?a=bc'; expect(urlUtils.getWebSocketUrl(path)).toBe('ws://example.com/lorem/ipsum?a=bc'); }); }); describe('urlParamsToArray', () => { it('returns empty array for empty querystring', () => { expect(urlUtils.urlParamsToArray('')).toEqual([]); }); it('should decode params', () => { expect(urlUtils.urlParamsToArray('?label_name%5B%5D=test')[0]).toBe('label_name[]=test'); }); it('should remove the question mark from the search params', () => { const paramsArray = urlUtils.urlParamsToArray('?test=thing'); expect(paramsArray[0][0]).not.toBe('?'); }); }); describe('queryToObject', () => { it.each` case | query | options | result ${'converts query'} | ${'?one=1&two=2'} | ${undefined} | ${{ one: '1', two: '2' }} ${'converts query without ?'} | ${'one=1&two=2'} | ${undefined} | ${{ one: '1', two: '2' }} ${'removes undefined values'} | ${'?one=1&two=2&three'} | ${undefined} | ${{ one: '1', two: '2' }} ${'overwrites values with same key and does not change key'} | ${'?one[]=1&one[]=2&two=2&two=3'} | ${undefined} | ${{ 'one[]': '2', two: '3' }} ${'gathers values with the same array-key, strips `[]` from key'} | ${'?one[]=1&one[]=2&two=2&two=3'} | ${{ gatherArrays: true }} | ${{ one: ['1', '2'], two: '3' }} ${'overwrites values with the same array-key name'} | ${'?one=1&one[]=2&two=2&two=3'} | ${{ gatherArrays: true }} | ${{ one: ['2'], two: '3' }} ${'overwrites values with the same key name'} | ${'?one[]=1&one=2&two=2&two=3'} | ${{ gatherArrays: true }} | ${{ one: '2', two: '3' }} ${'ignores plus symbols'} | ${'?search=a+b'} | ${{ legacySpacesDecode: true }} | ${{ search: 'a+b' }} ${'ignores plus symbols in keys'} | ${'?search+term=a'} | ${{ legacySpacesDecode: true }} | ${{ 'search+term': 'a' }} ${'ignores plus symbols when gathering arrays'} | ${'?search[]=a+b'} | ${{ gatherArrays: true, legacySpacesDecode: true }} | ${{ search: ['a+b'] }} ${'replaces plus symbols with spaces'} | ${'?search=a+b'} | ${undefined} | ${{ search: 'a b' }} ${'replaces plus symbols in keys with spaces'} | ${'?search+term=a'} | ${undefined} | ${{ 'search term': 'a' }} ${'preserves square brackets in array params'} | ${'?search[]=a&search[]=b'} | ${{ gatherArrays: true }} | ${{ search: ['a', 'b'] }} ${'decodes encoded square brackets in array params'} | ${'?search%5B%5D=a&search%5B%5D=b'} | ${{ gatherArrays: true }} | ${{ search: ['a', 'b'] }} ${'replaces plus symbols when gathering arrays'} | ${'?search[]=a+b'} | ${{ gatherArrays: true }} | ${{ search: ['a b'] }} ${'replaces plus symbols when gathering arrays for values with same key'} | ${'?search[]=a+b&search[]=c+d'} | ${{ gatherArrays: true }} | ${{ search: ['a b', 'c d'] }} `('$case', ({ query, options, result }) => { expect(urlUtils.queryToObject(query, options)).toEqual(result); }); }); describe('getParameterByName', () => { const { getParameterByName } = urlUtils; it('should return valid parameter', () => { setWindowLocation('?scope=all&p=2'); expect(getParameterByName('p')).toBe('2'); expect(getParameterByName('scope')).toBe('all'); }); it('should return invalid parameter', () => { setWindowLocation('?scope=all&p=2'); expect(getParameterByName('fakeParameter')).toBe(null); }); it('should return a parameter with spaces', () => { setWindowLocation('?search=my terms'); expect(getParameterByName('search')).toBe('my terms'); }); it('should return a parameter with encoded spaces', () => { setWindowLocation('?search=my%20terms'); expect(getParameterByName('search')).toBe('my terms'); }); it('should return a parameter with plus signs as spaces', () => { setWindowLocation('?search=my+terms'); expect(getParameterByName('search')).toBe('my terms'); }); it('should return valid parameters if search is provided', () => { expect(getParameterByName('foo', 'foo=bar')).toBe('bar'); expect(getParameterByName('foo', '?foo=bar')).toBe('bar'); expect(getParameterByName('manan', 'foo=bar&manan=canchu')).toBe('canchu'); expect(getParameterByName('manan', '?foo=bar&manan=canchu')).toBe('canchu'); }); }); describe('objectToQuery', () => { it('converts search query object back into a search query', () => { const searchQueryObject = { one: '1', two: '2' }; expect(urlUtils.objectToQuery(searchQueryObject)).toBe('one=1&two=2'); }); it('returns empty string when `params` is undefined, null or empty string', () => { expect(urlUtils.objectToQuery()).toBe(''); expect(urlUtils.objectToQuery('')).toBe(''); }); it('returns query string with values of `params`', () => { const singleQueryParams = { foo: true }; const multipleQueryParams = { foo: true, bar: true }; expect(urlUtils.objectToQuery(singleQueryParams)).toBe('foo=true'); expect(urlUtils.objectToQuery(multipleQueryParams)).toBe('foo=true&bar=true'); }); }); describe('cleanLeadingSeparator', () => { it.each` path | expected ${'/foo/bar'} | ${'foo/bar'} ${'foo/bar'} | ${'foo/bar'} ${'//foo/bar'} | ${'foo/bar'} ${'/./foo/bar'} | ${'./foo/bar'} ${''} | ${''} `('$path becomes $expected', ({ path, expected }) => { expect(urlUtils.cleanLeadingSeparator(path)).toBe(expected); }); }); describe('cleanEndingSeparator', () => { it.each` path | expected ${'foo/bar'} | ${'foo/bar'} ${'/foo/bar/'} | ${'/foo/bar'} ${'foo/bar//'} | ${'foo/bar'} ${'foo/bar/./'} | ${'foo/bar/.'} ${''} | ${''} `('$path becomes $expected', ({ path, expected }) => { expect(urlUtils.cleanEndingSeparator(path)).toBe(expected); }); }); describe('joinPaths', () => { it.each` paths | expected ${['foo', 'bar']} | ${'foo/bar'} ${['foo/', 'bar']} | ${'foo/bar'} ${['foo//', 'bar']} | ${'foo/bar'} ${['abc/', '/def']} | ${'abc/def'} ${['foo', '/bar']} | ${'foo/bar'} ${['foo', '/bar/']} | ${'foo/bar/'} ${['foo', '//bar/']} | ${'foo/bar/'} ${['foo', '', '/bar']} | ${'foo/bar'} ${['foo', '/bar', '']} | ${'foo/bar'} ${['/', '', 'foo/bar/ ', '', '/ninja']} | ${'/foo/bar/ /ninja'} ${['', '/ninja', '/', ' ', '', 'bar', ' ']} | ${'/ninja/ /bar/ '} ${['http://something/bar/', 'foo']} | ${'http://something/bar/foo'} ${['foo/bar', null, 'ninja', null]} | ${'foo/bar/ninja'} ${[null, 'abc/def', 'zoo']} | ${'abc/def/zoo'} ${['', '', '']} | ${''} ${['///', '/', '//']} | ${'/'} `('joins paths $paths => $expected', ({ paths, expected }) => { expect(urlUtils.joinPaths(...paths)).toBe(expected); }); }); describe('stripFinalUrlSegment', () => { it.each` path | expected ${'http://fake.domain/twitter/typeahead-js/-/tags/v0.11.0'} | ${'http://fake.domain/twitter/typeahead-js/-/tags/'} ${'http://fake.domain/bar/cool/-/nested/content'} | ${'http://fake.domain/bar/cool/-/nested/'} ${'http://fake.domain/bar/cool?q="search"'} | ${'http://fake.domain/bar/'} ${'http://fake.domain/bar/cool#link-to-something'} | ${'http://fake.domain/bar/'} `('stripFinalUrlSegment $path => $expected', ({ path, expected }) => { expect(urlUtils.stripFinalUrlSegment(path)).toBe(expected); }); }); describe('escapeFileUrl', () => { it('encodes URL excluding the slashes', () => { expect(urlUtils.escapeFileUrl('/foo-bar/file.md')).toBe('/foo-bar/file.md'); expect(urlUtils.escapeFileUrl('foo bar/file.md')).toBe('foo%20bar/file.md'); expect(urlUtils.escapeFileUrl('foo/bar/file.md')).toBe('foo/bar/file.md'); }); }); describe('urlIsDifferent', () => { const current = 'http://current.test/'; beforeEach(() => { setWindowLocation(current); }); it('should compare against the window location if no compare value is provided', () => { expect(urlUtils.urlIsDifferent('different')).toBe(true); expect(urlUtils.urlIsDifferent(current)).toBe(false); }); it('should use the provided compare value', () => { expect(urlUtils.urlIsDifferent('different', current)).toBe(true); expect(urlUtils.urlIsDifferent(current, current)).toBe(false); }); }); describe('setUrlParams', () => { it('adds new params as query string', () => { const url = 'https://gitlab.com/test'; expect(urlUtils.setUrlParams({ group_id: 'gitlab-org', project_id: 'my-project' }, url)).toBe( 'https://gitlab.com/test?group_id=gitlab-org&project_id=my-project', ); }); it('updates an existing parameter', () => { const url = 'https://gitlab.com/test?group_id=gitlab-org&project_id=my-project'; expect(urlUtils.setUrlParams({ project_id: 'gitlab-test' }, url)).toBe( 'https://gitlab.com/test?group_id=gitlab-org&project_id=gitlab-test', ); }); it("removes the project_id param when it's value is null", () => { const url = 'https://gitlab.com/test?group_id=gitlab-org&project_id=my-project'; expect(urlUtils.setUrlParams({ project_id: null }, url)).toBe( 'https://gitlab.com/test?group_id=gitlab-org', ); }); it('adds parameters from arrays', () => { const url = 'https://gitlab.com/test'; expect(urlUtils.setUrlParams({ labels: ['foo', 'bar'] }, url)).toBe( 'https://gitlab.com/test?labels=foo&labels=bar', ); }); it('removes parameters from empty arrays', () => { const url = 'https://gitlab.com/test?labels=foo&labels=bar'; expect(urlUtils.setUrlParams({ labels: [] }, url)).toBe('https://gitlab.com/test'); }); it('removes parameters from empty arrays while keeping other parameters', () => { const url = 'https://gitlab.com/test?labels=foo&labels=bar&unrelated=unrelated'; expect(urlUtils.setUrlParams({ labels: [] }, url)).toBe( 'https://gitlab.com/test?unrelated=unrelated', ); }); it('adds parameters from arrays when railsArraySyntax=true', () => { const url = 'https://gitlab.com/test'; expect(urlUtils.setUrlParams({ labels: ['foo', 'bar'] }, url, false, true)).toBe( 'https://gitlab.com/test?labels%5B%5D=foo&labels%5B%5D=bar', ); }); it('removes parameters from empty arrays when railsArraySyntax=true', () => { const url = 'https://gitlab.com/test?labels%5B%5D=foo&labels%5B%5D=bar'; expect(urlUtils.setUrlParams({ labels: [] }, url, false, true)).toBe( 'https://gitlab.com/test', ); }); it('decodes URI when decodeURI=true', () => { const url = 'https://gitlab.com/test'; expect(urlUtils.setUrlParams({ labels: ['foo', 'bar'] }, url, false, true, true)).toBe( 'https://gitlab.com/test?labels[]=foo&labels[]=bar', ); }); it('removes all existing URL params and sets a new param when cleanParams=true', () => { const url = 'https://gitlab.com/test?group_id=gitlab-org&project_id=my-project'; expect(urlUtils.setUrlParams({ foo: 'bar' }, url, true)).toBe( 'https://gitlab.com/test?foo=bar', ); }); }); describe('getHTTPProtocol', () => { const httpProtocol = 'http:'; const httpsProtocol = 'https:'; it.each([[httpProtocol], [httpsProtocol]])( 'when no url passed, returns correct protocol for %i from window location', (protocol) => { setWindowLocation(`${protocol}//test.host`); expect(urlUtils.getHTTPProtocol()).toBe(protocol.slice(0, -1)); }, ); it.each` url | expectation ${'not-a-url'} | ${undefined} ${'wss://example.com'} | ${'wss'} ${'https://foo.bar'} | ${'https'} ${'http://foo.bar'} | ${'http'} ${'http://foo.bar:8080'} | ${'http'} `('returns correct protocol for $url', ({ url, expectation }) => { expect(urlUtils.getHTTPProtocol(url)).toBe(expectation); }); }); describe('stripPathTail', () => { it.each` path | expected ${''} | ${''} ${'index.html'} | ${''} ${'/'} | ${'/'} ${'/foo/bar'} | ${'/foo/'} ${'/foo/bar/'} | ${'/foo/bar/'} ${'/foo/bar/index.html'} | ${'/foo/bar/'} `('strips the filename from $path => $expected', ({ path, expected }) => { expect(urlUtils.stripPathTail(path)).toBe(expected); }); }); describe('getURLOrigin', () => { it('when no url passed, returns correct origin from window location', () => { setWindowLocation('https://user:pass@origin.test:1234/foo/bar?foo=1#bar'); expect(urlUtils.getURLOrigin()).toBe('https://origin.test:1234'); }); it.each` url | expectation ${'not-a-url'} | ${null} ${'wss://example.com'} | ${'wss://example.com'} ${'https://foo.bar/foo/bar'} | ${'https://foo.bar'} `('returns correct origin for $url', ({ url, expectation }) => { expect(urlUtils.getURLOrigin(url)).toBe(expectation); }); }); describe('encodeSaferUrl', () => { it.each` character | input | output ${' '} | ${'/url/hello 1.jpg'} | ${'/url/hello%201.jpg'} ${'#'} | ${'/url/hello#1.jpg'} | ${'/url/hello%231.jpg'} ${'!'} | ${'/url/hello!.jpg'} | ${'/url/hello%21.jpg'} ${'~'} | ${'/url/hello~.jpg'} | ${'/url/hello%7E.jpg'} ${'*'} | ${'/url/hello*.jpg'} | ${'/url/hello%2A.jpg'} ${"'"} | ${"/url/hello'.jpg"} | ${'/url/hello%27.jpg'} ${'('} | ${'/url/hello(.jpg'} | ${'/url/hello%28.jpg'} ${')'} | ${'/url/hello).jpg'} | ${'/url/hello%29.jpg'} ${'?'} | ${'/url/hello?.jpg'} | ${'/url/hello%3F.jpg'} ${'='} | ${'/url/hello=.jpg'} | ${'/url/hello%3D.jpg'} ${'+'} | ${'/url/hello+.jpg'} | ${'/url/hello%2B.jpg'} ${'&'} | ${'/url/hello&.jpg'} | ${'/url/hello%26.jpg'} `( 'properly escapes `$character` characters while retaining the integrity of the URL', ({ input, output }) => { expect(urlUtils.encodeSaferUrl(input)).toBe(output); }, ); it.each` character | input ${'/, .'} | ${'/url/hello.png'} ${'\\d'} | ${'/url/hello123.png'} ${'-'} | ${'/url/hello-123.png'} ${'_'} | ${'/url/hello_123.png'} `('makes no changes to unproblematic characters ($character)', ({ input }) => { expect(urlUtils.encodeSaferUrl(input)).toBe(input); }); }); describe('isSameOriginUrl', () => { // eslint-disable-next-line no-script-url const javascriptUrl = 'javascript:alert(1)'; it.each` url | expected ${TEST_HOST} | ${true} ${`${TEST_HOST}/a/path`} | ${true} ${'//test.host/no-protocol'} | ${true} ${'/a/root/relative/path'} | ${true} ${'a/relative/path'} | ${true} ${'#hash'} | ${true} ${'?param=foo'} | ${true} ${''} | ${true} ${'../../../'} | ${true} ${`${TEST_HOST}:8080/wrong-port`} | ${false} ${'ws://test.host/wrong-protocol'} | ${false} ${'http://phishing.test'} | ${false} ${'//phishing.test'} | ${false} ${'//invalid:url'} | ${false} ${javascriptUrl} | ${false} ${'data:,Hello%2C%20World%21'} | ${false} ${null} | ${false} ${undefined} | ${false} `('returns $expected given $url', ({ url, expected }) => { expect(urlUtils.isSameOriginUrl(url)).toBe(expected); }); }); describe('constructWebIDEPath', () => { let originalGl; const projectIDEPath = '/foo/bar'; const sourceProj = 'my_-fancy-proj/boo'; const targetProj = 'boo/another-fancy-proj'; const mrIid = '7'; beforeEach(() => { originalGl = window.gl; window.gl = { webIDEPath: projectIDEPath }; }); afterEach(() => { window.gl = originalGl; }); it.each` sourceProjectFullPath | targetProjectFullPath | iid | expectedPath ${undefined} | ${undefined} | ${undefined} | ${projectIDEPath} ${undefined} | ${undefined} | ${mrIid} | ${projectIDEPath} ${undefined} | ${targetProj} | ${undefined} | ${projectIDEPath} ${undefined} | ${targetProj} | ${mrIid} | ${projectIDEPath} ${sourceProj} | ${undefined} | ${undefined} | ${projectIDEPath} ${sourceProj} | ${targetProj} | ${undefined} | ${projectIDEPath} ${sourceProj} | ${undefined} | ${mrIid} | ${`/-/ide/project/${sourceProj}/merge_requests/${mrIid}?target_project=`} ${sourceProj} | ${sourceProj} | ${mrIid} | ${`/-/ide/project/${sourceProj}/merge_requests/${mrIid}?target_project=`} ${sourceProj} | ${targetProj} | ${mrIid} | ${`/-/ide/project/${sourceProj}/merge_requests/${mrIid}?target_project=${encodeURIComponent(targetProj)}`} `( 'returns $expectedPath for "$sourceProjectFullPath + $targetProjectFullPath + $iid"', ({ expectedPath, ...args } = {}) => { expect(urlUtils.constructWebIDEPath(args)).toBe(expectedPath); }, ); }); describe('defaultPromoUrl', () => { it('Gitlab about page url', () => { const url = 'https://about.gitlab.com'; expect(urlUtils.PROMO_URL).toBe(url); }); }); describe('removeUrlProtocol', () => { it.each` input | output ${'http://gitlab.com'} | ${'gitlab.com'} ${'https://gitlab.com'} | ${'gitlab.com'} ${'foo:bar.com'} | ${'bar.com'} ${'gitlab.com'} | ${'gitlab.com'} `('transforms $input to $output', ({ input, output }) => { expect(urlUtils.removeUrlProtocol(input)).toBe(output); }); }); describe('removeLastSlashInUrlPath', () => { it.each` input | output ${'https://www.gitlab.com/path/'} | ${'https://www.gitlab.com/path'} ${'https://www.gitlab.com/?query=search'} | ${'https://www.gitlab.com?query=search'} ${'https://www.gitlab.com/#fragment'} | ${'https://www.gitlab.com#fragment'} ${'https://www.gitlab.com/hello'} | ${'https://www.gitlab.com/hello'} `('transforms $input to $output', ({ input, output }) => { expect(urlUtils.removeLastSlashInUrlPath(input)).toBe(output); }); }); });