diff options
author | Adriel Santiago <adriel@gitlab.com> | 2019-01-23 18:06:40 -0500 |
---|---|---|
committer | Adriel Santiago <adriel@gitlab.com> | 2019-02-04 08:04:45 -0500 |
commit | c974f4a82ee3cd4b5b73b95d66d99854a0e5d3bc (patch) | |
tree | 183122acce41af316c31515c5c7431e886db282b /spec | |
parent | 2b0f4df0217b4a4aee53f964610d66ceedb68dca (diff) | |
download | gitlab-ce-c974f4a82ee3cd4b5b73b95d66d99854a0e5d3bc.tar.gz |
Handle window and container resize events
Resizes metrics graph on window and sidebard width changes
Diffstat (limited to 'spec')
-rw-r--r-- | spec/javascripts/lib/utils/common_utils_spec.js | 15 | ||||
-rw-r--r-- | spec/javascripts/monitoring/dashboard_spec.js | 12 |
2 files changed, 21 insertions, 6 deletions
diff --git a/spec/javascripts/lib/utils/common_utils_spec.js b/spec/javascripts/lib/utils/common_utils_spec.js index e3fd9604474..3eff3f655ee 100644 --- a/spec/javascripts/lib/utils/common_utils_spec.js +++ b/spec/javascripts/lib/utils/common_utils_spec.js @@ -232,6 +232,21 @@ describe('common_utils', () => { }); }); + describe('debounceByAnimationFrame', () => { + it('debounces a function to allow a maximum of one call per animation frame', done => { + const spy = jasmine.createSpy('spy'); + const debouncedSpy = commonUtils.debounceByAnimationFrame(spy); + window.requestAnimationFrame(() => { + debouncedSpy(); + debouncedSpy(); + window.requestAnimationFrame(() => { + expect(spy).toHaveBeenCalledTimes(1); + done(); + }); + }); + }); + }); + describe('getParameterByName', () => { beforeEach(() => { window.history.pushState({}, null, '?scope=all&p=2'); diff --git a/spec/javascripts/monitoring/dashboard_spec.js b/spec/javascripts/monitoring/dashboard_spec.js index 565b87de248..97b9671c809 100644 --- a/spec/javascripts/monitoring/dashboard_spec.js +++ b/spec/javascripts/monitoring/dashboard_spec.js @@ -29,7 +29,7 @@ describe('Dashboard', () => { beforeEach(() => { setFixtures(` <div class="prometheus-graphs"></div> - <div class="nav-sidebar"></div> + <div class="layout-page"></div> `); DashboardComponent = Vue.extend(Dashboard); }); @@ -164,16 +164,16 @@ describe('Dashboard', () => { jasmine.clock().uninstall(); }); - it('rerenders the dashboard when the sidebar is resized', done => { + it('sets elWidth to page width when the sidebar is resized', done => { const component = new DashboardComponent({ el: document.querySelector('.prometheus-graphs'), propsData: { ...propsData, hasMetrics: true, showPanels: false }, }); - expect(component.forceRedraw).toEqual(0); + expect(component.elWidth).toEqual(0); - const navSidebarEl = document.querySelector('.nav-sidebar'); - navSidebarEl.classList.add('nav-sidebar-collapsed'); + const pageLayoutEl = document.querySelector('.layout-page'); + pageLayoutEl.classList.add('page-with-icon-sidebar'); Vue.nextTick() .then(() => { @@ -181,7 +181,7 @@ describe('Dashboard', () => { return Vue.nextTick(); }) .then(() => { - expect(component.forceRedraw).toEqual(component.elWidth); + expect(component.elWidth).toEqual(pageLayoutEl.clientWidth); done(); }) .catch(done.fail); |