diff --git a/__tests__/pages/Organizations/views/Organization.add.test.jsx b/__tests__/pages/Organizations/views/Organization.add.test.jsx
index 434621985d..8c25eb1eef 100644
--- a/__tests__/pages/Organizations/views/Organization.add.test.jsx
+++ b/__tests__/pages/Organizations/views/Organization.add.test.jsx
@@ -1,39 +1,60 @@
import React from 'react';
import { mount } from 'enzyme';
import OrganizationAdd from '../../../../src/pages/Organizations/views/Organization.add';
+import { MemoryRouter } from 'react-router-dom';
describe('', () => {
test('initially renders succesfully', () => {
mount(
-
+
+
+
);
});
test('calls "handleChange" when input values change', () => {
- const spy = jest.spyOn(OrganizationAdd.prototype, 'handleChange');
+ const spy = jest.spyOn(OrganizationAdd.WrappedComponent.prototype, 'handleChange');
const wrapper = mount(
-
+
+
+
);
expect(spy).not.toHaveBeenCalled();
- wrapper.find('input#add-org-form-name').simulate('change', {target: {value: 'foo'}});
- wrapper.find('input#add-org-form-description').simulate('change', {target: {value: 'bar'}});
+ wrapper.find('input#add-org-form-name').simulate('change', { target: { value: 'foo' } });
+ wrapper.find('input#add-org-form-description').simulate('change', { target: { value: 'bar' } });
expect(spy).toHaveBeenCalledTimes(2);
});
test('calls "onSubmit" when Save button is clicked', () => {
- const spy = jest.spyOn(OrganizationAdd.prototype, 'onSubmit');
+ const spy = jest.spyOn(OrganizationAdd.WrappedComponent.prototype, 'onSubmit');
const wrapper = mount(
-
+
+
+
);
expect(spy).not.toHaveBeenCalled();
wrapper.find('button.at-C-SubmitButton').prop('onClick')();
expect(spy).toBeCalled();
});
+ test('calls "onCancel" when Cancel button is clicked', () => {
+ const spy = jest.spyOn(OrganizationAdd.WrappedComponent.prototype, 'onCancel');
+ const wrapper = mount(
+
+
+
+ );
+ expect(spy).not.toHaveBeenCalled();
+ wrapper.find('button.at-C-CancelButton').prop('onClick')();
+ expect(spy).toBeCalled();
+ });
});
diff --git a/src/pages/Organizations/views/Organization.add.jsx b/src/pages/Organizations/views/Organization.add.jsx
index dea2e0973e..023817fe1d 100644
--- a/src/pages/Organizations/views/Organization.add.jsx
+++ b/src/pages/Organizations/views/Organization.add.jsx
@@ -1,4 +1,5 @@
import React, { Fragment } from 'react';
+import { withRouter } from 'react-router-dom';
import { Trans } from '@lingui/macro';
import {
PageSection,
@@ -29,6 +30,7 @@ class OrganizationAdd extends React.Component {
this.onSelectChange = this.onSelectChange.bind(this);
this.onSubmit = this.onSubmit.bind(this);
this.resetForm = this.resetForm.bind(this);
+ this.onCancel = this.onCancel.bind(this);
}
state = {
@@ -38,6 +40,7 @@ class OrganizationAdd extends React.Component {
custom_virtualenv: '',
custom_virtualenvs: [],
hideAnsibleSelect: true,
+ error:'',
};
onSelectChange(value, _) {
@@ -62,13 +65,22 @@ class OrganizationAdd extends React.Component {
this.resetForm();
}
+ onCancel() {
+ this.props.history.push('/organizations');
+ }
+
async componentDidMount() {
- const { data } = await api.get(API_CONFIG);
- this.setState({ custom_virtualenvs: [...data.custom_virtualenvs] });
- if (this.state.custom_virtualenvs.length > 1) {
- // Show dropdown if we have more than one ansible environment
- this.setState({ hideAnsibleSelect: !this.state.hideAnsibleSelect });
+ try {
+ const { data } = await api.get(API_CONFIG);
+ this.setState({ custom_virtualenvs: [...data.custom_virtualenvs] });
+ if (this.state.custom_virtualenvs.length > 1) {
+ // Show dropdown if we have more than one ansible environment
+ this.setState({ hideAnsibleSelect: !this.state.hideAnsibleSelect });
+ }
+ } catch (error) {
+ this.setState({ error })
}
+
}
render() {
const { name } = this.state;
@@ -130,7 +142,7 @@ class OrganizationAdd extends React.Component {
-
+
@@ -143,4 +155,4 @@ class OrganizationAdd extends React.Component {
}
}
-export default OrganizationAdd;
+export default withRouter(OrganizationAdd);