summaryrefslogtreecommitdiff
path: root/spec/javascripts/filtered_search/filtered_search_dropdown_manager_spec.js
blob: c92a147b937c1e5540e2670f0d000c1c8ae79f45 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
import '~/extensions/array';
import '~/filtered_search/filtered_search_visual_tokens';
import '~/filtered_search/filtered_search_tokenizer';
import '~/filtered_search/filtered_search_dropdown_manager';

describe('Filtered Search Dropdown Manager', () => {
  describe('addWordToInput', () => {
    function getInputValue() {
      return document.querySelector('.filtered-search').value;
    }

    function setInputValue(value) {
      document.querySelector('.filtered-search').value = value;
    }

    beforeEach(() => {
      setFixtures(`
        <ul class="tokens-container">
          <li class="input-token">
            <input class="filtered-search">
          </li>
        </ul>
      `);
    });

    describe('input has no existing value', () => {
      it('should add just tokenName', () => {
        gl.FilteredSearchDropdownManager.addWordToInput('milestone');

        const token = document.querySelector('.tokens-container .js-visual-token');

        expect(token.classList.contains('filtered-search-token')).toEqual(true);
        expect(token.querySelector('.name').innerText).toBe('milestone');
        expect(getInputValue()).toBe('');
      });

      it('should add tokenName and tokenValue', () => {
        gl.FilteredSearchDropdownManager.addWordToInput('label');

        let 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(getInputValue()).toBe('');

        gl.FilteredSearchDropdownManager.addWordToInput('label', 'none');
        // We have to get that reference again
        // Because gl.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('.value').innerText).toBe('none');
        expect(getInputValue()).toBe('');
      });
    });

    describe('input has existing value', () => {
      it('should be able to just add tokenName', () => {
        setInputValue('a');
        gl.FilteredSearchDropdownManager.addWordToInput('author');

        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(getInputValue()).toBe('');
      });

      it('should replace tokenValue', () => {
        gl.FilteredSearchDropdownManager.addWordToInput('author');

        setInputValue('roo');
        gl.FilteredSearchDropdownManager.addWordToInput(null, '@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('.value').innerText).toBe('@root');
        expect(getInputValue()).toBe('');
      });

      it('should add tokenValues containing spaces', () => {
        gl.FilteredSearchDropdownManager.addWordToInput('label');

        setInputValue('"test ');
        gl.FilteredSearchDropdownManager.addWordToInput('label', '~\'"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('.value').innerText).toBe('~\'"test me"\'');
        expect(getInputValue()).toBe('');
      });
    });
  });
});