foreman_remote_execution 4.7.0 → 4.8.0

data/webpack/JobWizard/steps/HostsAndInputs/__tests__/SelectedChips.test.js

@@ -0,0 +1,37 @@
+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);
+
+describe('TemplateInputs', () => {
+  it('should save data between steps for template input fields', async () => {
+    render(
+      <Provider store={store}>
+        <JobWizard advancedValues={{}} setAdvancedValues={jest.fn()} />
+      </Provider>
+    );
+    await act(async () => {
+      await fireEvent.click(
+        screen.getByText('Target hosts and inputs', { selector: 'button' })
+      );
+    });
+
+    expect(
+      screen.getAllByLabelText('host2', { selector: 'button' })
+    ).toHaveLength(1);
+    const chip1 = screen.getByLabelText('host1', { selector: 'button' });
+    fireEvent.click(chip1);
+    expect(
+      screen.queryAllByLabelText('host1', { selector: 'button' })
+    ).toHaveLength(0);
+    expect(
+      screen.queryAllByLabelText('host2', { selector: 'button' })
+    ).toHaveLength(1);
+  });
+});

data/webpack/JobWizard/steps/HostsAndInputs/__tests__/TemplateInputs.test.js

@@ -0,0 +1,50 @@
+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';
+import { WIZARD_TITLES } from '../../../JobWizardConstants';
+
+const store = testSetup(selectors, api);
+mockApi(api);
+
+describe('TemplateInputs', () => {
+  it('should save data between steps for template input fields', async () => {
+    render(
+      <Provider store={store}>
+        <JobWizard />
+      </Provider>
+    );
+    await act(async () => {
+      fireEvent.click(screen.getByText(WIZARD_TITLES.hostsAndInputs));
+    });
+    const textValue = 'I am a plain text';
+    const textField = screen.getByLabelText('plain hidden', {
+      selector: 'textarea',
+    });
+
+    await act(async () => {
+      await fireEvent.change(textField, {
+        target: { value: textValue },
+      });
+    });
+    expect(
+      screen.getByLabelText('plain hidden', {
+        selector: 'textarea',
+      }).value
+    ).toBe(textValue);
+    await act(async () => {
+      fireEvent.click(screen.getByText(WIZARD_TITLES.categoryAndTemplate));
+    });
+    expect(screen.getAllByText(WIZARD_TITLES.categoryAndTemplate)).toHaveLength(
+      3
+    );
+
+    await act(async () => {
+      fireEvent.click(screen.getByText(WIZARD_TITLES.hostsAndInputs));
+    });
+    expect(textField.value).toBe(textValue);
+  });
+});

data/webpack/JobWizard/steps/HostsAndInputs/index.js

@@ -0,0 +1,66 @@
+import React, { useState } from 'react';
+import { Button, Form, FormGroup } from '@patternfly/react-core';
+import PropTypes from 'prop-types';
+import { useSelector } from 'react-redux';
+import { translate as __ } from 'foremanReact/common/I18n';
+import { selectTemplateInputs } from '../../JobWizardSelectors';
+import { SelectField } from '../form/SelectField';
+import { SelectedChips } from './SelectedChips';
+import { TemplateInputs } from './TemplateInputs';
+import { WIZARD_TITLES } from '../../JobWizardConstants';
+import { WizardTitle } from '../form/WizardTitle';
+
+const HostsAndInputs = ({
+  templateValues,
+  setTemplateValues,
+  selectedHosts,
+  setSelectedHosts,
+}) => {
+  const templateInputs = useSelector(selectTemplateInputs);
+  const hostMethods = [
+    __('Hosts'),
+    __('Host collection'),
+    __('Host group'),
+    __('Search query'),
+  ];
+  const [hostMethod, setHostMethod] = useState(hostMethods[0]);
+  return (
+    <>
+      <WizardTitle title={WIZARD_TITLES.hostsAndInputs} />
+      <Form>
+        <FormGroup fieldId="host_selection">
+          <SelectField
+            fieldId="host_methods"
+            options={hostMethods}
+            setValue={setHostMethod}
+            value={hostMethod}
+          />
+          <SelectedChips
+            selected={selectedHosts}
+            setSelected={setSelectedHosts}
+          />
+        </FormGroup>
+        <span>
+          {__('Apply to')}{' '}
+          <Button variant="link" isInline>
+            {selectedHosts.length} {__('hosts')}
+          </Button>
+        </span>
+        <TemplateInputs
+          inputs={templateInputs}
+          value={templateValues}
+          setValue={setTemplateValues}
+        />
+      </Form>
+    </>
+  );
+};
+
+HostsAndInputs.propTypes = {
+  templateValues: PropTypes.object.isRequired,
+  setTemplateValues: PropTypes.func.isRequired,
+  selectedHosts: PropTypes.array.isRequired,
+  setSelectedHosts: PropTypes.func.isRequired,
+};
+
+export default HostsAndInputs;

data/webpack/JobWizard/steps/Schedule/ScheduleType.js

@@ -1,25 +1,28 @@
-import React, { useState } from 'react';
+import React from 'react';
+import PropTypes from 'prop-types';
 import { FormGroup, Radio } from '@patternfly/react-core';
 import { translate as __ } from 'foremanReact/common/I18n';
 
-export const ScheduleType = () => {
-  const [isFuture, setIsFuture] = useState(false);
-  return (
-    <FormGroup label={__('Schedule type')} fieldId="schedule-type">
-      <Radio
-        isChecked={!isFuture}
-        name="schedule-type"
-        onChange={() => setIsFuture(false)}
-        id="schedule-type-now"
-        label={__('Execute now')}
-      />
-      <Radio
-        isChecked={isFuture}
-        name="schedule-type"
-        onChange={() => setIsFuture(true)}
-        id="schedule-type-future"
-        label={__('Schedule for future execution')}
-      />
-    </FormGroup>
-  );
+export const ScheduleType = ({ isFuture, setIsFuture }) => (
+  <FormGroup label={__('Schedule type')} fieldId="schedule-type">
+    <Radio
+      isChecked={!isFuture}
+      name="schedule-type"
+      onChange={() => setIsFuture(false)}
+      id="schedule-type-now"
+      label={__('Execute now')}
+    />
+    <Radio
+      isChecked={isFuture}
+      name="schedule-type"
+      onChange={() => setIsFuture(true)}
+      id="schedule-type-future"
+      label={__('Schedule for future execution')}
+    />
+  </FormGroup>
+);
+
+ScheduleType.propTypes = {
+  isFuture: PropTypes.bool.isRequired,
+  setIsFuture: PropTypes.func.isRequired,
 };

data/webpack/JobWizard/steps/Schedule/StartEndDates.js

@@ -1,35 +1,48 @@
-import React, { useState } from 'react';
+import React from 'react';
 import PropTypes from 'prop-types';
-import { FormGroup, TextInput, Checkbox } from '@patternfly/react-core';
+import { FormGroup, Checkbox } from '@patternfly/react-core';
 import { translate as __ } from 'foremanReact/common/I18n';
+import { DateTimePicker } from '../form/DateTimePicker';
 
-// TODO: change to datepicker
-export const StartEndDates = ({ starts, setStarts, ends, setEnds }) => {
-  const [isNeverEnds, setIsNeverEnds] = useState(false);
+export const StartEndDates = ({
+  starts,
+  setStarts,
+  ends,
+  setEnds,
+  isNeverEnds,
+  setIsNeverEnds,
+}) => {
   const toggleIsNeverEnds = (checked, event) => {
     const value = event?.target?.checked;
     setIsNeverEnds(value);
-    setEnds('');
+  };
+  const validateEndDate = () => {
+    if (isNeverEnds) return 'success';
+    if (!starts || !ends) return 'success';
+    if (new Date(starts).getTime() <= new Date(ends).getTime())
+      return 'success';
+    return 'error';
   };
   return (
     <>
-      <FormGroup label={__('Starts')} fieldId="start-date">
-        <TextInput
-          id="start-date"
-          value={starts}
-          type="text"
-          onChange={newValue => setStarts(newValue)}
-          placeholder="mm/dd/yy, hh:mm UTC"
-        />
+      <FormGroup
+        className="start-date"
+        label={__('Starts')}
+        fieldId="start-date"
+      >
+        <DateTimePicker dateTime={starts} setDateTime={setStarts} />
       </FormGroup>
-      <FormGroup label={__('Ends')} fieldId="end-date">
-        <TextInput
+      <FormGroup
+        className="end-date"
+        label={__('Ends')}
+        fieldId="end-date"
+        helperTextInvalid={__('End time needs to be after start time')}
+        validated={validateEndDate()}
+      >
+        <DateTimePicker
+          dateTime={ends}
+          setDateTime={setEnds}
           isDisabled={isNeverEnds}
-          id="end-date"
-          value={ends}
-          type="text"
-          onChange={newValue => setEnds(newValue)}
-          placeholder="mm/dd/yy, hh:mm UTC"
         />
         <Checkbox
           label={__('Never ends')}
@@ -48,4 +61,6 @@ StartEndDates.propTypes = {
   setStarts: PropTypes.func.isRequired,
   ends: PropTypes.string.isRequired,
   setEnds: PropTypes.func.isRequired,
+  isNeverEnds: PropTypes.bool.isRequired,
+  setIsNeverEnds: PropTypes.func.isRequired,
 };

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

@@ -0,0 +1,155 @@
+import React from 'react';
+import { Provider } from 'react-redux';
+import configureMockStore from 'redux-mock-store';
+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 { jobTemplate, jobTemplateResponse } from '../../../__tests__/fixtures';
+
+const lodash = require('lodash');
+
+lodash.debounce = fn => fn;
+jest.spyOn(api, 'get');
+jest.spyOn(selectors, 'selectJobTemplate');
+jest.spyOn(selectors, 'selectJobTemplates');
+jest.spyOn(selectors, 'selectJobCategories');
+
+const jobCategories = ['Ansible Commands', 'Puppet', 'Services'];
+
+selectors.selectJobCategories.mockImplementation(() => jobCategories);
+
+selectors.selectJobTemplates.mockImplementation(() => [
+  jobTemplate,
+  { ...jobTemplate, id: 2, name: 'template2' },
+]);
+selectors.selectJobTemplate.mockImplementation(() => jobTemplateResponse);
+api.get.mockImplementation(({ handleSuccess, ...action }) => {
+  if (action.key === 'JOB_CATEGORIES') {
+    handleSuccess && handleSuccess({ data: { job_categories: jobCategories } });
+  } else if (action.key === 'JOB_TEMPLATE') {
+    handleSuccess &&
+      handleSuccess({
+        data: jobTemplateResponse,
+      });
+  } else if (action.key === 'JOB_TEMPLATES') {
+    handleSuccess &&
+      handleSuccess({
+        data: { results: [jobTemplateResponse.job_template] },
+      });
+  }
+  return { type: 'get', ...action };
+});
+
+const mockStore = configureMockStore([]);
+const store = mockStore({});
+jest.useFakeTimers();
+
+describe('Schedule', () => {
+  it('should save date time between steps ', async () => {
+    render(
+      <Provider store={store}>
+        <JobWizard />
+      </Provider>
+    );
+    await act(async () => {
+      fireEvent.click(screen.getByText('Schedule'));
+    });
+    const newStartDate = '2020/03/12';
+    const newStartTime = '12:03';
+    const newEndsDate = '2030/03/12';
+    const newEndsTime = '17:34';
+    const [startsDateField, endsDateField] = screen.getAllByPlaceholderText(
+      'yyyy/mm/dd'
+    );
+    const [startsTimeField, endsTimeField] = screen.getAllByPlaceholderText(
+      'hh:mm'
+    );
+    await act(async () => {
+      await fireEvent.change(startsDateField, {
+        target: { value: newStartDate },
+      });
+      await fireEvent.change(startsTimeField, {
+        target: { value: newStartTime },
+      });
+      await fireEvent.change(endsDateField, { target: { value: newEndsDate } });
+      await fireEvent.change(endsTimeField, { target: { value: newEndsTime } });
+      jest.runAllTimers(); // to handle pf4 date picket popover useTimer
+    });
+    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('Schedule'));
+      jest.runAllTimers();
+    });
+    expect(startsDateField.value).toBe(newStartDate);
+    expect(startsTimeField.value).toBe(newStartTime);
+    expect(endsDateField.value).toBe(newEndsDate);
+    expect(endsTimeField.value).toBe(newEndsTime);
+  });
+  it('should remove start date time on execute now', async () => {
+    render(
+      <Provider store={store}>
+        <JobWizard />
+      </Provider>
+    );
+    await act(async () => {
+      fireEvent.click(screen.getByText('Schedule'));
+    });
+    const executeNow = screen.getByLabelText('Execute now');
+    const executeFuture = screen.getByLabelText(
+      'Schedule for future execution'
+    );
+    expect(executeNow.checked).toBeTruthy();
+    const newStartDate = '2020/03/12';
+    const newStartTime = '12:03';
+    const [startsDateField] = screen.getAllByPlaceholderText('yyyy/mm/dd');
+    const [startsTimeField] = screen.getAllByPlaceholderText('hh:mm');
+    await act(async () => {
+      await fireEvent.change(startsDateField, {
+        target: { value: newStartDate },
+      });
+      await fireEvent.change(startsTimeField, {
+        target: { value: newStartTime },
+      });
+      await jest.runOnlyPendingTimers();
+    });
+    expect(startsDateField.value).toBe(newStartDate);
+    expect(startsTimeField.value).toBe(newStartTime);
+    expect(executeFuture.checked).toBeTruthy();
+    await act(async () => {
+      await fireEvent.click(executeNow);
+    });
+    expect(executeNow.checked).toBeTruthy();
+    expect(startsDateField.value).toBe('');
+    expect(startsTimeField.value).toBe('');
+  });
+
+  it('should disable end date on never ends', async () => {
+    render(
+      <Provider store={store}>
+        <JobWizard />
+      </Provider>
+    );
+    await act(async () => {
+      await fireEvent.click(screen.getByText('Schedule'));
+      jest.runAllTimers();
+    });
+    const neverEnds = screen.getByLabelText('Never ends');
+    expect(neverEnds.checked).toBeFalsy();
+
+    const [, endsDateField] = screen.getAllByPlaceholderText('yyyy/mm/dd');
+    const [, endsTimeField] = screen.getAllByPlaceholderText('hh:mm');
+    expect(endsDateField.disabled).toBeFalsy();
+    expect(endsTimeField.disabled).toBeFalsy();
+    await act(async () => {
+      fireEvent.click(neverEnds);
+    });
+    expect(neverEnds.checked).toBeTruthy();
+    expect(endsDateField.disabled).toBeTruthy();
+    expect(endsTimeField.disabled).toBeTruthy();
+  });
+});

data/webpack/JobWizard/steps/Schedule/__tests__/StartEndDates.test.js

@@ -1,22 +1,23 @@
 import React from 'react';
-import { render, fireEvent, screen } from '@testing-library/react';
+import { render, fireEvent, screen, act } from '@testing-library/react';
 import { StartEndDates } from '../StartEndDates';
 
 const setEnds = jest.fn();
+const setIsNeverEnds = jest.fn();
 const props = {
   starts: '',
   setStarts: jest.fn(),
   ends: 'some-end-date',
   setEnds,
+  setIsNeverEnds,
+  isNeverEnds: false,
 };
 
 describe('StartEndDates', () => {
-  it('never ends', () => {
-    render(<StartEndDates {...props} />);
-    const neverEnds = screen.getByLabelText('Never ends', {
-      selector: 'input',
-    });
-    fireEvent.click(neverEnds);
-    expect(setEnds).toBeCalledWith('');
+  it('never ends', async () => {
+    await act(async () => render(<StartEndDates {...props} />));
+    const neverEnds = screen.getByRole('checkbox', { name: 'Never ends' });
+    await act(async () => fireEvent.click(neverEnds));
+    expect(setIsNeverEnds).toBeCalledWith(true);
   });
 });