External-Mirrors/awx
2
0
Fork 0
mirror of https://github.com/ansible/awx.git synced 2026-01-14 19:30:39 -03:30
Code Issues Packages Projects Releases Wiki Activity

rename onX methods to handleX

Browse Source
This commit is contained in:
Keith Grant 2019-03-25 15:40:20 -04:00
parent f3a6da20f6
commit 02cd188c2f
4 changed files with 84 additions and 81 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
__tests__/pages/Organizations/screens/Organization/OrganizationEdit.test.jsx
View File

@ -75,7 +75,7 @@ describe('<OrganizationEdit />', () => {
expect(wrapper.state().form.instanceGroups.value).toEqual(mockInstanceGroups);
});
test('onLookupSave successfully sets instanceGroups state', () => {
test('changing instance group successfully sets instanceGroups state', () => {
const wrapper = mount(
<MemoryRouter>
<I18nProvider>
@ -88,7 +88,10 @@ describe('<OrganizationEdit />', () => {
</MemoryRouter>
).find('OrganizationEdit');
wrapper.instance().onLookupSave([
const lookup = wrapper.find('InstanceGroupsLookup');
expect(lookup.length).toBe(1);
lookup.prop('onChange')([
{
id: 1,
name: 'foo'
@ -102,9 +105,8 @@ describe('<OrganizationEdit />', () => {
]);
});
test('calls "onFieldChange" when input values change', () => {
// const api = new APIClient();
const spy = jest.spyOn(OrganizationEdit.WrappedComponent.prototype, 'onFieldChange');
test('calls "handleFieldChange" when input values change', () => {
const spy = jest.spyOn(OrganizationEdit.WrappedComponent.prototype, 'handleFieldChange');
const wrapper = mount(
<MemoryRouter>
<I18nProvider>
@ -118,8 +120,8 @@ describe('<OrganizationEdit />', () => {
).find('OrganizationEdit');
expect(spy).not.toHaveBeenCalled();
wrapper.instance().onFieldChange('foo', { target: { name: 'name' } });
wrapper.instance().onFieldChange('bar', { target: { name: 'description' } });
wrapper.instance().handleFieldChange('foo', { target: { name: 'name' } });
wrapper.instance().handleFieldChange('bar', { target: { name: 'description' } });
expect(spy).toHaveBeenCalledTimes(2);
});
@ -148,8 +150,8 @@ describe('<OrganizationEdit />', () => {
expect(wrapper.find('FormSelectOption')).toHaveLength(2);
});
test('calls onSubmit when Save button is clicked', () => {
const spy = jest.spyOn(OrganizationEdit.WrappedComponent.prototype, 'onSubmit');
test('calls handleSubmit when Save button is clicked', () => {
const spy = jest.spyOn(OrganizationEdit.WrappedComponent.prototype, 'handleSubmit');
const wrapper = mount(
<MemoryRouter>
<I18nProvider>
@ -170,7 +172,7 @@ describe('<OrganizationEdit />', () => {
expect(spy).toBeCalled();
});
test('onSubmit associates and disassociates instance groups', async () => {
test('handleSubmit associates and disassociates instance groups', async () => {
const mockInstanceGroups = [
{ name: 'One', id: 1 },
{ name: 'Two', id: 2 }
@ -204,12 +206,12 @@ describe('<OrganizationEdit />', () => {
await wrapper.instance().componentDidMount();
wrapper.instance().onLookupSave([
wrapper.find('InstanceGroupsLookup').prop('onChange')([
{ name: 'One', id: 1 },
{ name: 'Three', id: 3 }
], 'instanceGroups');
await wrapper.instance().onSubmit();
await wrapper.instance().handleSubmit();
expect(api.updateOrganizationDetails).toHaveBeenCalledWith(1, mockDataForm);
expect(api.associateInstanceGroup).toHaveBeenCalledWith('/api/v2/organizations/1/instance_groups', 3);
expect(api.associateInstanceGroup).not.toHaveBeenCalledWith('/api/v2/organizations/1/instance_groups', 1);
@ -220,8 +222,8 @@ describe('<OrganizationEdit />', () => {
expect(api.disassociate).not.toHaveBeenCalledWith('/api/v2/organizations/1/instance_groups', 3);
});
test('calls "onCancel" when Cancel button is clicked', () => {
const spy = jest.spyOn(OrganizationEdit.WrappedComponent.prototype, 'onCancel');
test('calls "handleCancel" when Cancel button is clicked', () => {
const spy = jest.spyOn(OrganizationEdit.WrappedComponent.prototype, 'handleCancel');
const wrapper = mount(
<MemoryRouter>
<I18nProvider>

31
__tests__/pages/Organizations/screens/OrganizationAdd.test.jsx
View File

@ -28,8 +28,8 @@ describe('<OrganizationAdd />', () => {
);
});
test('calls "onFieldChange" when input values change', () => {
const spy = jest.spyOn(OrganizationAdd.WrappedComponent.prototype, 'onFieldChange');
test('calls "handleFieldChange" when input values change', () => {
const spy = jest.spyOn(OrganizationAdd.WrappedComponent.prototype, 'handleFieldChange');
const wrapper = mount(
<MemoryRouter>
<I18nProvider>
@ -47,8 +47,8 @@ describe('<OrganizationAdd />', () => {
expect(spy).toHaveBeenCalledTimes(2);
});
test('calls "onSubmit" when Save button is clicked', () => {
const spy = jest.spyOn(OrganizationAdd.WrappedComponent.prototype, 'onSubmit');
test('calls "handleSubmit" when Save button is clicked', () => {
const spy = jest.spyOn(OrganizationAdd.WrappedComponent.prototype, 'handleSubmit');
const wrapper = mount(
<MemoryRouter>
<I18nProvider>
@ -65,8 +65,8 @@ describe('<OrganizationAdd />', () => {
expect(spy).toBeCalled();
});
test('calls "onCancel" when Cancel button is clicked', () => {
const spy = jest.spyOn(OrganizationAdd.WrappedComponent.prototype, 'onCancel');
test('calls "handleCancel" when Cancel button is clicked', () => {
const spy = jest.spyOn(OrganizationAdd.WrappedComponent.prototype, 'handleCancel');
const wrapper = mount(
<MemoryRouter>
<I18nProvider>
@ -83,7 +83,7 @@ describe('<OrganizationAdd />', () => {
expect(spy).toBeCalled();
});
test('calls "onCancel" when close button (x) is clicked', () => {
test('calls "handleCancel" when close button (x) is clicked', () => {
const wrapper = mount(
<MemoryRouter initialEntries={['/organizations/add']} initialIndex={0}>
<I18nProvider>
@ -104,7 +104,7 @@ describe('<OrganizationAdd />', () => {
});
test('Successful form submission triggers redirect', (done) => {
const onSuccess = jest.spyOn(OrganizationAdd.WrappedComponent.prototype, 'onSuccess');
const handleSuccess = jest.spyOn(OrganizationAdd.WrappedComponent.prototype, 'handleSuccess');
const mockedResp = { data: { id: 1, related: { instance_groups: '/bar' } } };
api.createOrganization = jest.fn().mockResolvedValue(mockedResp); api.associateInstanceGroup = jest.fn().mockResolvedValue('done');
const wrapper = mount(
@ -117,12 +117,12 @@ describe('<OrganizationAdd />', () => {
wrapper.find('input#add-org-form-name').simulate('change', { target: { value: 'foo' } });
wrapper.find('button[aria-label="Save"]').prop('onClick')();
setImmediate(() => {
expect(onSuccess).toHaveBeenCalled();
expect(handleSuccess).toHaveBeenCalled();
done();
});
});
test('onLookupSave successfully sets instanceGroups state', () => {
test('changing instance groups successfully sets instanceGroups state', () => {
const wrapper = mount(
<MemoryRouter>
<I18nProvider>
@ -130,7 +130,8 @@ describe('<OrganizationAdd />', () => {
</I18nProvider>
</MemoryRouter>
).find('OrganizationAdd');
wrapper.instance().onLookupSave([
wrapper.find('InstanceGroupsLookup').prop('onChange')([
{
id: 1,
name: 'foo'
@ -144,7 +145,7 @@ describe('<OrganizationAdd />', () => {
]);
});
test('onFieldChange successfully sets custom_virtualenv state', () => {
test('handleFieldChange successfully sets custom_virtualenv state', () => {
const wrapper = mount(
<MemoryRouter>
<I18nProvider>
@ -152,11 +153,11 @@ describe('<OrganizationAdd />', () => {
</I18nProvider>
</MemoryRouter>
).find('OrganizationAdd');
wrapper.instance().onFieldChange('fooBar', { target: { name: 'custom_virtualenv' } });
wrapper.instance().handleFieldChange('fooBar', { target: { name: 'custom_virtualenv' } });
expect(wrapper.state('custom_virtualenv')).toBe('fooBar');
});
test('onSubmit posts instance groups from selectedInstanceGroups', async () => {
test('handleSubmit posts instance groups from selectedInstanceGroups', async () => {
api.createOrganization = jest.fn().mockResolvedValue({
data: {
id: 1,
@ -181,7 +182,7 @@ describe('<OrganizationAdd />', () => {
name: 'foo'
}]
});
await wrapper.instance().onSubmit();
await wrapper.instance().handleSubmit();
expect(api.createOrganization).toHaveBeenCalledWith({
custom_virtualenv: '',
description: '',

68
src/pages/Organizations/screens/Organization/OrganizationEdit.jsx
View File

@ -21,12 +21,12 @@ class OrganizationEdit extends Component {
this.getRelatedInstanceGroups = this.getRelatedInstanceGroups.bind(this);
this.checkValidity = this.checkValidity.bind(this);
this.onFieldChange = this.onFieldChange.bind(this);
this.onLookupSave = this.onLookupSave.bind(this);
this.onSubmit = this.onSubmit.bind(this);
this.handleFieldChange = this.handleFieldChange.bind(this);
this.handleInstanceGroupsChange = this.handleInstanceGroupsChange.bind(this);
this.handleSubmit = this.handleSubmit.bind(this);
this.postInstanceGroups = this.postInstanceGroups.bind(this);
this.onCancel = this.onCancel.bind(this);
this.onSuccess = this.onSuccess.bind(this);
this.handleCancel = this.handleCancel.bind(this);
this.handleSuccess = this.handleSuccess.bind(this);
this.state = {
form: {
@ -73,7 +73,24 @@ class OrganizationEdit extends Component {
this.setState({ form: formData });
}
onFieldChange (val, evt) {
async getRelatedInstanceGroups () {
const {
api,
organization: { id }
} = this.props;
const { data } = await api.getOrganizationInstanceGroups(id);
const { results } = data;
return results;
}
checkValidity = (value, validation) => {
const isValid = (validation.required)
? (value.trim() !== '') : true;
return isValid;
}
handleFieldChange (val, evt) {
const targetName = evt.target.name;
const value = val;
@ -91,14 +108,14 @@ class OrganizationEdit extends Component {
this.setState({ form: updatedForm, formIsValid });
}
onLookupSave (val, targetName) {
handleInstanceGroupsChange (val, targetName) {
const { form: updatedForm } = this.state;
updatedForm[targetName].value = val;
this.setState({ form: updatedForm });
}
async onSubmit () {
async handleSubmit () {
const { api, organization } = this.props;
const { form: { name, description, custom_virtualenv } } = this.state;
const formData = { name, description, custom_virtualenv };
@ -115,37 +132,20 @@ class OrganizationEdit extends Component {
} catch (err) {
this.setState({ error: err });
} finally {
this.onSuccess();
this.handleSuccess();
}
}
onCancel () {
handleCancel () {
const { organization: { id }, history } = this.props;
history.push(`/organizations/${id}`);
}
onSuccess () {
handleSuccess () {
const { organization: { id }, history } = this.props;
history.push(`/organizations/${id}`);
}
async getRelatedInstanceGroups () {
const {
api,
organization: { id }
} = this.props;
const { data } = await api.getOrganizationInstanceGroups(id);
const { results } = data;
return results;
}
checkValidity = (value, validation) => {
const isValid = (validation.required)
? (value.trim() !== '') : true;
return isValid;
}
async postInstanceGroups () {
const { api, organization } = this.props;
const { form: { instanceGroups } } = this.state;
@ -202,7 +202,7 @@ class OrganizationEdit extends Component {
isRequired
isValid={name.isValid}
name="name"
onChange={this.onFieldChange}
onChange={this.handleFieldChange}
value={name.value || ''}
/>
</FormGroup>
@ -213,7 +213,7 @@ class OrganizationEdit extends Component {
<TextInput
id="edit-org-form-description"
name="description"
onChange={this.onFieldChange}
onChange={this.handleFieldChange}
value={description.value || ''}
/>
</FormGroup>
@ -229,7 +229,7 @@ class OrganizationEdit extends Component {
defaultSelected={custom_virtualenv.defaultEnv}
label={i18n._(t`Ansible Environment`)}
name="custom_virtualenv"
onChange={this.onFieldChange}
onChange={this.handleFieldChange}
value={custom_virtualenv.value || ''}
/>
</FormGroup>
@ -240,11 +240,11 @@ class OrganizationEdit extends Component {
<InstanceGroupsLookup
api={api}
value={instanceGroups.value}
onChange={this.onLookupSave}
onChange={this.handleInstanceGroupsChange}
/>
<FormActionGroup
onCancel={this.onCancel}
onSubmit={this.onSubmit}
onCancel={this.handleCancel}
onSubmit={this.handleSubmit}
submitDisabled={!formIsValid}
/>
{ error ? <div>error</div> : '' }

36
src/pages/Organizations/screens/OrganizationAdd.jsx
View File

@ -26,11 +26,11 @@ class OrganizationAdd extends React.Component {
constructor (props) {
super(props);
this.onFieldChange = this.onFieldChange.bind(this);
this.onLookupSave = this.onLookupSave.bind(this);
this.onSubmit = this.onSubmit.bind(this);
this.onCancel = this.onCancel.bind(this);
this.onSuccess = this.onSuccess.bind(this);
this.handleFieldChange = this.handleFieldChange.bind(this);
this.handleInstanceGroupsChange = this.handleInstanceGroupsChange.bind(this);
this.handleSubmit = this.handleSubmit.bind(this);
this.handleCancel = this.handleCancel.bind(this);
this.handleSuccess = this.handleSuccess.bind(this);
this.state = {
name: '',
@ -42,15 +42,15 @@ class OrganizationAdd extends React.Component {
};
}
onFieldChange (val, evt) {
handleFieldChange (val, evt) {
this.setState({ [evt.target.name]: val || evt.target.value });
}
onLookupSave (val, targetName) {
handleInstanceGroupsChange (val, targetName) {
this.setState({ [targetName]: val });
}
async onSubmit () {
async handleSubmit () {
const { api } = this.props;
const { name, description, custom_virtualenv, instanceGroups } = this.state;
const data = {
@ -70,19 +70,19 @@ class OrganizationAdd extends React.Component {
} catch (err) {
this.setState({ error: err });
} finally {
this.onSuccess(response.id);
this.handleSuccess(response.id);
}
} catch (err) {
this.setState({ error: err });
}
}
onCancel () {
handleCancel () {
const { history } = this.props;
history.push('/organizations');
}
onSuccess (id) {
handleSuccess (id) {
const { history } = this.props;
history.push(`/organizations/${id}`);
}
@ -112,7 +112,7 @@ class OrganizationAdd extends React.Component {
<Button
variant="plain"
aria-label={i18n._(t`Close`)}
onClick={this.onCancel}
onClick={this.handleCancel}
>
<TimesIcon />
</Button>
@ -131,7 +131,7 @@ class OrganizationAdd extends React.Component {
id="add-org-form-name"
name="name"
value={name}
onChange={this.onFieldChange}
onChange={this.handleFieldChange}
/>
</FormGroup>
<FormGroup label={i18n._(t`Description`)} fieldId="add-org-form-description">
@ -139,13 +139,13 @@ class OrganizationAdd extends React.Component {
id="add-org-form-description"
name="description"
value={description}
onChange={this.onFieldChange}
onChange={this.handleFieldChange}
/>
</FormGroup>
<InstanceGroupsLookup
api={api}
value={instanceGroups}
onChange={this.onLookupSave}
onChange={this.handleInstanceGroupsChange}
/>
<ConfigContext.Consumer>
{({ custom_virtualenvs }) => (
@ -169,7 +169,7 @@ class OrganizationAdd extends React.Component {
label={i18n._(t`Ansible Environment`)}
name="custom_virtualenv"
value={custom_virtualenv}
onChange={this.onFieldChange}
onChange={this.handleFieldChange}
data={custom_virtualenvs}
defaultSelected={defaultEnv}
/>
@ -179,9 +179,9 @@ class OrganizationAdd extends React.Component {
</ConfigContext.Consumer>
</Gallery>
<FormActionGroup
onSubmit={this.onSubmit}
onSubmit={this.handleSubmit}
submitDisabled={!enabled}
onCancel={this.onCancel}
onCancel={this.handleCancel}
/>
{error ? <div>error</div> : ''}
</Form>