diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2020-01-02 16:03:23 +0300 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2020-01-02 16:03:23 +0300 |
commit | a72a9af092c1bfcf9f8024d59c11cf222f07e1e7 (patch) | |
tree | 44b60265c1d476d026b2862d2c1244748f558d4f /spec/javascripts/filtered_search | |
parent | b085478c4c2bed74fdc6eb2c33bfc62e791baf03 (diff) |
Add latest changes from gitlab-org/gitlab@master
Diffstat (limited to 'spec/javascripts/filtered_search')
6 files changed, 112 insertions, 60 deletions
diff --git a/spec/javascripts/filtered_search/dropdown_utils_spec.js b/spec/javascripts/filtered_search/dropdown_utils_spec.js index 62d1bd69635..6eda4f391a4 100644 --- a/spec/javascripts/filtered_search/dropdown_utils_spec.js +++ b/spec/javascripts/filtered_search/dropdown_utils_spec.js @@ -222,7 +222,7 @@ describe('Dropdown Utils', () => { hasAttribute: () => false, }; - DropdownUtils.setDataValueIfSelected(null, selected); + DropdownUtils.setDataValueIfSelected(null, '=', selected); expect(FilteredSearchDropdownManager.addWordToInput.calls.count()).toEqual(1); }); @@ -233,9 +233,11 @@ describe('Dropdown Utils', () => { hasAttribute: () => false, }; - const result = DropdownUtils.setDataValueIfSelected(null, selected); + const result = DropdownUtils.setDataValueIfSelected(null, '=', selected); + const result2 = DropdownUtils.setDataValueIfSelected(null, '!=', selected); expect(result).toBe(true); + expect(result2).toBe(true); }); it('returns false when dataValue does not exist', () => { @@ -243,9 +245,11 @@ describe('Dropdown Utils', () => { getAttribute: () => null, }; - const result = DropdownUtils.setDataValueIfSelected(null, selected); + const result = DropdownUtils.setDataValueIfSelected(null, '=', selected); + const result2 = DropdownUtils.setDataValueIfSelected(null, '!=', selected); expect(result).toBe(false); + expect(result2).toBe(false); }); }); @@ -349,7 +353,7 @@ describe('Dropdown Utils', () => { beforeEach(() => { loadFixtures(issueListFixture); - authorToken = FilteredSearchSpecHelper.createFilterVisualToken('author', '@user'); + authorToken = FilteredSearchSpecHelper.createFilterVisualToken('author', '=', '@user'); const searchTermToken = FilteredSearchSpecHelper.createSearchVisualToken('search term'); const tokensContainer = document.querySelector('.tokens-container'); @@ -364,7 +368,7 @@ describe('Dropdown Utils', () => { const searchQuery = DropdownUtils.getSearchQuery(); - expect(searchQuery).toBe(' search term author:original dance'); + expect(searchQuery).toBe(' search term author:=original dance'); }); }); }); diff --git a/spec/javascripts/filtered_search/filtered_search_dropdown_manager_spec.js b/spec/javascripts/filtered_search/filtered_search_dropdown_manager_spec.js index 8c5a0961a02..853f6b3b7b8 100644 --- a/spec/javascripts/filtered_search/filtered_search_dropdown_manager_spec.js +++ b/spec/javascripts/filtered_search/filtered_search_dropdown_manager_spec.js @@ -27,7 +27,7 @@ describe('Filtered Search Dropdown Manager', () => { describe('input has no existing value', () => { it('should add just tokenName', () => { - FilteredSearchDropdownManager.addWordToInput('milestone'); + FilteredSearchDropdownManager.addWordToInput({ tokenName: 'milestone' }); const token = document.querySelector('.tokens-container .js-visual-token'); @@ -36,8 +36,8 @@ describe('Filtered Search Dropdown Manager', () => { expect(getInputValue()).toBe(''); }); - it('should add tokenName and tokenValue', () => { - FilteredSearchDropdownManager.addWordToInput('label'); + it('should add tokenName, tokenOperator, and tokenValue', () => { + FilteredSearchDropdownManager.addWordToInput({ tokenName: 'label' }); let token = document.querySelector('.tokens-container .js-visual-token'); @@ -45,13 +45,27 @@ describe('Filtered Search Dropdown Manager', () => { expect(token.querySelector('.name').innerText).toBe('label'); expect(getInputValue()).toBe(''); - FilteredSearchDropdownManager.addWordToInput('label', 'none'); + FilteredSearchDropdownManager.addWordToInput({ tokenName: 'label', tokenOperator: '=' }); + + token = document.querySelector('.tokens-container .js-visual-token'); + + expect(token.classList.contains('filtered-search-token')).toEqual(true); + expect(token.querySelector('.name').innerText).toBe('label'); + expect(token.querySelector('.operator').innerText).toBe('='); + expect(getInputValue()).toBe(''); + + FilteredSearchDropdownManager.addWordToInput({ + tokenName: 'label', + tokenOperator: '=', + tokenValue: 'none', + }); // We have to get that reference again // Because FilteredSearchDropdownManager deletes the previous token token = document.querySelector('.tokens-container .js-visual-token'); expect(token.classList.contains('filtered-search-token')).toEqual(true); expect(token.querySelector('.name').innerText).toBe('label'); + expect(token.querySelector('.operator').innerText).toBe('='); expect(token.querySelector('.value').innerText).toBe('none'); expect(getInputValue()).toBe(''); }); @@ -60,7 +74,7 @@ describe('Filtered Search Dropdown Manager', () => { describe('input has existing value', () => { it('should be able to just add tokenName', () => { setInputValue('a'); - FilteredSearchDropdownManager.addWordToInput('author'); + FilteredSearchDropdownManager.addWordToInput({ tokenName: 'author' }); const token = document.querySelector('.tokens-container .js-visual-token'); @@ -70,29 +84,40 @@ describe('Filtered Search Dropdown Manager', () => { }); it('should replace tokenValue', () => { - FilteredSearchDropdownManager.addWordToInput('author'); + FilteredSearchDropdownManager.addWordToInput({ tokenName: 'author' }); + FilteredSearchDropdownManager.addWordToInput({ tokenName: 'author', tokenOperator: '=' }); setInputValue('roo'); - FilteredSearchDropdownManager.addWordToInput(null, '@root'); + FilteredSearchDropdownManager.addWordToInput({ + tokenName: null, + tokenOperator: '=', + tokenValue: '@root', + }); const token = document.querySelector('.tokens-container .js-visual-token'); expect(token.classList.contains('filtered-search-token')).toEqual(true); expect(token.querySelector('.name').innerText).toBe('author'); + expect(token.querySelector('.operator').innerText).toBe('='); expect(token.querySelector('.value').innerText).toBe('@root'); expect(getInputValue()).toBe(''); }); it('should add tokenValues containing spaces', () => { - FilteredSearchDropdownManager.addWordToInput('label'); + FilteredSearchDropdownManager.addWordToInput({ tokenName: 'label' }); setInputValue('"test '); - FilteredSearchDropdownManager.addWordToInput('label', '~\'"test me"\''); + FilteredSearchDropdownManager.addWordToInput({ + tokenName: 'label', + tokenOperator: '=', + tokenValue: '~\'"test me"\'', + }); const token = document.querySelector('.tokens-container .js-visual-token'); expect(token.classList.contains('filtered-search-token')).toEqual(true); expect(token.querySelector('.name').innerText).toBe('label'); + expect(token.querySelector('.operator').innerText).toBe('='); expect(token.querySelector('.value').innerText).toBe('~\'"test me"\''); expect(getInputValue()).toBe(''); }); diff --git a/spec/javascripts/filtered_search/filtered_search_manager_spec.js b/spec/javascripts/filtered_search/filtered_search_manager_spec.js index e076120f5cc..e5d1d1d690e 100644 --- a/spec/javascripts/filtered_search/filtered_search_manager_spec.js +++ b/spec/javascripts/filtered_search/filtered_search_manager_spec.js @@ -201,8 +201,8 @@ describe('Filtered Search Manager', function() { it('removes duplicated tokens', done => { tokensContainer.innerHTML = FilteredSearchSpecHelper.createTokensContainerHTML(` - ${FilteredSearchSpecHelper.createFilterVisualTokenHTML('label', '~bug')} - ${FilteredSearchSpecHelper.createFilterVisualTokenHTML('label', '~bug')} + ${FilteredSearchSpecHelper.createFilterVisualTokenHTML('label', '=', '~bug')} + ${FilteredSearchSpecHelper.createFilterVisualTokenHTML('label', '=', '~bug')} `); spyOnDependency(FilteredSearchManager, 'visitUrl').and.callFake(url => { @@ -234,7 +234,7 @@ describe('Filtered Search Manager', function() { it('should not render placeholder when there are tokens and no input', () => { tokensContainer.innerHTML = FilteredSearchSpecHelper.createTokensContainerHTML( - FilteredSearchSpecHelper.createFilterVisualTokenHTML('label', '~bug'), + FilteredSearchSpecHelper.createFilterVisualTokenHTML('label', '=', '~bug'), ); const event = new Event('input'); @@ -252,7 +252,7 @@ describe('Filtered Search Manager', function() { describe('tokens and no input', () => { beforeEach(() => { tokensContainer.innerHTML = FilteredSearchSpecHelper.createTokensContainerHTML( - FilteredSearchSpecHelper.createFilterVisualTokenHTML('label', '~bug'), + FilteredSearchSpecHelper.createFilterVisualTokenHTML('label', '=', '~bug'), ); }); @@ -306,7 +306,7 @@ describe('Filtered Search Manager', function() { it('removes token even when it is already selected', () => { tokensContainer.innerHTML = FilteredSearchSpecHelper.createTokensContainerHTML( - FilteredSearchSpecHelper.createFilterVisualTokenHTML('milestone', 'none', true), + FilteredSearchSpecHelper.createFilterVisualTokenHTML('milestone', '=', 'none', true), ); tokensContainer.querySelector('.js-visual-token .remove-token').click(); @@ -319,7 +319,7 @@ describe('Filtered Search Manager', function() { spyOn(FilteredSearchManager.prototype, 'removeSelectedToken').and.callThrough(); tokensContainer.innerHTML = FilteredSearchSpecHelper.createTokensContainerHTML( - FilteredSearchSpecHelper.createFilterVisualTokenHTML('milestone', 'none'), + FilteredSearchSpecHelper.createFilterVisualTokenHTML('milestone', '=', 'none'), ); tokensContainer.querySelector('.js-visual-token .remove-token').click(); }); @@ -338,7 +338,7 @@ describe('Filtered Search Manager', function() { beforeEach(() => { initializeManager(); tokensContainer.innerHTML = FilteredSearchSpecHelper.createTokensContainerHTML( - FilteredSearchSpecHelper.createFilterVisualTokenHTML('milestone', 'none', true), + FilteredSearchSpecHelper.createFilterVisualTokenHTML('milestone', '=', 'none', true), ); }); @@ -424,7 +424,7 @@ describe('Filtered Search Manager', function() { }); it('Clicking the "x" clear button, clears the input', () => { - const inputValue = 'label:~bug '; + const inputValue = 'label:=~bug'; manager.filteredSearchInput.value = inputValue; manager.filteredSearchInput.dispatchEvent(new Event('input')); diff --git a/spec/javascripts/filtered_search/filtered_search_visual_tokens_spec.js b/spec/javascripts/filtered_search/filtered_search_visual_tokens_spec.js index 0ee13faf841..fda078bd41c 100644 --- a/spec/javascripts/filtered_search/filtered_search_visual_tokens_spec.js +++ b/spec/javascripts/filtered_search/filtered_search_visual_tokens_spec.js @@ -6,9 +6,10 @@ describe('Filtered Search Visual Tokens', () => { const findElements = tokenElement => { const tokenNameElement = tokenElement.querySelector('.name'); + const tokenOperatorElement = tokenElement.querySelector('.operator'); const tokenValueContainer = tokenElement.querySelector('.value-container'); const tokenValueElement = tokenValueContainer.querySelector('.value'); - return { tokenNameElement, tokenValueContainer, tokenValueElement }; + return { tokenNameElement, tokenOperatorElement, tokenValueContainer, tokenValueElement }; }; let tokensContainer; @@ -23,8 +24,8 @@ describe('Filtered Search Visual Tokens', () => { `); tokensContainer = document.querySelector('.tokens-container'); - authorToken = FilteredSearchSpecHelper.createFilterVisualToken('author', '@user'); - bugLabelToken = FilteredSearchSpecHelper.createFilterVisualToken('label', '~bug'); + authorToken = FilteredSearchSpecHelper.createFilterVisualToken('author', '=', '@user'); + bugLabelToken = FilteredSearchSpecHelper.createFilterVisualToken('label', '=', '~bug'); }); describe('getLastVisualTokenBeforeInput', () => { @@ -62,7 +63,7 @@ describe('Filtered Search Visual Tokens', () => { tokensContainer.innerHTML = FilteredSearchSpecHelper.createTokensContainerHTML(` ${bugLabelToken.outerHTML} ${FilteredSearchSpecHelper.createSearchVisualTokenHTML('search term')} - ${FilteredSearchSpecHelper.createFilterVisualTokenHTML('author', '@root')} + ${FilteredSearchSpecHelper.createFilterVisualTokenHTML('author', '=', '@root')} `); const { lastVisualToken, isLastVisualTokenValid } = subject.getLastVisualTokenBeforeInput(); @@ -92,7 +93,7 @@ describe('Filtered Search Visual Tokens', () => { tokensContainer.innerHTML = FilteredSearchSpecHelper.createTokensContainerHTML(` ${bugLabelToken.outerHTML} ${FilteredSearchSpecHelper.createInputHTML()} - ${FilteredSearchSpecHelper.createFilterVisualTokenHTML('author', '@root')} + ${FilteredSearchSpecHelper.createFilterVisualTokenHTML('author', '=', '@root')} `); const { lastVisualToken, isLastVisualTokenValid } = subject.getLastVisualTokenBeforeInput(); @@ -105,7 +106,7 @@ describe('Filtered Search Visual Tokens', () => { tokensContainer.innerHTML = FilteredSearchSpecHelper.createTokensContainerHTML(` ${FilteredSearchSpecHelper.createNameFilterVisualTokenHTML('label')} ${FilteredSearchSpecHelper.createInputHTML()} - ${FilteredSearchSpecHelper.createFilterVisualTokenHTML('author', '@root')} + ${FilteredSearchSpecHelper.createFilterVisualTokenHTML('author', '=', '@root')} `); const { lastVisualToken, isLastVisualTokenValid } = subject.getLastVisualTokenBeforeInput(); @@ -150,8 +151,8 @@ describe('Filtered Search Visual Tokens', () => { it('removes the selected class from buttons', () => { tokensContainer.innerHTML = FilteredSearchSpecHelper.createTokensContainerHTML(` - ${FilteredSearchSpecHelper.createFilterVisualTokenHTML('author', '@author')} - ${FilteredSearchSpecHelper.createFilterVisualTokenHTML('milestone', '%123', true)} + ${FilteredSearchSpecHelper.createFilterVisualTokenHTML('author', '=', '@author')} + ${FilteredSearchSpecHelper.createFilterVisualTokenHTML('milestone', '=', '%123', true)} `); const selected = tokensContainer.querySelector('.js-visual-token .selected'); @@ -169,7 +170,7 @@ describe('Filtered Search Visual Tokens', () => { tokensContainer.innerHTML = FilteredSearchSpecHelper.createTokensContainerHTML(` ${bugLabelToken.outerHTML} ${FilteredSearchSpecHelper.createSearchVisualTokenHTML('search term')} - ${FilteredSearchSpecHelper.createFilterVisualTokenHTML('label', '~awesome')} + ${FilteredSearchSpecHelper.createFilterVisualTokenHTML('label', '=', '~awesome')} `); }); @@ -206,7 +207,7 @@ describe('Filtered Search Visual Tokens', () => { describe('removeSelectedToken', () => { it('does not remove when there are no selected tokens', () => { tokensContainer.innerHTML = FilteredSearchSpecHelper.createTokensContainerHTML( - FilteredSearchSpecHelper.createFilterVisualTokenHTML('milestone', 'none'), + FilteredSearchSpecHelper.createFilterVisualTokenHTML('milestone', '=', 'none'), ); expect(tokensContainer.querySelector('.js-visual-token .selectable')).not.toEqual(null); @@ -218,7 +219,7 @@ describe('Filtered Search Visual Tokens', () => { it('removes selected token', () => { tokensContainer.innerHTML = FilteredSearchSpecHelper.createTokensContainerHTML( - FilteredSearchSpecHelper.createFilterVisualTokenHTML('milestone', 'none', true), + FilteredSearchSpecHelper.createFilterVisualTokenHTML('milestone', '=', 'none', true), ); expect(tokensContainer.querySelector('.js-visual-token .selectable')).not.toEqual(null); @@ -281,16 +282,22 @@ describe('Filtered Search Visual Tokens', () => { describe('addVisualTokenElement', () => { it('renders search visual tokens', () => { - subject.addVisualTokenElement('search term', null, { isSearchTerm: true }); + subject.addVisualTokenElement({ + name: 'search term', + operator: '=', + value: null, + options: { isSearchTerm: true }, + }); const token = tokensContainer.querySelector('.js-visual-token'); expect(token.classList.contains('filtered-search-term')).toEqual(true); expect(token.querySelector('.name').innerText).toEqual('search term'); + expect(token.querySelector('.operator').innerText).toEqual('='); expect(token.querySelector('.value')).toEqual(null); }); it('renders filter visual token name', () => { - subject.addVisualTokenElement('milestone'); + subject.addVisualTokenElement({ name: 'milestone' }); const token = tokensContainer.querySelector('.js-visual-token'); expect(token.classList.contains('search-token-milestone')).toEqual(true); @@ -299,22 +306,23 @@ describe('Filtered Search Visual Tokens', () => { expect(token.querySelector('.value')).toEqual(null); }); - it('renders filter visual token name and value', () => { - subject.addVisualTokenElement('label', 'Frontend'); + it('renders filter visual token name, operator, and value', () => { + subject.addVisualTokenElement({ name: 'label', operator: '!=', value: 'Frontend' }); const token = tokensContainer.querySelector('.js-visual-token'); expect(token.classList.contains('search-token-label')).toEqual(true); expect(token.classList.contains('filtered-search-token')).toEqual(true); expect(token.querySelector('.name').innerText).toEqual('label'); + expect(token.querySelector('.operator').innerText).toEqual('!='); expect(token.querySelector('.value').innerText).toEqual('Frontend'); }); it('inserts visual token before input', () => { tokensContainer.appendChild( - FilteredSearchSpecHelper.createFilterVisualToken('assignee', '@root'), + FilteredSearchSpecHelper.createFilterVisualToken('assignee', '=', '@root'), ); - subject.addVisualTokenElement('label', 'Frontend'); + subject.addVisualTokenElement({ name: 'label', operator: '!=', value: 'Frontend' }); const tokens = tokensContainer.querySelectorAll('.js-visual-token'); const labelToken = tokens[0]; const assigneeToken = tokens[1]; @@ -323,18 +331,20 @@ describe('Filtered Search Visual Tokens', () => { expect(labelToken.classList.contains('filtered-search-token')).toEqual(true); expect(labelToken.querySelector('.name').innerText).toEqual('label'); expect(labelToken.querySelector('.value').innerText).toEqual('Frontend'); + expect(labelToken.querySelector('.operator').innerText).toEqual('!='); expect(assigneeToken.classList.contains('search-token-assignee')).toEqual(true); expect(assigneeToken.classList.contains('filtered-search-token')).toEqual(true); expect(assigneeToken.querySelector('.name').innerText).toEqual('assignee'); expect(assigneeToken.querySelector('.value').innerText).toEqual('@root'); + expect(assigneeToken.querySelector('.operator').innerText).toEqual('='); }); }); describe('addValueToPreviousVisualTokenElement', () => { it('does not add when previous visual token element has no value', () => { tokensContainer.innerHTML = FilteredSearchSpecHelper.createTokensContainerHTML( - FilteredSearchSpecHelper.createFilterVisualTokenHTML('author', '@root'), + FilteredSearchSpecHelper.createFilterVisualTokenHTML('author', '=', '@root'), ); const original = tokensContainer.innerHTML; @@ -345,7 +355,7 @@ describe('Filtered Search Visual Tokens', () => { it('does not add when previous visual token element is a search', () => { tokensContainer.innerHTML = FilteredSearchSpecHelper.createTokensContainerHTML(` - ${FilteredSearchSpecHelper.createFilterVisualTokenHTML('author', '@root')} + ${FilteredSearchSpecHelper.createFilterVisualTokenHTML('author', '=', '@root')} ${FilteredSearchSpecHelper.createSearchVisualTokenHTML('search term')} `); @@ -357,7 +367,7 @@ describe('Filtered Search Visual Tokens', () => { it('adds value to previous visual filter token', () => { tokensContainer.innerHTML = FilteredSearchSpecHelper.createTokensContainerHTML( - FilteredSearchSpecHelper.createNameFilterVisualTokenHTML('label'), + FilteredSearchSpecHelper.createNameOperatorFilterVisualTokenHTML('label', '='), ); const original = tokensContainer.innerHTML; @@ -377,25 +387,28 @@ describe('Filtered Search Visual Tokens', () => { expect(token.classList.contains('filtered-search-token')).toEqual(true); expect(token.querySelector('.name').innerText).toEqual('milestone'); + expect(token.querySelector('.operator')).toEqual(null); expect(token.querySelector('.value')).toEqual(null); }); it('creates visual token with just tokenValue', () => { - subject.addFilterVisualToken('milestone'); + subject.addFilterVisualToken('milestone', '='); subject.addFilterVisualToken('%8.17'); const token = tokensContainer.querySelector('.js-visual-token'); expect(token.classList.contains('filtered-search-token')).toEqual(true); expect(token.querySelector('.name').innerText).toEqual('milestone'); + expect(token.querySelector('.operator').innerText).toEqual('='); expect(token.querySelector('.value').innerText).toEqual('%8.17'); }); it('creates full visual token', () => { - subject.addFilterVisualToken('assignee', '@john'); + subject.addFilterVisualToken('assignee', '=', '@john'); const token = tokensContainer.querySelector('.js-visual-token'); expect(token.classList.contains('filtered-search-token')).toEqual(true); expect(token.querySelector('.name').innerText).toEqual('assignee'); + expect(token.querySelector('.operator').innerText).toEqual('='); expect(token.querySelector('.value').innerText).toEqual('@john'); }); }); @@ -412,7 +425,7 @@ describe('Filtered Search Visual Tokens', () => { it('appends to previous search visual token if previous token was a search token', () => { tokensContainer.innerHTML = FilteredSearchSpecHelper.createTokensContainerHTML(` - ${FilteredSearchSpecHelper.createFilterVisualTokenHTML('author', '@root')} + ${FilteredSearchSpecHelper.createFilterVisualTokenHTML('author', '=', '@root')} ${FilteredSearchSpecHelper.createSearchVisualTokenHTML('search term')} `); @@ -467,7 +480,11 @@ describe('Filtered Search Visual Tokens', () => { describe('removeLastTokenPartial', () => { it('should remove the last token value if it exists', () => { tokensContainer.innerHTML = FilteredSearchSpecHelper.createTokensContainerHTML( - FilteredSearchSpecHelper.createFilterVisualTokenHTML('label', '~"Community Contribution"'), + FilteredSearchSpecHelper.createFilterVisualTokenHTML( + 'label', + '=', + '~"Community Contribution"', + ), ); expect(tokensContainer.querySelector('.js-visual-token .value')).not.toEqual(null); @@ -507,7 +524,7 @@ describe('Filtered Search Visual Tokens', () => { it('adds search visual token if previous visual token is valid', () => { tokensContainer.innerHTML = FilteredSearchSpecHelper.createTokensContainerHTML( - FilteredSearchSpecHelper.createFilterVisualTokenHTML('assignee', 'none'), + FilteredSearchSpecHelper.createFilterVisualTokenHTML('assignee', '=', 'none'), ); const input = document.querySelector('.filtered-search'); @@ -523,7 +540,7 @@ describe('Filtered Search Visual Tokens', () => { it('adds value to previous visual token element if previous visual token is invalid', () => { tokensContainer.innerHTML = FilteredSearchSpecHelper.createTokensContainerHTML( - FilteredSearchSpecHelper.createNameFilterVisualTokenHTML('assignee'), + FilteredSearchSpecHelper.createNameOperatorFilterVisualTokenHTML('assignee', '='), ); const input = document.querySelector('.filtered-search'); @@ -534,6 +551,7 @@ describe('Filtered Search Visual Tokens', () => { expect(input.value).toEqual(''); expect(updatedToken.querySelector('.name').innerText).toEqual('assignee'); + expect(updatedToken.querySelector('.operator').innerText).toEqual('='); expect(updatedToken.querySelector('.value').innerText).toEqual('@john'); }); }); @@ -544,9 +562,9 @@ describe('Filtered Search Visual Tokens', () => { beforeEach(() => { tokensContainer.innerHTML = FilteredSearchSpecHelper.createTokensContainerHTML(` - ${FilteredSearchSpecHelper.createFilterVisualTokenHTML('label', 'none')} + ${FilteredSearchSpecHelper.createFilterVisualTokenHTML('label', '=', 'none')} ${FilteredSearchSpecHelper.createSearchVisualTokenHTML('search')} - ${FilteredSearchSpecHelper.createFilterVisualTokenHTML('milestone', 'upcoming')} + ${FilteredSearchSpecHelper.createFilterVisualTokenHTML('milestone', '=', 'upcoming')} `); input = document.querySelector('.filtered-search'); @@ -614,7 +632,7 @@ describe('Filtered Search Visual Tokens', () => { describe('moveInputTotheRight', () => { it('does nothing if the input is already the right most element', () => { tokensContainer.innerHTML = FilteredSearchSpecHelper.createTokensContainerHTML( - FilteredSearchSpecHelper.createFilterVisualTokenHTML('label', 'none'), + FilteredSearchSpecHelper.createFilterVisualTokenHTML('label', '=', 'none'), ); spyOn(subject, 'tokenizeInput').and.callFake(() => {}); @@ -628,12 +646,12 @@ describe('Filtered Search Visual Tokens', () => { it("tokenize's input", () => { tokensContainer.innerHTML = ` - ${FilteredSearchSpecHelper.createNameFilterVisualTokenHTML('label')} + ${FilteredSearchSpecHelper.createNameOperatorFilterVisualTokenHTML('label', '=')} ${FilteredSearchSpecHelper.createInputHTML()} ${bugLabelToken.outerHTML} `; - document.querySelector('.filtered-search').value = 'none'; + tokensContainer.querySelector('.filtered-search').value = 'none'; subject.moveInputToTheRight(); const value = tokensContainer.querySelector('.js-visual-token .value'); @@ -643,7 +661,7 @@ describe('Filtered Search Visual Tokens', () => { it('converts input into search term token if last token is valid', () => { tokensContainer.innerHTML = ` - ${FilteredSearchSpecHelper.createFilterVisualTokenHTML('label', 'none')} + ${FilteredSearchSpecHelper.createFilterVisualTokenHTML('label', '=', 'none')} ${FilteredSearchSpecHelper.createInputHTML()} ${bugLabelToken.outerHTML} `; @@ -658,7 +676,7 @@ describe('Filtered Search Visual Tokens', () => { it('moves the input to the right most element', () => { tokensContainer.innerHTML = ` - ${FilteredSearchSpecHelper.createFilterVisualTokenHTML('label', 'none')} + ${FilteredSearchSpecHelper.createFilterVisualTokenHTML('label', '=', 'none')} ${FilteredSearchSpecHelper.createInputHTML()} ${bugLabelToken.outerHTML} `; @@ -670,8 +688,8 @@ describe('Filtered Search Visual Tokens', () => { it('tokenizes input even if input is the right most element', () => { tokensContainer.innerHTML = ` - ${FilteredSearchSpecHelper.createFilterVisualTokenHTML('label', 'none')} - ${FilteredSearchSpecHelper.createNameFilterVisualTokenHTML('label')} + ${FilteredSearchSpecHelper.createFilterVisualTokenHTML('label', '=', 'none')} + ${FilteredSearchSpecHelper.createNameOperatorFilterVisualTokenHTML('label')} ${FilteredSearchSpecHelper.createInputHTML('', '~bug')} `; diff --git a/spec/javascripts/filtered_search/issues_filtered_search_token_keys_spec.js b/spec/javascripts/filtered_search/issues_filtered_search_token_keys_spec.js index e33a6c002e5..c7be900ba2c 100644 --- a/spec/javascripts/filtered_search/issues_filtered_search_token_keys_spec.js +++ b/spec/javascripts/filtered_search/issues_filtered_search_token_keys_spec.js @@ -138,6 +138,7 @@ describe('Issues Filtered Search Token Keys', () => { const conditions = IssuableFilteredSearchTokenKeys.getConditions(); const result = IssuableFilteredSearchTokenKeys.searchByConditionKeyValue( conditions[0].tokenKey, + conditions[0].operator, conditions[0].value, ); diff --git a/spec/javascripts/filtered_search/visual_token_value_spec.js b/spec/javascripts/filtered_search/visual_token_value_spec.js index 5863005de1e..a039e280028 100644 --- a/spec/javascripts/filtered_search/visual_token_value_spec.js +++ b/spec/javascripts/filtered_search/visual_token_value_spec.js @@ -10,9 +10,11 @@ describe('Filtered Search Visual Tokens', () => { const tokenNameElement = tokenElement.querySelector('.name'); const tokenValueContainer = tokenElement.querySelector('.value-container'); const tokenValueElement = tokenValueContainer.querySelector('.value'); + const tokenOperatorElement = tokenElement.querySelector('.operator'); const tokenType = tokenNameElement.innerText.toLowerCase(); const tokenValue = tokenValueElement.innerText; - const subject = new VisualTokenValue(tokenValue, tokenType); + const tokenOperator = tokenOperatorElement.innerText; + const subject = new VisualTokenValue(tokenValue, tokenType, tokenOperator); return { subject, tokenValueContainer, tokenValueElement }; }; @@ -28,8 +30,8 @@ describe('Filtered Search Visual Tokens', () => { `); tokensContainer = document.querySelector('.tokens-container'); - authorToken = FilteredSearchSpecHelper.createFilterVisualToken('author', '@user'); - bugLabelToken = FilteredSearchSpecHelper.createFilterVisualToken('label', '~bug'); + authorToken = FilteredSearchSpecHelper.createFilterVisualToken('author', '=', '@user'); + bugLabelToken = FilteredSearchSpecHelper.createFilterVisualToken('label', '=', '~bug'); }); describe('updateUserTokenAppearance', () => { @@ -140,10 +142,12 @@ describe('Filtered Search Visual Tokens', () => { const missingLabelToken = FilteredSearchSpecHelper.createFilterVisualToken( 'label', + '=', '~doesnotexist', ); const spaceLabelToken = FilteredSearchSpecHelper.createFilterVisualToken( 'label', + '=', '~"some space"', ); |