summaryrefslogtreecommitdiff
path: root/spec/javascripts
diff options
context:
space:
mode:
Diffstat (limited to 'spec/javascripts')
-rw-r--r--spec/javascripts/deploy_keys/components/action_btn_spec.js70
-rw-r--r--spec/javascripts/deploy_keys/components/app_spec.js142
-rw-r--r--spec/javascripts/deploy_keys/components/key_spec.js92
-rw-r--r--spec/javascripts/deploy_keys/components/keys_panel_spec.js70
-rw-r--r--spec/javascripts/environments/environment_actions_spec.js12
-rw-r--r--spec/javascripts/environments/environment_rollback_spec.js24
-rw-r--r--spec/javascripts/environments/environment_stop_spec.js10
-rw-r--r--spec/javascripts/fixtures/deploy_keys.rb36
-rw-r--r--spec/javascripts/fixtures/environments.rb30
-rw-r--r--spec/javascripts/fixtures/environments/metrics.html.haml62
-rw-r--r--spec/javascripts/fixtures/mini_dropdown_graph.html.haml6
-rw-r--r--spec/javascripts/issue_spec.js4
-rw-r--r--spec/javascripts/monitoring/deployments_spec.js133
-rw-r--r--spec/javascripts/monitoring/prometheus_graph_spec.js4
-rw-r--r--spec/javascripts/notes_spec.js131
-rw-r--r--spec/javascripts/pipelines/stage_spec.js121
16 files changed, 731 insertions, 216 deletions
diff --git a/spec/javascripts/deploy_keys/components/action_btn_spec.js b/spec/javascripts/deploy_keys/components/action_btn_spec.js
new file mode 100644
index 00000000000..5b93fbc5575
--- /dev/null
+++ b/spec/javascripts/deploy_keys/components/action_btn_spec.js
@@ -0,0 +1,70 @@
+import Vue from 'vue';
+import eventHub from '~/deploy_keys/eventhub';
+import actionBtn from '~/deploy_keys/components/action_btn.vue';
+
+describe('Deploy keys action btn', () => {
+ const data = getJSONFixture('deploy_keys/keys.json');
+ const deployKey = data.enabled_keys[0];
+ let vm;
+
+ beforeEach((done) => {
+ const ActionBtnComponent = Vue.extend(actionBtn);
+
+ vm = new ActionBtnComponent({
+ propsData: {
+ deployKey,
+ type: 'enable',
+ },
+ }).$mount();
+
+ setTimeout(done);
+ });
+
+ it('renders the type as uppercase', () => {
+ expect(
+ vm.$el.textContent.trim(),
+ ).toBe('Enable');
+ });
+
+ it('sends eventHub event with btn type', (done) => {
+ spyOn(eventHub, '$emit');
+
+ vm.$el.click();
+
+ setTimeout(() => {
+ expect(
+ eventHub.$emit,
+ ).toHaveBeenCalledWith('enable.key', deployKey);
+
+ done();
+ });
+ });
+
+ it('shows loading spinner after click', (done) => {
+ vm.$el.click();
+
+ setTimeout(() => {
+ expect(
+ vm.$el.querySelector('.fa'),
+ ).toBeDefined();
+
+ done();
+ });
+ });
+
+ it('disables button after click', (done) => {
+ vm.$el.click();
+
+ setTimeout(() => {
+ expect(
+ vm.$el.classList.contains('disabled'),
+ ).toBeTruthy();
+
+ expect(
+ vm.$el.getAttribute('disabled'),
+ ).toBe('disabled');
+
+ done();
+ });
+ });
+});
diff --git a/spec/javascripts/deploy_keys/components/app_spec.js b/spec/javascripts/deploy_keys/components/app_spec.js
new file mode 100644
index 00000000000..700897f50b0
--- /dev/null
+++ b/spec/javascripts/deploy_keys/components/app_spec.js
@@ -0,0 +1,142 @@
+import Vue from 'vue';
+import eventHub from '~/deploy_keys/eventhub';
+import deployKeysApp from '~/deploy_keys/components/app.vue';
+
+describe('Deploy keys app component', () => {
+ const data = getJSONFixture('deploy_keys/keys.json');
+ let vm;
+
+ const deployKeysResponse = (request, next) => {
+ next(request.respondWith(JSON.stringify(data), {
+ status: 200,
+ }));
+ };
+
+ beforeEach((done) => {
+ const Component = Vue.extend(deployKeysApp);
+
+ Vue.http.interceptors.push(deployKeysResponse);
+
+ vm = new Component({
+ propsData: {
+ endpoint: '/test',
+ },
+ }).$mount();
+
+ setTimeout(done);
+ });
+
+ afterEach(() => {
+ Vue.http.interceptors = _.without(Vue.http.interceptors, deployKeysResponse);
+ });
+
+ it('renders loading icon', (done) => {
+ vm.store.keys = {};
+ vm.isLoading = false;
+
+ Vue.nextTick(() => {
+ expect(
+ vm.$el.querySelectorAll('.deploy-keys-panel').length,
+ ).toBe(0);
+
+ expect(
+ vm.$el.querySelector('.fa-spinner'),
+ ).toBeDefined();
+
+ done();
+ });
+ });
+
+ it('renders keys panels', () => {
+ expect(
+ vm.$el.querySelectorAll('.deploy-keys-panel').length,
+ ).toBe(3);
+ });
+
+ it('does not render key panels when keys object is empty', (done) => {
+ vm.store.keys = {};
+
+ Vue.nextTick(() => {
+ expect(
+ vm.$el.querySelectorAll('.deploy-keys-panel').length,
+ ).toBe(0);
+
+ done();
+ });
+ });
+
+ it('does not render public panel when empty', (done) => {
+ vm.store.keys.public_keys = [];
+
+ Vue.nextTick(() => {
+ expect(
+ vm.$el.querySelectorAll('.deploy-keys-panel').length,
+ ).toBe(2);
+
+ done();
+ });
+ });
+
+ it('re-fetches deploy keys when enabling a key', (done) => {
+ const key = data.public_keys[0];
+
+ spyOn(vm.service, 'getKeys');
+ spyOn(vm.service, 'enableKey').and.callFake(() => new Promise((resolve) => {
+ resolve();
+
+ setTimeout(() => {
+ expect(vm.service.getKeys).toHaveBeenCalled();
+
+ done();
+ });
+ }));
+
+ eventHub.$emit('enable.key', key);
+
+ expect(vm.service.enableKey).toHaveBeenCalledWith(key.id);
+ });
+
+ it('re-fetches deploy keys when disabling a key', (done) => {
+ const key = data.public_keys[0];
+
+ spyOn(window, 'confirm').and.returnValue(true);
+ spyOn(vm.service, 'getKeys');
+ spyOn(vm.service, 'disableKey').and.callFake(() => new Promise((resolve) => {
+ resolve();
+
+ setTimeout(() => {
+ expect(vm.service.getKeys).toHaveBeenCalled();
+
+ done();
+ });
+ }));
+
+ eventHub.$emit('disable.key', key);
+
+ expect(vm.service.disableKey).toHaveBeenCalledWith(key.id);
+ });
+
+ it('calls disableKey when removing a key', (done) => {
+ const key = data.public_keys[0];
+
+ spyOn(window, 'confirm').and.returnValue(true);
+ spyOn(vm.service, 'getKeys');
+ spyOn(vm.service, 'disableKey').and.callFake(() => new Promise((resolve) => {
+ resolve();
+
+ setTimeout(() => {
+ expect(vm.service.getKeys).toHaveBeenCalled();
+
+ done();
+ });
+ }));
+
+ eventHub.$emit('remove.key', key);
+
+ expect(vm.service.disableKey).toHaveBeenCalledWith(key.id);
+ });
+
+ it('hasKeys returns true when there are keys', () => {
+ expect(vm.hasKeys).toEqual(3);
+ });
+});
diff --git a/spec/javascripts/deploy_keys/components/key_spec.js b/spec/javascripts/deploy_keys/components/key_spec.js
new file mode 100644
index 00000000000..793ab8c451d
--- /dev/null
+++ b/spec/javascripts/deploy_keys/components/key_spec.js
@@ -0,0 +1,92 @@
+import Vue from 'vue';
+import DeployKeysStore from '~/deploy_keys/store';
+import key from '~/deploy_keys/components/key.vue';
+
+describe('Deploy keys key', () => {
+ let vm;
+ const KeyComponent = Vue.extend(key);
+ const data = getJSONFixture('deploy_keys/keys.json');
+ const createComponent = (deployKey) => {
+ const store = new DeployKeysStore();
+ store.keys = data;
+
+ vm = new KeyComponent({
+ propsData: {
+ deployKey,
+ store,
+ },
+ }).$mount();
+ };
+
+ describe('enabled key', () => {
+ const deployKey = data.enabled_keys[0];
+
+ beforeEach((done) => {
+ createComponent(deployKey);
+
+ setTimeout(done);
+ });
+
+ it('renders the keys title', () => {
+ expect(
+ vm.$el.querySelector('.title').textContent.trim(),
+ ).toContain('My title');
+ });
+
+ it('renders human friendly formatted created date', () => {
+ expect(
+ vm.$el.querySelector('.key-created-at').textContent.trim(),
+ ).toBe(`created ${gl.utils.getTimeago().format(deployKey.created_at)}`);
+ });
+
+ it('shows remove button', () => {
+ expect(
+ vm.$el.querySelector('.btn').textContent.trim(),
+ ).toBe('Remove');
+ });
+
+ it('shows write access text when key has write access', (done) => {
+ vm.deployKey.can_push = true;
+
+ Vue.nextTick(() => {
+ expect(
+ vm.$el.querySelector('.write-access-allowed'),
+ ).not.toBeNull();
+
+ expect(
+ vm.$el.querySelector('.write-access-allowed').textContent.trim(),
+ ).toBe('Write access allowed');
+
+ done();
+ });
+ });
+ });
+
+ describe('public keys', () => {
+ const deployKey = data.public_keys[0];
+
+ beforeEach((done) => {
+ createComponent(deployKey);
+
+ setTimeout(done);
+ });
+
+ it('shows enable button', () => {
+ expect(
+ vm.$el.querySelector('.btn').textContent.trim(),
+ ).toBe('Enable');
+ });
+
+ it('shows disable button when key is enabled', (done) => {
+ vm.store.keys.enabled_keys.push(deployKey);
+
+ Vue.nextTick(() => {
+ expect(
+ vm.$el.querySelector('.btn').textContent.trim(),
+ ).toBe('Disable');
+
+ done();
+ });
+ });
+ });
+});
diff --git a/spec/javascripts/deploy_keys/components/keys_panel_spec.js b/spec/javascripts/deploy_keys/components/keys_panel_spec.js
new file mode 100644
index 00000000000..a69b39c35c4
--- /dev/null
+++ b/spec/javascripts/deploy_keys/components/keys_panel_spec.js
@@ -0,0 +1,70 @@
+import Vue from 'vue';
+import DeployKeysStore from '~/deploy_keys/store';
+import deployKeysPanel from '~/deploy_keys/components/keys_panel.vue';
+
+describe('Deploy keys panel', () => {
+ const data = getJSONFixture('deploy_keys/keys.json');
+ let vm;
+
+ beforeEach((done) => {
+ const DeployKeysPanelComponent = Vue.extend(deployKeysPanel);
+ const store = new DeployKeysStore();
+ store.keys = data;
+
+ vm = new DeployKeysPanelComponent({
+ propsData: {
+ title: 'test',
+ keys: data.enabled_keys,
+ showHelpBox: true,
+ store,
+ },
+ }).$mount();
+
+ setTimeout(done);
+ });
+
+ it('renders the title with keys count', () => {
+ expect(
+ vm.$el.querySelector('h5').textContent.trim(),
+ ).toContain('test');
+
+ expect(
+ vm.$el.querySelector('h5').textContent.trim(),
+ ).toContain(`(${vm.keys.length})`);
+ });
+
+ it('renders list of keys', () => {
+ expect(
+ vm.$el.querySelectorAll('li').length,
+ ).toBe(vm.keys.length);
+ });
+
+ it('renders help box if keys are empty', (done) => {
+ vm.keys = [];
+
+ Vue.nextTick(() => {
+ expect(
+ vm.$el.querySelector('.settings-message'),
+ ).toBeDefined();
+
+ expect(
+ vm.$el.querySelector('.settings-message').textContent.trim(),
+ ).toBe('No deploy keys found. Create one with the form above.');
+
+ done();
+ });
+ });
+
+ it('does not render help box if keys are empty & showHelpBox is false', (done) => {
+ vm.keys = [];
+ vm.showHelpBox = false;
+
+ Vue.nextTick(() => {
+ expect(
+ vm.$el.querySelector('.settings-message'),
+ ).toBeNull();
+
+ done();
+ });
+ });
+});
diff --git a/spec/javascripts/environments/environment_actions_spec.js b/spec/javascripts/environments/environment_actions_spec.js
index 676bf61cfd9..596d812c724 100644
--- a/spec/javascripts/environments/environment_actions_spec.js
+++ b/spec/javascripts/environments/environment_actions_spec.js
@@ -4,7 +4,6 @@ import actionsComp from '~/environments/components/environment_actions.vue';
describe('Actions Component', () => {
let ActionsComponent;
let actionsMock;
- let spy;
let component;
beforeEach(() => {
@@ -26,13 +25,9 @@ describe('Actions Component', () => {
},
];
- spy = jasmine.createSpy('spy').and.returnValue(Promise.resolve());
component = new ActionsComponent({
propsData: {
actions: actionsMock,
- service: {
- postAction: spy,
- },
},
}).$mount();
});
@@ -48,13 +43,6 @@ describe('Actions Component', () => {
).toEqual(actionsMock.length);
});
- it('should call the service when an action is clicked', () => {
- component.$el.querySelector('.dropdown').click();
- component.$el.querySelector('.js-manual-action-link').click();
-
- expect(spy).toHaveBeenCalledWith(actionsMock[0].play_path);
- });
-
it('should render a disabled action when it\'s not playable', () => {
expect(
component.$el.querySelector('.dropdown-menu li:last-child button').getAttribute('disabled'),
diff --git a/spec/javascripts/environments/environment_rollback_spec.js b/spec/javascripts/environments/environment_rollback_spec.js
index 25397714a76..eb8e49d81fe 100644
--- a/spec/javascripts/environments/environment_rollback_spec.js
+++ b/spec/javascripts/environments/environment_rollback_spec.js
@@ -4,11 +4,9 @@ import rollbackComp from '~/environments/components/environment_rollback.vue';
describe('Rollback Component', () => {
const retryURL = 'https://gitlab.com/retry';
let RollbackComponent;
- let spy;
beforeEach(() => {
RollbackComponent = Vue.extend(rollbackComp);
- spy = jasmine.createSpy('spy').and.returnValue(Promise.resolve());
});
it('Should render Re-deploy label when isLastDeployment is true', () => {
@@ -17,9 +15,6 @@ describe('Rollback Component', () => {
propsData: {
retryUrl: retryURL,
isLastDeployment: true,
- service: {
- postAction: spy,
- },
},
}).$mount();
@@ -32,28 +27,9 @@ describe('Rollback Component', () => {
propsData: {
retryUrl: retryURL,
isLastDeployment: false,
- service: {
- postAction: spy,
- },
},
}).$mount();
expect(component.$el.querySelector('span').textContent).toContain('Rollback');
});
-
- it('should call the service when the button is clicked', () => {
- const component = new RollbackComponent({
- propsData: {
- retryUrl: retryURL,
- isLastDeployment: false,
- service: {
- postAction: spy,
- },
- },
- }).$mount();
-
- component.$el.click();
-
- expect(spy).toHaveBeenCalledWith(retryURL);
- });
});
diff --git a/spec/javascripts/environments/environment_stop_spec.js b/spec/javascripts/environments/environment_stop_spec.js
index 942e4aaabd4..8131f1e5b11 100644
--- a/spec/javascripts/environments/environment_stop_spec.js
+++ b/spec/javascripts/environments/environment_stop_spec.js
@@ -4,20 +4,15 @@ import stopComp from '~/environments/components/environment_stop.vue';
describe('Stop Component', () => {
let StopComponent;
let component;
- let spy;
const stopURL = '/stop';
beforeEach(() => {
StopComponent = Vue.extend(stopComp);
- spy = jasmine.createSpy('spy').and.returnValue(Promise.resolve());
spyOn(window, 'confirm').and.returnValue(true);
component = new StopComponent({
propsData: {
stopUrl: stopURL,
- service: {
- postAction: spy,
- },
},
}).$mount();
});
@@ -26,9 +21,4 @@ describe('Stop Component', () => {
expect(component.$el.tagName).toEqual('BUTTON');
expect(component.$el.getAttribute('title')).toEqual('Stop');
});
-
- it('should call the service when an action is clicked', () => {
- component.$el.click();
- expect(spy).toHaveBeenCalled();
- });
});
diff --git a/spec/javascripts/fixtures/deploy_keys.rb b/spec/javascripts/fixtures/deploy_keys.rb
new file mode 100644
index 00000000000..16e598a4b29
--- /dev/null
+++ b/spec/javascripts/fixtures/deploy_keys.rb
@@ -0,0 +1,36 @@
+require 'spec_helper'
+
+describe Projects::DeployKeysController, '(JavaScript fixtures)', type: :controller do
+ include JavaScriptFixturesHelpers
+
+ let(:admin) { create(:admin) }
+ let(:namespace) { create(:namespace, name: 'frontend-fixtures' )}
+ let(:project) { create(:project_empty_repo, namespace: namespace, path: 'todos-project') }
+ let(:project2) { create(:empty_project, :internal)}
+
+ before(:all) do
+ clean_frontend_fixtures('deploy_keys/')
+ end
+
+ before(:each) do
+ sign_in(admin)
+ end
+
+ render_views
+
+ it 'deploy_keys/keys.json' do |example|
+ create(:deploy_key, public: true)
+ project_key = create(:deploy_key, key: 'ssh-rsa AAAAB3NzaC1yc2EAAAADAQABAAAAgQCdMHEHyhRjbhEZVddFn6lTWdgEy5Q6Bz4nwGB76xWZI5YT/1WJOMEW+sL5zYd31kk7sd3FJ5L9ft8zWMWrr/iWXQikC2cqZK24H1xy+ZUmrRuJD4qGAaIVoyyzBL+avL+lF8J5lg6YSw8gwJY/lX64/vnJHUlWw2n5BF8IFOWhiw== dummy@gitlab.com')
+ internal_key = create(:deploy_key, key: 'ssh-rsa AAAAB3NzaC1yc2EAAAADAQABAAAAgQDNd/UJWhPrpb+b/G5oL109y57yKuCxE+WUGJGYaj7WQKsYRJmLYh1mgjrl+KVyfsWpq4ylOxIfFSnN9xBBFN8mlb0Fma5DC7YsSsibJr3MZ19ZNBprwNcdogET7aW9I0In7Wu5f2KqI6e5W/spJHCy4JVxzVMUvk6Myab0LnJ2iQ== dummy@gitlab.com')
+ create(:deploy_keys_project, project: project, deploy_key: project_key)
+ create(:deploy_keys_project, project: project2, deploy_key: internal_key)
+
+ get :index,
+ namespace_id: project.namespace.to_param,
+ project_id: project,
+ format: :json
+
+ expect(response).to be_success
+ store_frontend_fixture(response, example.description)
+ end
+end
diff --git a/spec/javascripts/fixtures/environments.rb b/spec/javascripts/fixtures/environments.rb
new file mode 100644
index 00000000000..3474f4696ef
--- /dev/null
+++ b/spec/javascripts/fixtures/environments.rb
@@ -0,0 +1,30 @@
+require 'spec_helper'
+
+describe Projects::EnvironmentsController, '(JavaScript fixtures)', type: :controller do
+ include JavaScriptFixturesHelpers
+
+ let(:admin) { create(:admin) }
+ let(:namespace) { create(:namespace, name: 'frontend-fixtures' )}
+ let(:project) { create(:project_empty_repo, namespace: namespace, path: 'environments-project') }
+ let(:environment) { create(:environment, name: 'production', project: project) }
+
+ render_views
+
+ before(:all) do
+ clean_frontend_fixtures('environments/metrics')
+ end
+
+ before(:each) do
+ sign_in(admin)
+ end
+
+ it 'environments/metrics/metrics.html.raw' do |example|
+ get :metrics,
+ namespace_id: project.namespace,
+ project_id: project,
+ id: environment.id
+
+ expect(response).to be_success
+ store_frontend_fixture(response, example.description)
+ end
+end
diff --git a/spec/javascripts/fixtures/environments/metrics.html.haml b/spec/javascripts/fixtures/environments/metrics.html.haml
deleted file mode 100644
index e2dd9519898..00000000000
--- a/spec/javascripts/fixtures/environments/metrics.html.haml
+++ /dev/null
@@ -1,62 +0,0 @@
-.prometheus-container{ 'data-has-metrics': "false", 'data-doc-link': '/help/administration/monitoring/prometheus/index.md', 'data-prometheus-integration': '/root/hello-prometheus/services/prometheus/edit' }
- .top-area
- .row
- .col-sm-6
- %h3.page-title
- Metrics for environment
- .prometheus-state
- .js-getting-started.hidden
- .row
- .col-md-4.col-md-offset-4.state-svg
- %svg
- .row
- .col-md-6.col-md-offset-3
- %h4.text-center.state-title
- Get started with performance monitoring
- .row
- .col-md-6.col-md-offset-3
- .description-text.text-center.state-description
- Stay updated about the performance and health of your environment by configuring Prometheus to monitor your deployments. Learn more about performance monitoring
- .row.state-button-section
- .col-md-4.col-md-offset-4.text-center.state-button
- %a.btn.btn-success
- Configure Prometheus
- .js-loading.hidden
- .row
- .col-md-4.col-md-offset-4.state-svg
- %svg
- .row
- .col-md-6.col-md-offset-3
- %h4.text-center.state-title
- Waiting for performance data
- .row
- .col-md-6.col-md-offset-3
- .description-text.text-center.state-description
- Creating graphs uses the data from the Prometheus server. If this takes a long time, ensure that data is available.
- .row.state-button-section
- .col-md-4.col-md-offset-4.text-center.state-button
- %a.btn.btn-success
- View documentation
- .js-unable-to-connect.hidden
- .row
- .col-md-4.col-md-offset-4.state-svg
- %svg
- .row
- .col-md-6.col-md-offset-3
- %h4.text-center.state-title
- Unable to connect to Prometheus server
- .row
- .col-md-6.col-md-offset-3
- .description-text.text-center.state-description
- Ensure connectivity is available from the GitLab server to the Prometheus server
- .row.state-button-section
- .col-md-4.col-md-offset-4.text-center.state-button
- %a.btn.btn-success
- View documentation
- .prometheus-graphs
- .row
- .col-sm-12
- %svg.prometheus-graph{ 'graph-type' => 'cpu_values' }
- .row
- .col-sm-12
- %svg.prometheus-graph{ 'graph-type' => 'memory_values' }
diff --git a/spec/javascripts/fixtures/mini_dropdown_graph.html.haml b/spec/javascripts/fixtures/mini_dropdown_graph.html.haml
index 29370b974af..b532b48a95b 100644
--- a/spec/javascripts/fixtures/mini_dropdown_graph.html.haml
+++ b/spec/javascripts/fixtures/mini_dropdown_graph.html.haml
@@ -3,7 +3,7 @@
Dropdown
%ul.dropdown-menu.mini-pipeline-graph-dropdown-menu.js-builds-dropdown-container
- .js-builds-dropdown-list.scrollable-menu
+ %li.js-builds-dropdown-list.scrollable-menu
- .js-builds-dropdown-loading.builds-dropdown-loading.hidden
- %span.fa.fa-spinner.fa-spin
+ %li.js-builds-dropdown-loading.hidden
+ %span.fa.fa-spinner
diff --git a/spec/javascripts/issue_spec.js b/spec/javascripts/issue_spec.js
index 9a2570ef7e9..0fd573eae3f 100644
--- a/spec/javascripts/issue_spec.js
+++ b/spec/javascripts/issue_spec.js
@@ -108,8 +108,8 @@ describe('Issue', function() {
expect(this.$triggeredButton).toHaveProp('disabled', true);
expectNewBranchButtonState(true, false);
return this.issueStateDeferred;
- } else if (req.url === Issue.$btnNewBranch.data('path')) {
- expect(req.type).toBe('get');
+ } else if (req.url === Issue.createMrDropdownWrap.dataset.canCreatePath) {
+ expect(req.type).toBe('GET');
expectNewBranchButtonState(true, false);
return this.canCreateBranchDeferred;
}
diff --git a/spec/javascripts/monitoring/deployments_spec.js b/spec/javascripts/monitoring/deployments_spec.js
new file mode 100644
index 00000000000..19bc11d0f24
--- /dev/null
+++ b/spec/javascripts/monitoring/deployments_spec.js
@@ -0,0 +1,133 @@
+import d3 from 'd3';
+import PrometheusGraph from '~/monitoring/prometheus_graph';
+import Deployments from '~/monitoring/deployments';
+import { prometheusMockData } from './prometheus_mock_data';
+
+describe('Metrics deployments', () => {
+ const fixtureName = 'environments/metrics/metrics.html.raw';
+ let deployment;
+ let prometheusGraph;
+
+ const graphElement = () => document.querySelector('.prometheus-graph');
+
+ preloadFixtures(fixtureName);
+
+ beforeEach((done) => {
+ // Setup the view
+ loadFixtures(fixtureName);
+
+ d3.selectAll('.prometheus-graph')
+ .append('g')
+ .attr('class', 'graph-container');
+
+ prometheusGraph = new PrometheusGraph();
+ deployment = new Deployments(1000, 500);
+
+ spyOn(prometheusGraph, 'init');
+ spyOn($, 'ajax').and.callFake(() => {
+ const d = $.Deferred();
+ d.resolve({
+ deployments: [{
+ id: 1,
+ created_at: deployment.chartData[10].time,
+ sha: 'testing',
+ tag: false,
+ ref: {
+ name: 'testing',
+ },
+ }, {
+ id: 2,
+ created_at: deployment.chartData[15].time,
+ sha: '',
+ tag: true,
+ ref: {
+ name: 'tag',
+ },
+ }],
+ });
+
+ setTimeout(done);
+
+ return d.promise();
+ });
+
+ prometheusGraph.configureGraph();
+ prometheusGraph.transformData(prometheusMockData.metrics);
+
+ deployment.init(prometheusGraph.graphSpecificProperties.memory_values.data);
+ });
+
+ it('creates line on graph for deploment', () => {
+ expect(
+ graphElement().querySelectorAll('.deployment-line').length,
+ ).toBe(2);
+ });
+
+ it('creates hidden deploy boxes', () => {
+ expect(
+ graphElement().querySelectorAll('.prometheus-graph .js-deploy-info-box').length,
+ ).toBe(2);
+ });
+
+ it('hides the info boxes by default', () => {
+ expect(
+ graphElement().querySelectorAll('.prometheus-graph .js-deploy-info-box.hidden').length,
+ ).toBe(2);
+ });
+
+ it('shows sha short code when tag is false', () => {
+ expect(
+ graphElement().querySelector('.deploy-info-1-cpu_values .js-deploy-info-box').textContent.trim(),
+ ).toContain('testin');
+ });
+
+ it('shows ref name when tag is true', () => {
+ expect(
+ graphElement().querySelector('.deploy-info-2-cpu_values .js-deploy-info-box').textContent.trim(),
+ ).toContain('tag');
+ });
+
+ it('shows info box when moving mouse over line', () => {
+ deployment.mouseOverDeployInfo(deployment.data[0].xPos, 'cpu_values');
+
+ expect(
+ graphElement().querySelectorAll('.prometheus-graph .js-deploy-info-box.hidden').length,
+ ).toBe(1);
+
+ expect(
+ graphElement().querySelector('.deploy-info-1-cpu_values .js-deploy-info-box.hidden'),
+ ).toBeNull();
+ });
+
+ it('hides previously visible info box when moving mouse away', () => {
+ deployment.mouseOverDeployInfo(500, 'cpu_values');
+
+ expect(
+ graphElement().querySelectorAll('.prometheus-graph .js-deploy-info-box.hidden').length,
+ ).toBe(2);
+
+ expect(
+ graphElement().querySelector('.deploy-info-1-cpu_values .js-deploy-info-box.hidden'),
+ ).not.toBeNull();
+ });
+
+ describe('refText', () => {
+ it('returns shortened SHA', () => {
+ expect(
+ Deployments.refText({
+ tag: false,
+ sha: '123456789',
+ }),
+ ).toBe('123456');
+ });
+
+ it('returns tag name', () => {
+ expect(
+ Deployments.refText({
+ tag: true,
+ ref: 'v1.0',
+ }),
+ ).toBe('v1.0');
+ });
+ });
+});
diff --git a/spec/javascripts/monitoring/prometheus_graph_spec.js b/spec/javascripts/monitoring/prometheus_graph_spec.js
index 4b904fc2960..25578bf1c6e 100644
--- a/spec/javascripts/monitoring/prometheus_graph_spec.js
+++ b/spec/javascripts/monitoring/prometheus_graph_spec.js
@@ -3,7 +3,7 @@ import PrometheusGraph from '~/monitoring/prometheus_graph';
import { prometheusMockData } from './prometheus_mock_data';
describe('PrometheusGraph', () => {
- const fixtureName = 'static/environments/metrics.html.raw';
+ const fixtureName = 'environments/metrics/metrics.html.raw';
const prometheusGraphContainer = '.prometheus-graph';
const prometheusGraphContents = `${prometheusGraphContainer}[graph-type=cpu_values]`;
@@ -77,7 +77,7 @@ describe('PrometheusGraph', () => {
});
describe('PrometheusGraphs UX states', () => {
- const fixtureName = 'static/environments/metrics.html.raw';
+ const fixtureName = 'environments/metrics/metrics.html.raw';
preloadFixtures(fixtureName);
beforeEach(() => {
diff --git a/spec/javascripts/notes_spec.js b/spec/javascripts/notes_spec.js
index ca8ee04d955..cdc5c4510ff 100644
--- a/spec/javascripts/notes_spec.js
+++ b/spec/javascripts/notes_spec.js
@@ -1,10 +1,12 @@
/* eslint-disable space-before-function-paren, no-unused-expressions, no-var, object-shorthand, comma-dangle, max-len */
/* global Notes */
-require('~/notes');
-require('vendor/autosize');
-require('~/gl_form');
-require('~/lib/utils/text_utility');
+import 'vendor/autosize';
+import '~/gl_form';
+import '~/lib/utils/text_utility';
+import '~/render_gfm';
+import '~/render_math';
+import '~/notes';
(function() {
window.gon || (window.gon = {});
@@ -80,35 +82,78 @@ require('~/lib/utils/text_utility');
beforeEach(() => {
note = {
+ id: 1,
discussion_html: null,
valid: true,
- html: '<div></div>',
+ note: 'heya',
+ html: '<div>heya</div>',
};
- $notesList = jasmine.createSpyObj('$notesList', ['find']);
+ $notesList = jasmine.createSpyObj('$notesList', [
+ 'find',
+ 'append',
+ ]);
notes = jasmine.createSpyObj('notes', [
'refresh',
'isNewNote',
+ 'isUpdatedNote',
'collapseLongCommitList',
'updateNotesCount',
+ 'putConflictEditWarningInPlace'
]);
notes.taskList = jasmine.createSpyObj('tasklist', ['init']);
notes.note_ids = [];
+ notes.updatedNotesTrackingMap = {};
- spyOn(window, '$').and.returnValue($notesList);
spyOn(gl.utils, 'localTimeAgo');
- spyOn(Notes, 'animateAppendNote');
- notes.isNewNote.and.returnValue(true);
-
- Notes.prototype.renderNote.call(notes, note);
+ spyOn(Notes, 'animateAppendNote').and.callThrough();
+ spyOn(Notes, 'animateUpdateNote').and.callThrough();
});
- it('should query for the notes list', () => {
- expect(window.$).toHaveBeenCalledWith('ul.main-notes-list');
+ describe('when adding note', () => {
+ it('should call .animateAppendNote', () => {
+ notes.isNewNote.and.returnValue(true);
+ Notes.prototype.renderNote.call(notes, note, null, $notesList);
+
+ expect(Notes.animateAppendNote).toHaveBeenCalledWith(note.html, $notesList);
+ });
});
- it('should call .animateAppendNote', () => {
- expect(Notes.animateAppendNote).toHaveBeenCalledWith(note.html, $notesList);
+ describe('when note was edited', () => {
+ it('should call .animateUpdateNote', () => {
+ notes.isUpdatedNote.and.returnValue(true);
+ const $note = $('<div>');
+ $notesList.find.and.returnValue($note);
+ Notes.prototype.renderNote.call(notes, note, null, $notesList);
+
+ expect(Notes.animateUpdateNote).toHaveBeenCalledWith(note.html, $note);
+ });
+
+ describe('while editing', () => {
+ it('should update textarea if nothing has been touched', () => {
+ notes.isUpdatedNote.and.returnValue(true);
+ const $note = $(`<div class="is-editing">
+ <div class="original-note-content">initial</div>
+ <textarea class="js-note-text">initial</textarea>
+ </div>`);
+ $notesList.find.and.returnValue($note);
+ Notes.prototype.renderNote.call(notes, note, null, $notesList);
+
+ expect($note.find('.js-note-text').val()).toEqual(note.note);
+ });
+
+ it('should call .putConflictEditWarningInPlace', () => {
+ notes.isUpdatedNote.and.returnValue(true);
+ const $note = $(`<div class="is-editing">
+ <div class="original-note-content">initial</div>
+ <textarea class="js-note-text">different</textarea>
+ </div>`);
+ $notesList.find.and.returnValue($note);
+ Notes.prototype.renderNote.call(notes, note, null, $notesList);
+
+ expect(notes.putConflictEditWarningInPlace).toHaveBeenCalledWith(note, $note);
+ });
+ });
});
});
@@ -147,14 +192,12 @@ require('~/lib/utils/text_utility');
});
describe('Discussion root note', () => {
- let $notesList;
let body;
beforeEach(() => {
body = jasmine.createSpyObj('body', ['attr']);
discussionContainer = { length: 0 };
- spyOn(window, '$').and.returnValues(discussionContainer, body, $notesList);
$form.closest.and.returnValues(row, $form);
$form.find.and.returnValues(discussionContainer);
body.attr.and.returnValue('');
@@ -162,12 +205,8 @@ require('~/lib/utils/text_utility');
Notes.prototype.renderDiscussionNote.call(notes, note, $form);
});
- it('should query for the notes list', () => {
- expect(window.$.calls.argsFor(2)).toEqual(['ul.main-notes-list']);
- });
-
it('should call Notes.animateAppendNote', () => {
- expect(Notes.animateAppendNote).toHaveBeenCalledWith(note.discussion_html, $notesList);
+ expect(Notes.animateAppendNote).toHaveBeenCalledWith(note.discussion_html, $('.main-notes-list'));
});
});
@@ -175,16 +214,12 @@ require('~/lib/utils/text_utility');
beforeEach(() => {
discussionContainer = { length: 1 };
- spyOn(window, '$').and.returnValues(discussionContainer);
- $form.closest.and.returnValues(row);
+ $form.closest.and.returnValues(row, $form);
+ $form.find.and.returnValues(discussionContainer);
Notes.prototype.renderDiscussionNote.call(notes, note, $form);
});
- it('should query foor the discussion container', () => {
- expect(window.$).toHaveBeenCalledWith(`.notes[data-discussion-id="${note.discussion_id}"]`);
- });
-
it('should call Notes.animateAppendNote', () => {
expect(Notes.animateAppendNote).toHaveBeenCalledWith(note.html, discussionContainer);
});
@@ -193,35 +228,45 @@ require('~/lib/utils/text_utility');
describe('animateAppendNote', () => {
let noteHTML;
- let $note;
let $notesList;
+ let $resultantNote;
beforeEach(() => {
noteHTML = '<div></div>';
- $note = jasmine.createSpyObj('$note', ['addClass', 'renderGFM', 'removeClass']);
$notesList = jasmine.createSpyObj('$notesList', ['append']);
- spyOn(window, '$').and.returnValue($note);
- spyOn(window, 'setTimeout').and.callThrough();
- $note.addClass.and.returnValue($note);
- $note.renderGFM.and.returnValue($note);
+ $resultantNote = Notes.animateAppendNote(noteHTML, $notesList);
+ });
- Notes.animateAppendNote(noteHTML, $notesList);
+ it('should have `fade-in` class', () => {
+ expect($resultantNote.hasClass('fade-in')).toEqual(true);
});
- it('should init the note jquery object', () => {
- expect(window.$).toHaveBeenCalledWith(noteHTML);
+ it('should append note to the notes list', () => {
+ expect($notesList.append).toHaveBeenCalledWith($resultantNote);
});
+ });
+
+ describe('animateUpdateNote', () => {
+ let noteHTML;
+ let $note;
+ let $updatedNote;
- it('should call addClass', () => {
- expect($note.addClass).toHaveBeenCalledWith('fade-in');
+ beforeEach(() => {
+ noteHTML = '<div></div>';
+ $note = jasmine.createSpyObj('$note', [
+ 'replaceWith'
+ ]);
+
+ $updatedNote = Notes.animateUpdateNote(noteHTML, $note);
});
- it('should call renderGFM', () => {
- expect($note.renderGFM).toHaveBeenCalledWith();
+
+ it('should have `fade-in` class', () => {
+ expect($updatedNote.hasClass('fade-in')).toEqual(true);
});
- it('should append note to the notes list', () => {
- expect($notesList.append).toHaveBeenCalledWith($note);
+ it('should call replaceWith on $note', () => {
+ expect($note.replaceWith).toHaveBeenCalledWith($updatedNote);
});
});
});
diff --git a/spec/javascripts/pipelines/stage_spec.js b/spec/javascripts/pipelines/stage_spec.js
index 2f1154bd999..a4f32a1faed 100644
--- a/spec/javascripts/pipelines/stage_spec.js
+++ b/spec/javascripts/pipelines/stage_spec.js
@@ -1,81 +1,86 @@
import Vue from 'vue';
-import { SUCCESS_SVG } from '~/ci_status_icons';
-import Stage from '~/pipelines/components/stage';
+import stage from '~/pipelines/components/stage.vue';
+
+describe('Pipelines stage component', () => {
+ let StageComponent;
+ let component;
+
+ beforeEach(() => {
+ StageComponent = Vue.extend(stage);
+
+ component = new StageComponent({
+ propsData: {
+ stage: {
+ status: {
+ group: 'success',
+ icon: 'icon_status_success',
+ title: 'success',
+ },
+ dropdown_path: 'foo',
+ },
+ updateDropdown: false,
+ },
+ }).$mount();
+ });
-function minify(string) {
- return string.replace(/\s/g, '');
-}
+ it('should render a dropdown with the status icon', () => {
+ expect(component.$el.getAttribute('class')).toEqual('dropdown');
+ expect(component.$el.querySelector('svg')).toBeDefined();
+ expect(component.$el.querySelector('button').getAttribute('data-toggle')).toEqual('dropdown');
+ });
-describe('Pipelines Stage', () => {
- describe('data', () => {
- let stageReturnValue;
+ describe('with successfull request', () => {
+ const interceptor = (request, next) => {
+ next(request.respondWith(JSON.stringify({ html: 'foo' }), {
+ status: 200,
+ }));
+ };
beforeEach(() => {
- stageReturnValue = Stage.data();
+ Vue.http.interceptors.push(interceptor);
});
- it('should return object with .builds and .spinner', () => {
- expect(stageReturnValue).toEqual({
- builds: '',
- spinner: '<span class="fa fa-spinner fa-spin"></span>',
- });
+ afterEach(() => {
+ Vue.http.interceptors = _.without(
+ Vue.http.interceptors, interceptor,
+ );
});
- });
- describe('computed', () => {
- describe('svgHTML', function () {
- let stage;
- let svgHTML;
+ it('should render the received data', (done) => {
+ component.$el.querySelector('button').click();
- beforeEach(() => {
- stage = { stage: { status: { icon: 'icon_status_success' } } };
-
- svgHTML = Stage.computed.svgHTML.call(stage);
- });
-
- it("should return the correct icon for the stage's status", () => {
- expect(svgHTML).toBe(SUCCESS_SVG);
- });
+ setTimeout(() => {
+ expect(
+ component.$el.querySelector('.js-builds-dropdown-container ul').textContent.trim(),
+ ).toEqual('foo');
+ done();
+ }, 0);
});
});
- describe('when mounted', () => {
- let StageComponent;
- let renderedComponent;
- let stage;
+ describe('when request fails', () => {
+ const interceptor = (request, next) => {
+ next(request.respondWith(JSON.stringify({}), {
+ status: 500,
+ }));
+ };
beforeEach(() => {
- stage = { status: { icon: 'icon_status_success' } };
-
- StageComponent = Vue.extend(Stage);
-
- renderedComponent = new StageComponent({
- propsData: {
- stage,
- },
- }).$mount();
+ Vue.http.interceptors.push(interceptor);
});
- it('should render the correct status svg', () => {
- const minifiedComponent = minify(renderedComponent.$el.outerHTML);
- const expectedSVG = minify(SUCCESS_SVG);
-
- expect(minifiedComponent).toContain(expectedSVG);
+ afterEach(() => {
+ Vue.http.interceptors = _.without(
+ Vue.http.interceptors, interceptor,
+ );
});
- });
-
- describe('when request fails', () => {
- it('closes dropdown', () => {
- spyOn($, 'ajax').and.callFake(options => options.error());
- const StageComponent = Vue.extend(Stage);
- const component = new StageComponent({
- propsData: { stage: { status: { icon: 'foo' } } },
- }).$mount();
+ it('should close the dropdown', () => {
+ component.$el.click();
- expect(
- component.$el.classList.contains('open'),
- ).toEqual(false);
+ setTimeout(() => {
+ expect(component.$el.classList.contains('open')).toEqual(false);
+ }, 0);
});
});
});
View Lorry Controller Status