foreman_remote_execution 4.8.0 → 5.0.0

data/webpack/JobWizard/__tests__/integration.test.js

@@ -2,6 +2,7 @@ import React from 'react';
 import { Provider } from 'react-redux';
 import { mount } from '@theforeman/test';
 import { render, fireEvent, screen, act } from '@testing-library/react';
+import { MockedProvider } from '@apollo/client/testing';
 import * as api from 'foremanReact/redux/API';
 import { JobWizard } from '../JobWizard';
 import * as selectors from '../JobWizardSelectors';
@@ -11,23 +12,31 @@ import {
   mockApi,
   jobCategories,
   jobTemplateResponse as jobTemplate,
+  gqlMock,
 } from './fixtures';
 
 const store = testSetup(selectors, api);
 
-selectors.selectJobTemplate.mockImplementation(() => {});
-
-api.get.mockImplementation(({ handleSuccess, ...action }) => {
-  if (action.key === 'JOB_CATEGORIES') {
-    handleSuccess && handleSuccess({ data: { job_categories: jobCategories } });
-  }
-  return { type: 'get', ...action };
-});
 describe('Job wizard fill', () => {
   it('should select template', async () => {
+    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: jobTemplate,
+          });
+      }
+      return { type: 'get', ...action };
+    });
+    selectors.selectJobTemplate.mockRestore();
+    jest.spyOn(selectors, 'selectJobTemplate');
+    selectors.selectJobTemplate.mockImplementation(() => ({}));
     const wrapper = mount(
       <Provider store={store}>
-        <JobWizard advancedValues={{}} setAdvancedValues={jest.fn()} />
+        <JobWizard />
       </Provider>
     );
     expect(wrapper.find('.pf-c-wizard__nav-link.pf-m-disabled')).toHaveLength(
@@ -35,7 +44,8 @@ describe('Job wizard fill', () => {
     );
     selectors.selectJobCategoriesStatus.mockImplementation(() => 'RESOLVED');
     expect(store.getActions()).toMatchSnapshot('initial');
-
+    selectors.selectJobTemplate.mockRestore();
+    jest.spyOn(selectors, 'selectJobTemplate');
     selectors.selectJobTemplate.mockImplementation(() => jobTemplate);
     wrapper.find('.pf-c-button.pf-c-select__toggle-button').simulate('click');
     await act(async () => {
@@ -43,9 +53,9 @@ describe('Job wizard fill', () => {
         .find('.pf-c-select__menu-item')
         .first()
         .simulate('click');
-      await wrapper.update();
     });
     expect(store.getActions().slice(-1)).toMatchSnapshot('select template');
+    wrapper.update();
     expect(wrapper.find('.pf-c-wizard__nav-link.pf-m-disabled')).toHaveLength(
       0
     );
@@ -53,15 +63,16 @@ describe('Job wizard fill', () => {
 
   it('have all steps', async () => {
     selectors.selectJobCategoriesStatus.mockImplementation(() => null);
-    selectors.selectJobTemplate.mockRestore();
     selectors.selectJobTemplates.mockRestore();
     selectors.selectJobCategories.mockRestore();
     mockApi(api);
 
     render(
-      <Provider store={store}>
-        <JobWizard />
-      </Provider>
+      <MockedProvider mocks={gqlMock} addTypename={false}>
+        <Provider store={store}>
+          <JobWizard />
+        </Provider>
+      </MockedProvider>
     );
     const titles = Object.values(WIZARD_TITLES);
     const steps = [titles[1], titles[0], ...titles.slice(2)]; // the first title is selected at the beggining

data/webpack/JobWizard/__tests__/validation.test.js

@@ -0,0 +1,141 @@
+import React from 'react';
+import { Provider } from 'react-redux';
+import { render, fireEvent, screen, act } from '@testing-library/react';
+import { MockedProvider } from '@apollo/client/testing';
+import '@testing-library/jest-dom';
+import * as api from 'foremanReact/redux/API';
+import { JobWizard } from '../JobWizard';
+import * as selectors from '../JobWizardSelectors';
+import { testSetup, mockApi, jobTemplateResponse, gqlMock } from './fixtures';
+import { WIZARD_TITLES } from '../JobWizardConstants';
+
+const store = testSetup(selectors, api);
+
+mockApi(api);
+const templateInputs = [...jobTemplateResponse.template_inputs];
+const advancedTemplateInputs = [
+  ...jobTemplateResponse.advanced_template_inputs,
+];
+templateInputs[0].default = null;
+advancedTemplateInputs[0].default = null;
+selectors.selectTemplateInputs.mockImplementation(() => templateInputs);
+selectors.selectAdvancedTemplateInputs.mockImplementation(
+  () => advancedTemplateInputs
+);
+
+describe('Job wizard validation', () => {
+  afterAll(() => {
+    selectors.selectTemplateInputs.mockRestore();
+    selectors.selectAdvancedTemplateInputs.mockRestore();
+  });
+  it('requeried', async () => {
+    render(
+      <MockedProvider mocks={gqlMock} addTypename={false}>
+        <Provider store={store}>
+          <JobWizard />
+        </Provider>
+      </MockedProvider>
+    );
+    expect(screen.getByText(WIZARD_TITLES.advanced)).toBeDisabled();
+    expect(screen.getByText(WIZARD_TITLES.schedule)).toBeDisabled();
+    expect(screen.getByText(WIZARD_TITLES.review)).toBeDisabled();
+    await act(async () => {
+      fireEvent.click(screen.getByText(WIZARD_TITLES.hostsAndInputs));
+    });
+    const textField = screen.getByLabelText('plain hidden', {
+      selector: 'textarea',
+    });
+    await act(async () => {
+      await fireEvent.change(textField, {
+        target: { value: 'text' },
+      });
+    });
+    expect(screen.getByText(WIZARD_TITLES.advanced)).toBeEnabled();
+    expect(screen.getByText(WIZARD_TITLES.schedule)).toBeDisabled();
+    expect(screen.getByText(WIZARD_TITLES.review)).toBeDisabled();
+
+    await act(async () => {
+      fireEvent.click(screen.getByText(WIZARD_TITLES.advanced));
+    });
+    const advTextField = screen.getByLabelText('adv plain hidden', {
+      selector: 'textarea',
+    });
+    await act(async () => {
+      await fireEvent.change(advTextField, {
+        target: { value: 'text' },
+      });
+    });
+
+    expect(
+      screen.getByText(WIZARD_TITLES.advanced, { selector: 'button' })
+    ).toBeEnabled();
+    expect(screen.getByText(WIZARD_TITLES.schedule)).toBeEnabled();
+    expect(screen.getByText(WIZARD_TITLES.review)).toBeEnabled();
+  });
+
+  it('advanced number', async () => {
+    render(
+      <MockedProvider mocks={gqlMock} addTypename={false}>
+        <Provider store={store}>
+          <JobWizard />
+        </Provider>
+      </MockedProvider>
+    );
+
+    // setup
+    await act(async () => {
+      fireEvent.click(screen.getByText(WIZARD_TITLES.hostsAndInputs));
+    });
+    await act(async () => {
+      await fireEvent.change(
+        screen.getByLabelText('plain hidden', {
+          selector: 'textarea',
+        }),
+        {
+          target: { value: 'text' },
+        }
+      );
+    });
+
+    await act(async () => {
+      fireEvent.click(screen.getByText(WIZARD_TITLES.advanced));
+    });
+    await act(async () => {
+      await fireEvent.change(
+        screen.getByLabelText('adv plain hidden', {
+          selector: 'textarea',
+        }),
+        {
+          target: { value: 'text' },
+        }
+      );
+    });
+    expect(
+      screen.getByText(WIZARD_TITLES.advanced, { selector: 'button' })
+    ).toBeEnabled();
+    expect(screen.getByText(WIZARD_TITLES.schedule)).toBeEnabled();
+    expect(screen.getByText(WIZARD_TITLES.review)).toBeEnabled();
+
+    // test
+    const timeoutField = screen.getByLabelText('timeout to kill', {
+      selector: 'input',
+    });
+    await act(async () => {
+      await fireEvent.change(timeoutField, {
+        target: { value: 'text' },
+      });
+    });
+
+    expect(screen.getByText(WIZARD_TITLES.schedule)).toBeDisabled();
+    expect(screen.getByText(WIZARD_TITLES.review)).toBeDisabled();
+
+    await act(async () => {
+      await fireEvent.change(timeoutField, {
+        target: { value: 123 },
+      });
+    });
+
+    expect(screen.getByText(WIZARD_TITLES.schedule)).toBeEnabled();
+    expect(screen.getByText(WIZARD_TITLES.review)).toBeEnabled();
+  });
+});

data/webpack/JobWizard/autofill.js

@@ -0,0 +1,38 @@
+import { useEffect } from 'react';
+import { useDispatch, useSelector } from 'react-redux';
+import { get } from 'foremanReact/redux/API';
+import { HOST_IDS } from './JobWizardConstants';
+import { selectRouterSearch } from './JobWizardSelectors';
+import './JobWizard.scss';
+
+export const useAutoFill = ({ setSelectedTargets, setHostsSearchQuery }) => {
+  const fills = useSelector(selectRouterSearch);
+  const dispatch = useDispatch();
+
+  useEffect(() => {
+    if (Object.keys(fills).length) {
+      if (fills['host_ids[]']) {
+        dispatch(
+          get({
+            key: HOST_IDS,
+            url: '/api/hosts',
+            params: { search: `id = ${fills['host_ids[]'].join(' or id = ')}` },
+            handleSuccess: ({ data }) => {
+              setSelectedTargets(currentTargets => ({
+                ...currentTargets,
+                hosts: (data.results || []).map(({ name }) => ({
+                  id: name,
+                  name,
+                })),
+              }));
+            },
+          })
+        );
+      }
+      if (fills.search) {
+        setHostsSearchQuery(fills.search);
+      }
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+};

data/webpack/JobWizard/index.js

@@ -1,4 +1,5 @@
 import React from 'react';
+import PropTypes from 'prop-types';
 import { Title, Divider } from '@patternfly/react-core';
 import { translate as __ } from 'foremanReact/common/I18n';
 import PageLayout from 'foremanReact/routes/common/PageLayout/PageLayout';
@@ -29,4 +30,10 @@ const JobWizardPage = () => {
   );
 };
 
+JobWizardPage.propTypes = {
+  location: PropTypes.shape({
+    search: PropTypes.string,
+  }).isRequired,
+};
+
 export default JobWizardPage;

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

@@ -5,7 +5,6 @@ import { Form } from '@patternfly/react-core';
 import {
   selectEffectiveUser,
   selectAdvancedTemplateInputs,
-  selectTemplateInputs,
 } from '../../JobWizardSelectors';
 import {
   EffectiveUserField,
@@ -22,10 +21,13 @@ import { DescriptionField } from './DescriptionField';
 import { WIZARD_TITLES } from '../../JobWizardConstants';
 import { WizardTitle } from '../form/WizardTitle';
 
-export const AdvancedFields = ({ advancedValues, setAdvancedValues }) => {
+export const AdvancedFields = ({
+  templateValues,
+  advancedValues,
+  setAdvancedValues,
+}) => {
   const effectiveUser = useSelector(selectEffectiveUser);
   const advancedTemplateInputs = useSelector(selectAdvancedTemplateInputs);
-  const templateInputs = useSelector(selectTemplateInputs);
   return (
     <>
       <WizardTitle
@@ -49,7 +51,7 @@ export const AdvancedFields = ({ advancedValues, setAdvancedValues }) => {
           />
         )}
         <DescriptionField
-          inputs={templateInputs}
+          inputValues={{ ...templateValues, ...advancedValues.templateValues }}
           value={advancedValues.description}
           setValue={newValue => setAdvancedValues({ description: newValue })}
         />
@@ -117,5 +119,6 @@ export const AdvancedFields = ({ advancedValues, setAdvancedValues }) => {
 AdvancedFields.propTypes = {
   advancedValues: PropTypes.object.isRequired,
   setAdvancedValues: PropTypes.func.isRequired,
+  templateValues: PropTypes.object.isRequired,
 };
 export default AdvancedFields;

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

@@ -1,10 +1,19 @@
-import React, { useState } from 'react';
+import React, { useState, useEffect, useCallback } from 'react';
+import { useSelector } from 'react-redux';
 import PropTypes from 'prop-types';
-import { FormGroup, TextInput, Button } from '@patternfly/react-core';
+import { FormGroup, TextInput, Tooltip, Button } from '@patternfly/react-core';
 import { translate as __ } from 'foremanReact/common/I18n';
+import {
+  selectTemplateInputs,
+  selectAdvancedTemplateInputs,
+} from '../../JobWizardSelectors';
 
-export const DescriptionField = ({ inputs, value, setValue }) => {
-  const generateDesc = () => {
+export const DescriptionField = ({ inputValues, value, setValue }) => {
+  const inputs = [
+    ...useSelector(selectTemplateInputs),
+    ...useSelector(selectAdvancedTemplateInputs),
+  ].map(input => input.name);
+  const generateDesc = useCallback(() => {
     let newDesc = value;
     if (value) {
       const re = new RegExp('%\\{([^\\}]+)\\}', 'gm');
@@ -15,16 +24,19 @@ export const DescriptionField = ({ inputs, value, setValue }) => {
       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
+          inputValues[result.name] ||
+            (inputs.includes(result.name) ? '' : result.text)
         );
       });
     }
     return newDesc;
-  };
+  }, [inputs, value, inputValues]);
   const [generatedDesc, setGeneratedDesc] = useState(generateDesc());
   const [isPreview, setIsPreview] = useState(true);
 
+  useEffect(() => {
+    setGeneratedDesc(generateDesc());
+  }, [generateDesc]);
   const togglePreview = () => {
     setGeneratedDesc(generateDesc());
     setIsPreview(v => !v);
@@ -43,9 +55,20 @@ export const DescriptionField = ({ inputs, value, setValue }) => {
       }
     >
       {isPreview ? (
-        <TextInput id="description-preview" value={generatedDesc} isDisabled />
+        <Tooltip content={generatedDesc}>
+          <div>
+            {/* div wrapper so the tooltip will be shown in chrome */}
+            <TextInput
+              aria-label="description preview"
+              id="description-preview"
+              value={generatedDesc}
+              isDisabled
+            />
+          </div>
+        </Tooltip>
       ) : (
         <TextInput
+          aria-label="description edit"
           type="text"
           autoComplete="description"
           id="description"
@@ -58,7 +81,7 @@ export const DescriptionField = ({ inputs, value, setValue }) => {
 };
 
 DescriptionField.propTypes = {
-  inputs: PropTypes.array.isRequired,
+  inputValues: PropTypes.object.isRequired,
   value: PropTypes.string,
   setValue: PropTypes.func.isRequired,
 };

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

@@ -1,14 +1,19 @@
+/* eslint-disable max-lines */
 import React from 'react';
 import { Provider } from 'react-redux';
 import { mount } from '@theforeman/test';
 import { fireEvent, screen, render, act } from '@testing-library/react';
+import { MockedProvider } from '@apollo/client/testing';
 import * as api from 'foremanReact/redux/API';
 import { JobWizard } from '../../../JobWizard';
 import * as selectors from '../../../JobWizardSelectors';
 import {
-  jobTemplateResponse as jobTemplate,
+  jobTemplateResponse,
+  jobTemplate,
   testSetup,
   mockApi,
+  jobCategories,
+  gqlMock,
 } from '../../../__tests__/fixtures';
 import { WIZARD_TITLES } from '../../../JobWizardConstants';
 
@@ -18,14 +23,16 @@ mockApi(api);
 jest.spyOn(selectors, 'selectEffectiveUser');
 
 selectors.selectEffectiveUser.mockImplementation(
-  () => jobTemplate.effective_user
+  () => jobTemplateResponse.effective_user
 );
 describe('AdvancedFields', () => {
   it('should save data between steps for advanced fields', async () => {
     const wrapper = mount(
-      <Provider store={store}>
-        <JobWizard advancedValues={{}} setAdvancedValues={jest.fn()} />
-      </Provider>
+      <MockedProvider mocks={gqlMock} addTypename={false}>
+        <Provider store={store}>
+          <JobWizard />
+        </Provider>
+      </MockedProvider>
     );
     // setup
     wrapper.find('.pf-c-button.pf-c-select__toggle-button').simulate('click');
@@ -78,9 +85,11 @@ describe('AdvancedFields', () => {
   });
   it('fill template fields', async () => {
     render(
-      <Provider store={store}>
-        <JobWizard />
-      </Provider>
+      <MockedProvider mocks={gqlMock} addTypename={false}>
+        <Provider store={store}>
+          <JobWizard />
+        </Provider>
+      </MockedProvider>
     );
     await act(async () => {
       fireEvent.click(screen.getByText(WIZARD_TITLES.advanced));
@@ -91,7 +100,10 @@ describe('AdvancedFields', () => {
     const textField = screen.getByLabelText('adv plain hidden', {
       selector: 'textarea',
     });
-    const selectField = screen.getByText('option 1');
+    const selectField = screen.getByLabelText('adv plain select toggle');
+    const resourceSelectField = screen.getByLabelText(
+      'adv resource select toggle'
+    );
     const searchField = screen.getByPlaceholderText('Filter...');
     const dateField = screen.getByLabelText('adv date', {
       selector: 'input',
@@ -101,6 +113,10 @@ describe('AdvancedFields', () => {
     await act(async () => {
       await fireEvent.click(screen.getByText('option 2'));
       fireEvent.click(screen.getAllByText(WIZARD_TITLES.advanced)[0]); // to remove focus
+
+      fireEvent.click(resourceSelectField);
+      await fireEvent.click(screen.getByText('resource2'));
+
       await fireEvent.change(textField, {
         target: { value: textValue },
       });
@@ -134,12 +150,16 @@ describe('AdvancedFields', () => {
     expect(dateField.value).toBe(dateValue);
     expect(screen.queryAllByText('option 1')).toHaveLength(0);
     expect(screen.queryAllByText('option 2')).toHaveLength(1);
+    expect(screen.queryAllByDisplayValue('resource1')).toHaveLength(0);
+    expect(screen.queryAllByDisplayValue('resource2')).toHaveLength(1);
   });
   it('fill defaults into fields', async () => {
     render(
-      <Provider store={store}>
-        <JobWizard />
-      </Provider>
+      <MockedProvider mocks={gqlMock} addTypename={false}>
+        <Provider store={store}>
+          <JobWizard />
+        </Provider>
+      </MockedProvider>
     );
     await act(async () => {
       fireEvent.click(screen.getByText('Advanced Fields'));
@@ -155,5 +175,189 @@ describe('AdvancedFields', () => {
         selector: 'input',
       }).value
     ).toBe('2');
+
+    expect(
+      screen.getByLabelText('description preview', {
+        selector: 'input',
+      }).value
+    ).toBe(
+      'template1 with inputs adv plain hidden="Default val" adv plain select="" adv resource select="" adv search="" adv date="" plain hidden="Default val"'
+    );
+  });
+  it('DescriptionField', async () => {
+    render(
+      <Provider store={store}>
+        <JobWizard />
+      </Provider>
+    );
+    await act(async () => {
+      fireEvent.click(screen.getByText(WIZARD_TITLES.advanced));
+    });
+
+    const textField = screen.getByLabelText('adv plain hidden', {
+      selector: 'textarea',
+    });
+    await act(async () => {
+      await fireEvent.change(textField, {
+        target: { value: 'test command' },
+      });
+    });
+    const descriptionValue = 'Run %{adv plain hidden} %{wrong command name}';
+
+    await act(async () => {
+      fireEvent.click(screen.getByText('Edit job description template'));
+    });
+
+    const editText = screen.getByLabelText('description edit', {
+      selector: 'input',
+    });
+    await fireEvent.change(editText, {
+      target: { value: descriptionValue },
+    });
+    await act(async () => {
+      fireEvent.click(screen.getByText('Preview job description'));
+    });
+    expect(
+      screen.getByLabelText('description preview', {
+        selector: 'input',
+      }).value
+    ).toBe('Run test command %{wrong command name}');
+  });
+
+  it('DescriptionField with no inputs', async () => {
+    jest.spyOn(api, 'get');
+
+    jest.spyOn(selectors, 'selectTemplateInputs');
+    jest.spyOn(selectors, 'selectAdvancedTemplateInputs');
+    selectors.selectTemplateInputs.mockImplementation(() => []);
+    selectors.selectAdvancedTemplateInputs.mockImplementation(() => []);
+    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,
+              advanced_template_inputs: [],
+              template_inputs: [],
+            },
+          });
+      } else if (action.key === 'JOB_TEMPLATES') {
+        handleSuccess &&
+          handleSuccess({
+            data: { results: [jobTemplate] },
+          });
+      }
+      return { type: 'get', ...action };
+    });
+    render(
+      <Provider store={store}>
+        <JobWizard />
+      </Provider>
+    );
+    await act(async () => {
+      fireEvent.click(screen.getByText(WIZARD_TITLES.advanced));
+    });
+    expect(
+      screen.getByLabelText('description preview', {
+        selector: 'input',
+      }).value
+    ).toBe('template1');
+  });
+
+  it('DescriptionField with description_format', async () => {
+    jest.spyOn(api, 'get');
+    jest.spyOn(selectors, 'selectTemplateInputs');
+    selectors.selectTemplateInputs.mockImplementation(() => [
+      {
+        name: 'command',
+        required: true,
+        input_type: 'user',
+        description: 'some Description',
+        advanced: true,
+        value_type: 'plain',
+        resource_type: 'ansible_roles',
+        default: 'Default val',
+        hidden_value: true,
+      },
+    ]);
+    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,
+              job_template: {
+                ...jobTemplateResponse.jobTemplate,
+                description_format: 'Run %{command}',
+              },
+
+              template_inputs: [
+                {
+                  name: 'command',
+                  required: true,
+                  input_type: 'user',
+                  description: 'some Description',
+                  advanced: true,
+                  value_type: 'plain',
+                  resource_type: 'ansible_roles',
+                  default: 'Default val',
+                  hidden_value: true,
+                },
+              ],
+            },
+          });
+      } else if (action.key === 'JOB_TEMPLATES') {
+        handleSuccess &&
+          handleSuccess({
+            data: { results: [jobTemplate] },
+          });
+      }
+      return { type: 'get', ...action };
+    });
+    render(
+      <Provider store={store}>
+        <JobWizard />
+      </Provider>
+    );
+    await act(async () => {
+      fireEvent.click(screen.getByText(WIZARD_TITLES.advanced));
+    });
+    expect(
+      screen.getByLabelText('description preview', {
+        selector: 'input',
+      }).value
+    ).toBe('Run Default val');
+  });
+
+  it('search resources action', async () => {
+    jest.useFakeTimers();
+    mockApi(api);
+    const newStore = testSetup(selectors, api);
+    render(
+      <Provider store={newStore}>
+        <JobWizard />
+      </Provider>
+    );
+    await act(async () => {
+      fireEvent.click(screen.getByText(WIZARD_TITLES.advanced));
+    });
+    const resourceSelectField = screen.getByLabelText(
+      'adv resource select typeahead input'
+    );
+
+    await act(async () => {
+      await fireEvent.change(resourceSelectField, {
+        target: { value: 'some search' },
+      });
+
+      await jest.runAllTimers();
+    });
+    expect(newStore.getActions()).toMatchSnapshot('resource search');
   });
 });