foreman_remote_execution 4.5.1 → 4.7.0

data/webpack/JobWizard/steps/AdvancedFields/DescriptionField.js

@@ -0,0 +1,67 @@
+import React, { useState } from 'react';
+import PropTypes from 'prop-types';
+import { FormGroup, TextInput, Button } from '@patternfly/react-core';
+import { translate as __ } from 'foremanReact/common/I18n';
+
+export const DescriptionField = ({ inputs, value, setValue }) => {
+  const generateDesc = () => {
+    let newDesc = value;
+    if (value) {
+      const re = new RegExp('%\\{([^\\}]+)\\}', 'gm');
+      const results = [...newDesc.matchAll(re)].map(result => ({
+        name: result[1],
+        text: result[0],
+      }));
+      results.forEach(result => {
+        newDesc = newDesc.replace(
+          result.text,
+          // TODO: Replace with the value of the input from Target Hosts step
+          inputs.find(input => input.name === result.name)?.name || result.text
+        );
+      });
+    }
+    return newDesc;
+  };
+  const [generatedDesc, setGeneratedDesc] = useState(generateDesc());
+  const [isPreview, setIsPreview] = useState(true);
+
+  const togglePreview = () => {
+    setGeneratedDesc(generateDesc());
+    setIsPreview(v => !v);
+  };
+
+  return (
+    <FormGroup
+      label={__('Description')}
+      fieldId="description"
+      helperText={
+        <Button variant="link" isInline onClick={togglePreview}>
+          {isPreview
+            ? __('Edit job description template')
+            : __('Preview job description')}
+        </Button>
+      }
+    >
+      {isPreview ? (
+        <TextInput id="description-preview" value={generatedDesc} isDisabled />
+      ) : (
+        <TextInput
+          type="text"
+          autoComplete="description"
+          id="description"
+          value={value}
+          onChange={newValue => setValue(newValue)}
+        />
+      )}
+    </FormGroup>
+  );
+};
+
+DescriptionField.propTypes = {
+  inputs: PropTypes.array.isRequired,
+  value: PropTypes.string,
+  setValue: PropTypes.func.isRequired,
+};
+DescriptionField.defaultProps = {
+  value: '',
+};

data/webpack/JobWizard/steps/AdvancedFields/Fields.js

@@ -3,6 +3,8 @@ import PropTypes from 'prop-types';
 import { FormGroup, TextInput } from '@patternfly/react-core';
 import { translate as __ } from 'foremanReact/common/I18n';
 import { helpLabel } from '../form/FormHelpers';
+import { formatter } from '../form/Formatter';
+import { NumberInput } from '../form/NumberInput';
 
 export const EffectiveUserField = ({ value, setValue }) => (
   <FormGroup
@@ -26,25 +28,25 @@ export const EffectiveUserField = ({ value, setValue }) => (
 );
 
 export const TimeoutToKillField = ({ value, setValue }) => (
-  <FormGroup
-    label={__('Timeout to kill')}
-    labelIcon={helpLabel(
-      __(
-        'Time in seconds from the start on the remote host after which the job should be killed.'
+  <NumberInput
+    formProps={{
+      label: __('Timeout to kill'),
+      labelIcon: helpLabel(
+        __(
+          'Time in seconds from the start on the remote host after which the job should be killed.'
+        ),
+        'timeout-to-kill'
       ),
-      'timeout-to-kill'
-    )}
-    fieldId="timeout-to-kill"
-  >
-    <TextInput
-      type="number"
-      value={value}
-      placeholder={__('For example: 1, 2, 3, 4, 5...')}
-      autoComplete="timeout-to-kill"
-      id="timeout-to-kill"
-      onChange={newValue => setValue(newValue)}
-    />
-  </FormGroup>
+      fieldId: 'timeout-to-kill',
+    }}
+    inputProps={{
+      value,
+      placeholder: __('For example: 1, 2, 3, 4, 5...'),
+      autoComplete: 'timeout-to-kill',
+      id: 'timeout-to-kill',
+      onChange: newValue => setValue(newValue),
+    }}
+  />
 );
 
 export const PasswordField = ({ value, setValue }) => (
@@ -56,11 +58,11 @@ export const PasswordField = ({ value, setValue }) => (
       ),
       'password'
     )}
-    fieldId="password"
+    fieldId="job-password"
   >
     <TextInput
-      autoComplete="password"
-      id="password"
+      autoComplete="new-password" // to prevent firefox from autofilling the user password
+      id="job-password"
       type="password"
       placeholder="*****"
       value={value}
@@ -114,51 +116,54 @@ export const EffectiveUserPasswordField = ({ value, setValue }) => (
 );
 
 export const ConcurrencyLevelField = ({ value, setValue }) => (
-  <FormGroup
-    label={__('Concurrency level')}
-    labelIcon={helpLabel(
-      __(
-        'Run at most N tasks at a time. If this is set and proxy batch triggering is enabled, then tasks are triggered on the smart proxy in batches of size 1.'
+  <NumberInput
+    formProps={{
+      label: __('Concurrency level'),
+      labelIcon: helpLabel(
+        __(
+          'Run at most N tasks at a time. If this is set and proxy batch triggering is enabled, then tasks are triggered on the smart proxy in batches of size 1.'
+        ),
+        'concurrency-level'
       ),
-      'concurrency-level'
-    )}
-    fieldId="concurrency-level"
-  >
-    <TextInput
-      min={1}
-      type="number"
-      autoComplete="concurrency-level"
-      id="concurrency-level"
-      placeholder={__('For example: 1, 2, 3, 4, 5...')}
-      value={value}
-      onChange={newValue => setValue(newValue)}
-    />
-  </FormGroup>
+      fieldId: 'concurrency-level',
+    }}
+    inputProps={{
+      min: 1,
+      autoComplete: 'concurrency-level',
+      id: 'concurrency-level',
+      placeholder: __('For example: 1, 2, 3, 4, 5...'),
+      value,
+      onChange: newValue => setValue(newValue),
+    }}
+  />
 );
 
 export const TimeSpanLevelField = ({ value, setValue }) => (
-  <FormGroup
-    label={__('Time span')}
-    labelIcon={helpLabel(
-      __(
-        'Distribute execution over N seconds. If this is set and proxy batch triggering is enabled, then tasks are triggered on the smart proxy in batches of size 1.'
+  <NumberInput
+    formProps={{
+      label: __('Time span'),
+      labelIcon: helpLabel(
+        __(
+          'Distribute execution over N seconds. If this is set and proxy batch triggering is enabled, then tasks are triggered on the smart proxy in batches of size 1.'
+        ),
+        'time-span'
       ),
-      'time-span'
-    )}
-    fieldId="time-span"
-  >
-    <TextInput
-      min={1}
-      type="number"
-      autoComplete="time-span"
-      id="time-span"
-      placeholder={__('For example: 1, 2, 3, 4, 5...')}
-      value={value}
-      onChange={newValue => setValue(newValue)}
-    />
-  </FormGroup>
+      fieldId: 'time-span',
+    }}
+    inputProps={{
+      min: 1,
+      autoComplete: 'time-span',
+      id: 'time-span',
+      placeholder: __('For example: 1, 2, 3, 4, 5...'),
+      value,
+      onChange: newValue => setValue(newValue),
+    }}
+  />
 );
 
+export const TemplateInputsFields = ({ inputs, value, setValue }) => (
+  <>{inputs?.map(input => formatter(input, value, setValue))}</>
+);
 EffectiveUserField.propTypes = {
   value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
   setValue: PropTypes.func.isRequired,
@@ -179,3 +184,12 @@ ConcurrencyLevelField.propTypes = EffectiveUserField.propTypes;
 ConcurrencyLevelField.defaultProps = EffectiveUserField.defaultProps;
 TimeSpanLevelField.propTypes = EffectiveUserField.propTypes;
 TimeSpanLevelField.defaultProps = EffectiveUserField.defaultProps;
+TemplateInputsFields.propTypes = {
+  inputs: PropTypes.array.isRequired,
+  value: PropTypes.object,
+  setValue: PropTypes.func.isRequired,
+};
+
+TemplateInputsFields.defaultProps = {
+  value: {},
+};

data/webpack/JobWizard/steps/AdvancedFields/__tests__/AdvancedFields.test.js

@@ -1,25 +1,144 @@
 import React from 'react';
 import { Provider } from 'react-redux';
-import configureMockStore from 'redux-mock-store';
-import * as patternfly from '@patternfly/react-core';
 import { mount } from '@theforeman/test';
-import { AdvancedFields } from '../AdvancedFields';
-
-jest.spyOn(patternfly, 'FormGroup');
-patternfly.FormGroup.mockImplementation(props => (
-  <div>{props.navAriaLabel}</div>
-));
-const mockStore = configureMockStore([]);
-const store = mockStore({
-  JOB_TEMPLATE: { response: { effective_user: { overridable: true } } },
-});
+import { fireEvent, screen, render, act } from '@testing-library/react';
+import * as api from 'foremanReact/redux/API';
+import { JobWizard } from '../../../JobWizard';
+import * as selectors from '../../../JobWizardSelectors';
+import {
+  jobTemplateResponse as jobTemplate,
+  testSetup,
+  mockApi,
+} from '../../../__tests__/fixtures';
+
+const store = testSetup(selectors, api);
+mockApi(api);
+
+jest.spyOn(selectors, 'selectEffectiveUser');
+jest.spyOn(selectors, 'selectTemplateInputs');
+jest.spyOn(selectors, 'selectAdvancedTemplateInputs');
+
+selectors.selectEffectiveUser.mockImplementation(
+  () => jobTemplate.effective_user
+);
+selectors.selectTemplateInputs.mockImplementation(
+  () => jobTemplate.template_inputs
+);
+
+selectors.selectAdvancedTemplateInputs.mockImplementation(
+  () => jobTemplate.advanced_template_inputs
+);
 describe('AdvancedFields', () => {
-  it('rendring', () => {
-    const component = mount(
+  it('should save data between steps for advanced fields', async () => {
+    const wrapper = mount(
       <Provider store={store}>
-        <AdvancedFields advancedValues={{}} setAdvancedValues={jest.fn()} />
+        <JobWizard advancedValues={{}} setAdvancedValues={jest.fn()} />
       </Provider>
     );
-    expect(component).toMatchSnapshot();
+    // setup
+    wrapper.find('.pf-c-button.pf-c-select__toggle-button').simulate('click');
+    wrapper
+      .find('.pf-c-select__menu-item')
+      .first()
+      .simulate('click');
+
+    // test
+    expect(wrapper.find('.pf-c-wizard__nav-link.pf-m-disabled')).toHaveLength(
+      0
+    );
+    wrapper
+      .find('.pf-c-wizard__nav-link')
+      .at(2)
+      .simulate('click'); // Advanced step
+    const effectiveUserInput = () => wrapper.find('input#effective-user');
+    const advancedTemplateInput = () =>
+      wrapper.find('.pf-c-form__group-control textarea');
+    const effectiveUesrValue = 'effective user new value';
+    const advancedTemplateInputValue = 'advanced input new value';
+    effectiveUserInput().getDOMNode().value = effectiveUesrValue;
+
+    effectiveUserInput().simulate('change');
+    wrapper.update();
+    advancedTemplateInput().getDOMNode().value = advancedTemplateInputValue;
+    advancedTemplateInput().simulate('change');
+    expect(effectiveUserInput().prop('value')).toEqual(effectiveUesrValue);
+    expect(advancedTemplateInput().prop('value')).toEqual(
+      advancedTemplateInputValue
+    );
+
+    wrapper
+      .find('.pf-c-wizard__nav-link')
+      .at(1)
+      .simulate('click');
+
+    expect(wrapper.find('.pf-c-wizard__nav-link.pf-m-current').text()).toEqual(
+      'Target Hosts'
+    );
+    wrapper
+      .find('.pf-c-wizard__nav-link')
+      .at(2)
+      .simulate('click'); // Advanced step
+
+    expect(effectiveUserInput().prop('value')).toEqual(effectiveUesrValue);
+    expect(advancedTemplateInput().prop('value')).toEqual(
+      advancedTemplateInputValue
+    );
+  });
+  it('fill template fields', async () => {
+    render(
+      <Provider store={store}>
+        <JobWizard />
+      </Provider>
+    );
+    await act(async () => {
+      fireEvent.click(screen.getByText('Advanced Fields'));
+    });
+    const searchValue = 'search test';
+    const textValue = 'I am a text';
+    const dateValue = '08/07/2021';
+    const textField = screen.getByLabelText('adv plain hidden', {
+      selector: 'textarea',
+    });
+    const selectField = screen.getByText('option 1');
+    const searchField = screen.getByPlaceholderText('Filter...');
+    const dateField = screen.getByLabelText('adv date', {
+      selector: 'input',
+    });
+
+    fireEvent.click(selectField);
+    await act(async () => {
+      await fireEvent.click(screen.getByText('option 2'));
+      fireEvent.click(screen.getAllByText('Advanced Fields')[0]); // to remove focus
+      await fireEvent.change(textField, {
+        target: { value: textValue },
+      });
+
+      await fireEvent.change(searchField, {
+        target: { value: searchValue },
+      });
+      await fireEvent.change(dateField, {
+        target: { value: dateValue },
+      });
+    });
+    expect(
+      screen.getByLabelText('adv plain hidden', {
+        selector: 'textarea',
+      }).value
+    ).toBe(textValue);
+    expect(searchField.value).toBe(searchValue);
+    expect(dateField.value).toBe(dateValue);
+    await act(async () => {
+      fireEvent.click(screen.getByText('Category and Template'));
+    });
+    expect(screen.getAllByText('Category and Template')).toHaveLength(3);
+
+    await act(async () => {
+      fireEvent.click(screen.getByText('Advanced Fields'));
+    });
+    expect(textField.value).toBe(textValue);
+    expect(searchField.value).toBe(searchValue);
+    expect(dateField.value).toBe(dateValue);
+    expect(screen.queryAllByText('option 1')).toHaveLength(0);
+    expect(screen.queryAllByText('option 2')).toHaveLength(1);
   });
 });

data/webpack/JobWizard/steps/AdvancedFields/__tests__/DescriptionField.test.js

@@ -0,0 +1,23 @@
+import React from 'react';
+import { mount } from '@theforeman/test';
+import { DescriptionField } from '../DescriptionField';
+
+describe('DescriptionField', () => {
+  it('rendring', () => {
+    const component = mount(
+      <DescriptionField
+        inputs={[{ name: 'command' }]}
+        value="Run %{command}"
+        setValue={jest.fn()}
+      />
+    );
+    const preview = component.find('#description-preview').hostNodes();
+    const findLink = () => component.find('.pf-m-link.pf-m-inline');
+    expect(findLink().text()).toEqual('Edit job description template');
+    expect(preview.props().value).toEqual('Run command');
+    findLink().simulate('click');
+    const description = component.find('#description').hostNodes();
+    expect(description.props().value).toEqual('Run %{command}');
+    expect(findLink().text()).toEqual('Preview job description');
+  });
+});

data/webpack/JobWizard/steps/CategoryAndTemplate/CategoryAndTemplate.test.js

@@ -1,52 +1,123 @@
-import { testComponentSnapshotsWithFixtures } from '@theforeman/test';
-import { CategoryAndTemplate } from './CategoryAndTemplate';
-
-const baseProps = {
-  setJobTemplate: jest.fn(),
-  selectedTemplateID: 190,
-  setCategory: jest.fn(),
-};
-const fixtures = {
-  'renders with props': {
-    ...baseProps,
-    jobCategories: [
-      'Commands',
-      'Ansible Playbook',
-      'Ansible Galaxy',
-      'Ansible Roles Installation',
-    ],
-    jobTemplates: [
-      {
-        id: 190,
-        name: 'ab Run Command - SSH Default clone',
-        job_category: 'Commands',
-        provider_type: 'SSH',
-        snippet: false,
-      },
-      {
-        id: 168,
-        name: 'Ansible Roles - Ansible Default',
-        job_category: 'Ansible Playbook',
-        provider_type: 'Ansible',
-        snippet: false,
-      },
-      {
-        id: 170,
-        name: 'Ansible Roles - Install from git',
-        job_category: 'Ansible Roles Installation',
-        provider_type: 'Ansible',
-        snippet: false,
-      },
-    ],
-    selectedCategory: 'I am a category',
-  },
-  'render with error': {
-    ...baseProps,
-    errors: { allTemplatesError: 'I have an error' },
-  },
-};
-
-describe('CategoryAndTemplate', () => {
-  describe('rendering', () =>
-    testComponentSnapshotsWithFixtures(CategoryAndTemplate, fixtures));
+import React from 'react';
+import { Provider } from 'react-redux';
+import { fireEvent, screen, render, act } from '@testing-library/react';
+import * as api from 'foremanReact/redux/API';
+import { JobWizard } from '../../JobWizard';
+import * as selectors from '../../JobWizardSelectors';
+import { testSetup, mockApi } from '../../__tests__/fixtures';
+
+const store = testSetup(selectors, api);
+mockApi(api);
+jest.spyOn(selectors, 'selectCategoryError');
+jest.spyOn(selectors, 'selectAllTemplatesError');
+jest.spyOn(selectors, 'selectTemplateError');
+
+describe('Category And Template', () => {
+  it('should select ', async () => {
+    selectors.selectCategoryError.mockImplementation(() => null);
+    selectors.selectAllTemplatesError.mockImplementation(() => null);
+    selectors.selectTemplateError.mockImplementation(() => null);
+    render(
+      <Provider store={store}>
+        <JobWizard />
+      </Provider>
+    );
+
+    expect(screen.queryAllByLabelText('Error')).toHaveLength(0);
+    expect(screen.queryAllByLabelText('failed')).toHaveLength(0);
+    // Category
+    fireEvent.click(
+      screen.getByLabelText('Ansible Commands', { selector: 'button' })
+    );
+    await act(async () => {
+      await fireEvent.click(screen.getByText('Puppet'));
+    });
+    fireEvent.click(screen.getAllByText('Category and Template')[0]); // to remove focus
+    expect(
+      screen.queryAllByLabelText('Ansible Commands', { selector: 'button' })
+    ).toHaveLength(0);
+    expect(
+      screen.queryAllByLabelText('Puppet', { selector: 'button' })
+    ).toHaveLength(1);
+
+    // Template
+    fireEvent.click(
+      screen.getByDisplayValue('template1', { selector: 'button' })
+    );
+    await act(async () => {
+      await fireEvent.click(screen.getByText('template2'));
+    });
+    fireEvent.click(screen.getAllByText('Category and Template')[0]); // to remove focus
+    expect(
+      screen.queryAllByDisplayValue('template1', { selector: 'button' })
+    ).toHaveLength(0);
+    expect(
+      screen.queryAllByDisplayValue('template2', { selector: 'button' })
+    ).toHaveLength(1);
+  });
+  it('category error ', async () => {
+    selectors.selectCategoryError.mockImplementation(() => 'category error');
+    selectors.selectAllTemplatesError.mockImplementation(() => null);
+    selectors.selectTemplateError.mockImplementation(() => null);
+    render(
+      <Provider store={store}>
+        <JobWizard />
+      </Provider>
+    );
+
+    expect(
+      screen.queryAllByText('Categories list failed with:', { exact: false })
+    ).toHaveLength(1);
+
+    expect(
+      screen.queryAllByText('Templates list failed with:', { exact: false })
+    ).toHaveLength(0);
+    expect(
+      screen.queryAllByText('Template failed with:', { exact: false })
+    ).toHaveLength(0);
+  });
+  it('templates error ', async () => {
+    selectors.selectCategoryError.mockImplementation(() => null);
+    selectors.selectAllTemplatesError.mockImplementation(
+      () => 'templates error'
+    );
+    selectors.selectTemplateError.mockImplementation(() => null);
+    render(
+      <Provider store={store}>
+        <JobWizard />
+      </Provider>
+    );
+
+    expect(
+      screen.queryAllByText('Categories list failed with:', { exact: false })
+    ).toHaveLength(0);
+
+    expect(
+      screen.queryAllByText('Templates list failed with:', { exact: false })
+    ).toHaveLength(1);
+    expect(
+      screen.queryAllByText('Template failed with:', { exact: false })
+    ).toHaveLength(0);
+  });
+  it('template error ', async () => {
+    selectors.selectCategoryError.mockImplementation(() => null);
+    selectors.selectAllTemplatesError.mockImplementation(() => null);
+    selectors.selectTemplateError.mockImplementation(() => 'template error');
+    render(
+      <Provider store={store}>
+        <JobWizard />
+      </Provider>
+    );
+
+    expect(
+      screen.queryAllByText('Categories list failed with:', { exact: false })
+    ).toHaveLength(0);
+
+    expect(
+      screen.queryAllByText('Templates list failed with:', { exact: false })
+    ).toHaveLength(0);
+    expect(
+      screen.queryAllByText('Template failed with:', { exact: false })
+    ).toHaveLength(1);
+  });
 });