diff options
author | Simon Knox <psimyn@gmail.com> | 2019-07-02 17:51:32 +0300 |
---|---|---|
committer | Simon Knox <psimyn@gmail.com> | 2019-07-04 07:14:38 +0300 |
commit | 824ec018a1f9bafe3d7b5ff5f7db2a04d3cb4993 (patch) | |
tree | 4f01de6818db60ddf2134064dca6c931ef6d25fd /spec/frontend | |
parent | 19dc1105524e3d25821670706a750043775588fa (diff) |
Use gl-empty-state for monitor charts
Move a unit test to jest and use snapshot tests
Diffstat (limited to 'spec/frontend')
-rw-r--r-- | spec/frontend/monitoring/__snapshots__/dashboard_state_spec.js.snap | 37 | ||||
-rw-r--r-- | spec/frontend/monitoring/dashboard_state_spec.js | 43 |
2 files changed, 80 insertions, 0 deletions
diff --git a/spec/frontend/monitoring/__snapshots__/dashboard_state_spec.js.snap b/spec/frontend/monitoring/__snapshots__/dashboard_state_spec.js.snap new file mode 100644 index 00000000000..5f24bab600c --- /dev/null +++ b/spec/frontend/monitoring/__snapshots__/dashboard_state_spec.js.snap @@ -0,0 +1,37 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`EmptyState shows gettingStarted state 1`] = ` +<glemptystate-stub + description="Stay updated about the performance and health of your environment by configuring Prometheus to monitor your deployments." + primarybuttonlink="/clustersPath" + primarybuttontext="Install on clusters" + secondarybuttonlink="/settingsPath" + secondarybuttontext="Configure existing installation" + svgpath="/path/to/getting-started.svg" + title="Get started with performance monitoring" +/> +`; + +exports[`EmptyState shows loading state 1`] = ` +<glemptystate-stub + description="Creating graphs uses the data from the Prometheus server. If this takes a long time, ensure that data is available." + primarybuttonlink="/documentationPath" + primarybuttontext="View documentation" + secondarybuttonlink="" + secondarybuttontext="" + svgpath="/path/to/loading.svg" + title="Waiting for performance data" +/> +`; + +exports[`EmptyState shows unableToConnect state 1`] = ` +<glemptystate-stub + description="Ensure connectivity is available from the GitLab server to the Prometheus server" + primarybuttonlink="/documentationPath" + primarybuttontext="View documentation" + secondarybuttonlink="/settingsPath" + secondarybuttontext="Configure Prometheus" + svgpath="/path/to/unable-to-connect.svg" + title="Unable to connect to Prometheus server" +/> +`; diff --git a/spec/frontend/monitoring/dashboard_state_spec.js b/spec/frontend/monitoring/dashboard_state_spec.js new file mode 100644 index 00000000000..950422911eb --- /dev/null +++ b/spec/frontend/monitoring/dashboard_state_spec.js @@ -0,0 +1,43 @@ +import { shallowMount } from '@vue/test-utils'; +import EmptyState from '~/monitoring/components/empty_state.vue'; + +function createComponent(props) { + return shallowMount(EmptyState, { + propsData: { + ...props, + settingsPath: '/settingsPath', + clustersPath: '/clustersPath', + documentationPath: '/documentationPath', + emptyGettingStartedSvgPath: '/path/to/getting-started.svg', + emptyLoadingSvgPath: '/path/to/loading.svg', + emptyNoDataSvgPath: '/path/to/no-data.svg', + emptyUnableToConnectSvgPath: '/path/to/unable-to-connect.svg', + }, + }); +} + +describe('EmptyState', () => { + it('shows gettingStarted state', () => { + const wrapper = createComponent({ + selectedState: 'gettingStarted', + }); + + expect(wrapper.element).toMatchSnapshot(); + }); + + it('shows loading state', () => { + const wrapper = createComponent({ + selectedState: 'loading', + }); + + expect(wrapper.element).toMatchSnapshot(); + }); + + it('shows unableToConnect state', () => { + const wrapper = createComponent({ + selectedState: 'unableToConnect', + }); + + expect(wrapper.element).toMatchSnapshot(); + }); +}); |