diff --git a/app/assets/javascripts/droplab/droplab_ajax.js b/app/assets/javascripts/droplab/droplab_ajax.js index f7fed0987a2..c290e1a8355 100644 --- a/app/assets/javascripts/droplab/droplab_ajax.js +++ b/app/assets/javascripts/droplab/droplab_ajax.js @@ -9,6 +9,7 @@ require('../window')(function(w){ w.droplabAjax = { _loadUrlData: function _loadUrlData(url) { + var self = this; return new Promise(function(resolve, reject) { var xhr = new XMLHttpRequest; xhr.open('GET', url, true); @@ -16,6 +17,7 @@ require('../window')(function(w){ if(xhr.readyState === XMLHttpRequest.DONE) { if (xhr.status === 200) { var data = JSON.parse(xhr.responseText); + self.cache[url] = data; return resolve(data); } else { return reject([xhr.responseText, xhr.status]); @@ -26,8 +28,21 @@ require('../window')(function(w){ }); }, + _loadData: function _loadData(data, config, self) { + if (config.loadingTemplate) { + var dataLoadingTemplate = self.hook.list.list.querySelector('[data-loading-template]'); + + if (dataLoadingTemplate) { + dataLoadingTemplate.outerHTML = self.listTemplate; + } + } + + self.hook.list[config.method].call(self.hook.list, data); + }, + init: function init(hook) { var self = this; + self.cache = self.cache || {}; var config = hook.config.droplabAjax; this.hook = hook; @@ -50,22 +65,16 @@ require('../window')(function(w){ dynamicList.outerHTML = loadingTemplate.outerHTML; } - this._loadUrlData(config.endpoint) - .then(function(d) { - if (config.loadingTemplate) { - var dataLoadingTemplate = self.hook.list.list.querySelector('[data-loading-template]'); - - if (dataLoadingTemplate) { - dataLoadingTemplate.outerHTML = self.listTemplate; - } - } - - if (!self.hook.list.hidden) { - self.hook.list[config.method].call(self.hook.list, d); - } - }).catch(function(e) { - throw new droplabAjaxException(e.message || e); - }); + if (self.cache[config.endpoint]) { + self._loadData(self.cache[config.endpoint], config, self); + } else { + this._loadUrlData(config.endpoint) + .then(function(d) { + self._loadData(d, config, self); + }).catch(function(e) { + throw new droplabAjaxException(e.message || e); + }); + } }, destroy: function() { diff --git a/app/assets/javascripts/droplab/droplab_ajax_filter.js b/app/assets/javascripts/droplab/droplab_ajax_filter.js index 86a08d0d01d..b63d73066cb 100644 --- a/app/assets/javascripts/droplab/droplab_ajax_filter.js +++ b/app/assets/javascripts/droplab/droplab_ajax_filter.js @@ -72,32 +72,22 @@ require('../window')(function(w){ var params = config.params || {}; params[config.searchKey] = searchValue; var self = this; - this._loadUrlData(config.endpoint + this.buildParams(params)).then(function(data) { - if (config.loadingTemplate && self.hook.list.data === undefined || - self.hook.list.data.length === 0) { - const dataLoadingTemplate = self.hook.list.list.querySelector('[data-loading-template]'); + self.cache = self.cache || {}; + var url = config.endpoint + this.buildParams(params); + var urlCachedData = self.cache[url]; - if (dataLoadingTemplate) { - dataLoadingTemplate.outerHTML = self.listTemplate; - } - } - - if (!self.destroyed) { - var hookListChildren = self.hook.list.list.children; - var onlyDynamicList = hookListChildren.length === 1 && hookListChildren[0].hasAttribute('data-dynamic'); - - if (onlyDynamicList && data.length === 0) { - self.hook.list.hide(); - } - - self.hook.list.setData.call(self.hook.list, data); - } - self.notLoading(); - self.hook.list.currentIndex = 0; - }); + if (urlCachedData) { + self._loadData(urlCachedData, config, self); + } else { + this._loadUrlData(url) + .then(function(data) { + self._loadData(data, config, self); + }); + } }, _loadUrlData: function _loadUrlData(url) { + var self = this; return new Promise(function(resolve, reject) { var xhr = new XMLHttpRequest; xhr.open('GET', url, true); @@ -105,6 +95,7 @@ require('../window')(function(w){ if(xhr.readyState === XMLHttpRequest.DONE) { if (xhr.status === 200) { var data = JSON.parse(xhr.responseText); + self.cache[url] = data; return resolve(data); } else { return reject([xhr.responseText, xhr.status]); @@ -115,6 +106,30 @@ require('../window')(function(w){ }); }, + _loadData: function _loadData(data, config, self) { + if (config.loadingTemplate && self.hook.list.data === undefined || + self.hook.list.data.length === 0) { + const dataLoadingTemplate = self.hook.list.list.querySelector('[data-loading-template]'); + + if (dataLoadingTemplate) { + dataLoadingTemplate.outerHTML = self.listTemplate; + } + } + + if (!self.destroyed) { + var hookListChildren = self.hook.list.list.children; + var onlyDynamicList = hookListChildren.length === 1 && hookListChildren[0].hasAttribute('data-dynamic'); + + if (onlyDynamicList && data.length === 0) { + self.hook.list.hide(); + } + + self.hook.list.setData.call(self.hook.list, data); + } + self.notLoading(); + self.hook.list.currentIndex = 0; + }, + buildParams: function(params) { if (!params) return ''; var paramsArray = Object.keys(params).map(function(param) { diff --git a/changelogs/unreleased/26844-new-search-bar-performs-a-new-request-for-each-tag.yml b/changelogs/unreleased/26844-new-search-bar-performs-a-new-request-for-each-tag.yml new file mode 100644 index 00000000000..4678297cfd4 --- /dev/null +++ b/changelogs/unreleased/26844-new-search-bar-performs-a-new-request-for-each-tag.yml @@ -0,0 +1,4 @@ +--- +title: Add caching of droplab ajax requests +merge_request: 8725 +author: diff --git a/spec/features/issues/filtered_search/dropdown_assignee_spec.rb b/spec/features/issues/filtered_search/dropdown_assignee_spec.rb index 8a155c3bfc5..525c2b0ae72 100644 --- a/spec/features/issues/filtered_search/dropdown_assignee_spec.rb +++ b/spec/features/issues/filtered_search/dropdown_assignee_spec.rb @@ -185,4 +185,22 @@ describe 'Dropdown assignee', js: true, feature: true do expect(page).to have_css(js_dropdown_assignee, visible: true) end end + + describe 'caching requests' do + it 'caches requests after the first load' do + filtered_search.set('assignee') + send_keys_to_filtered_search(':') + initial_size = dropdown_assignee_size + + expect(initial_size).to be > 0 + + new_user = create(:user) + project.team << [new_user, :master] + find('.filtered-search-input-container .clear-search').click + filtered_search.set('assignee') + send_keys_to_filtered_search(':') + + expect(dropdown_assignee_size).to eq(initial_size) + end + end end diff --git a/spec/features/issues/filtered_search/dropdown_author_spec.rb b/spec/features/issues/filtered_search/dropdown_author_spec.rb index a5d5d9d4c5e..59e302f0e2d 100644 --- a/spec/features/issues/filtered_search/dropdown_author_spec.rb +++ b/spec/features/issues/filtered_search/dropdown_author_spec.rb @@ -157,4 +157,22 @@ describe 'Dropdown author', js: true, feature: true do expect(page).to have_css(js_dropdown_author, visible: true) end end + + describe 'caching requests' do + it 'caches requests after the first load' do + filtered_search.set('author') + send_keys_to_filtered_search(':') + initial_size = dropdown_author_size + + expect(initial_size).to be > 0 + + new_user = create(:user) + project.team << [new_user, :master] + find('.filtered-search-input-container .clear-search').click + filtered_search.set('author') + send_keys_to_filtered_search(':') + + expect(dropdown_author_size).to eq(initial_size) + end + end end diff --git a/spec/features/issues/filtered_search/dropdown_label_spec.rb b/spec/features/issues/filtered_search/dropdown_label_spec.rb index f09ad2dd86b..5079eb8dd00 100644 --- a/spec/features/issues/filtered_search/dropdown_label_spec.rb +++ b/spec/features/issues/filtered_search/dropdown_label_spec.rb @@ -249,4 +249,21 @@ describe 'Dropdown label', js: true, feature: true do expect(page).to have_css(js_dropdown_label, visible: true) end end + + describe 'caching requests' do + it 'caches requests after the first load' do + filtered_search.set('label') + send_keys_to_filtered_search(':') + initial_size = dropdown_label_size + + expect(initial_size).to be > 0 + + create(:label, project: project) + find('.filtered-search-input-container .clear-search').click + filtered_search.set('label') + send_keys_to_filtered_search(':') + + expect(dropdown_label_size).to eq(initial_size) + end + end end diff --git a/spec/features/issues/filtered_search/dropdown_milestone_spec.rb b/spec/features/issues/filtered_search/dropdown_milestone_spec.rb index 134e58ad586..0ce16715b86 100644 --- a/spec/features/issues/filtered_search/dropdown_milestone_spec.rb +++ b/spec/features/issues/filtered_search/dropdown_milestone_spec.rb @@ -219,4 +219,21 @@ describe 'Dropdown milestone', js: true, feature: true do expect(page).to have_css(js_dropdown_milestone, visible: true) end end + + describe 'caching requests' do + it 'caches requests after the first load' do + filtered_search.set('milestone') + send_keys_to_filtered_search(':') + initial_size = dropdown_milestone_size + + expect(initial_size).to be > 0 + + create(:milestone, project: project) + find('.filtered-search-input-container .clear-search').click + filtered_search.set('milestone') + send_keys_to_filtered_search(':') + + expect(dropdown_milestone_size).to eq(initial_size) + end + end end