From 846db06d2db617d818a695609e105aa4c267ffa8 Mon Sep 17 00:00:00 2001
From: Oleh Fedorenko <ofedoren@redhat.com>
Date: Tue, 2 Jul 2024 14:09:22 +0000
Subject: [PATCH 1/4] Fixes #37619 - Add ouia-ids for remediation wizard

---
 .../OpenscapRemediationWizard/ViewSelectedHostsLink.js     | 1 +
 webpack/components/OpenscapRemediationWizard/index.js      | 1 +
 .../components/OpenscapRemediationWizard/steps/Finish.js   | 7 ++++++-
 .../OpenscapRemediationWizard/steps/ReviewHosts.js         | 1 +
 .../OpenscapRemediationWizard/steps/ReviewRemediation.js   | 3 +++
 5 files changed, 12 insertions(+), 1 deletion(-)

diff --git a/webpack/components/OpenscapRemediationWizard/ViewSelectedHostsLink.js b/webpack/components/OpenscapRemediationWizard/ViewSelectedHostsLink.js
index ed0cfda6..04ca9c40 100644
--- a/webpack/components/OpenscapRemediationWizard/ViewSelectedHostsLink.js
+++ b/webpack/components/OpenscapRemediationWizard/ViewSelectedHostsLink.js
@@ -17,6 +17,7 @@ const ViewSelectedHostsLink = ({
   const url = foremanUrl(`${useForemanHostsPageUrl()}?search=${search}`);
   return (
     <Button
+      ouiaId="oscap-rem-wiz-ext-link-to-hosts"
       component="a"
       variant="link"
       icon={<ExternalLinkSquareAltIcon />}
diff --git a/webpack/components/OpenscapRemediationWizard/index.js b/webpack/components/OpenscapRemediationWizard/index.js
index 1db35e9c..d12d61aa 100644
--- a/webpack/components/OpenscapRemediationWizard/index.js
+++ b/webpack/components/OpenscapRemediationWizard/index.js
@@ -132,6 +132,7 @@ const OpenscapRemediationWizard = ({
         </OpenscapRemediationWizardContext.Provider>
       )}
       <Button
+        ouiaId="oscap-rem-wiz-open-wiz-button"
         id="openscapRemediationWizardButton"
         variant="link"
         isInline
diff --git a/webpack/components/OpenscapRemediationWizard/steps/Finish.js b/webpack/components/OpenscapRemediationWizard/steps/Finish.js
index 67153220..0533866f 100644
--- a/webpack/components/OpenscapRemediationWizard/steps/Finish.js
+++ b/webpack/components/OpenscapRemediationWizard/steps/Finish.js
@@ -74,6 +74,7 @@ const Finish = ({ onClose }) => {
 
   const linkToJob = (
     <Button
+      ouiaId="oscap-rem-wiz-job-details-link"
       variant="link"
       icon={<ExternalLinkSquareAltIcon />}
       iconPosition="right"
@@ -84,7 +85,11 @@ const Finish = ({ onClose }) => {
       {__('Job details')}
     </Button>
   );
-  const closeBtn = <Button onClick={onClose}>{__('Close')}</Button>;
+  const closeBtn = (
+    <Button ouiaId="oscap-rem-wiz-close-button-fin-step" onClick={onClose}>
+      {__('Close')}
+    </Button>
+  );
   const errorComponent =
     statusCode === 403 ? (
       <PermissionDenied
diff --git a/webpack/components/OpenscapRemediationWizard/steps/ReviewHosts.js b/webpack/components/OpenscapRemediationWizard/steps/ReviewHosts.js
index 4f06e304..24a247aa 100644
--- a/webpack/components/OpenscapRemediationWizard/steps/ReviewHosts.js
+++ b/webpack/components/OpenscapRemediationWizard/steps/ReviewHosts.js
@@ -166,6 +166,7 @@ const ReviewHosts = () => {
       title: __('Name'),
       wrapper: ({ name, display_name: displayName }) => (
         <Button
+          ouiaId={`oscap-rem-wiz-ext-link-to-host-${name}-revhst-step`}
           component="a"
           variant="link"
           target="_blank"
diff --git a/webpack/components/OpenscapRemediationWizard/steps/ReviewRemediation.js b/webpack/components/OpenscapRemediationWizard/steps/ReviewRemediation.js
index 3c1c24f2..065984e4 100644
--- a/webpack/components/OpenscapRemediationWizard/steps/ReviewRemediation.js
+++ b/webpack/components/OpenscapRemediationWizard/steps/ReviewRemediation.js
@@ -118,6 +118,7 @@ const ReviewRemediation = () => {
         </GridItem>
         <GridItem md={12} span={4} rowSpan={1}>
           <Button
+            ouiaId={`oscap-wiz-host-details-button-${hostName}-revrem-step`}
             variant="link"
             icon={<ExternalLinkSquareAltIcon />}
             iconPosition="right"
@@ -130,6 +131,7 @@ const ReviewRemediation = () => {
         </GridItem>
         <GridItem md={12} span={8} rowSpan={1}>
           <Button
+            ouiaId={`oscap-wiz-ext-link-to-hosts-${source}-revrem-step`}
             variant="link"
             icon={<ExternalLinkSquareAltIcon />}
             iconPosition="right"
@@ -154,6 +156,7 @@ const ReviewRemediation = () => {
             {method === 'manual' ? null : (
               <GridItem span={4} rowSpan={1}>
                 <Checkbox
+                  ouiaId="oscap-wiz-reboot-checkbox-revrem-step"
                   id="reboot-checkbox"
                   label={__('Reboot the system(s)')}
                   name="reboot-checkbox"

From 720e495f6644d28d19667718d7529ba95437fc7e Mon Sep 17 00:00:00 2001
From: Oleh Fedorenko <ofedoren@redhat.com>
Date: Tue, 2 Jul 2024 13:38:16 +0000
Subject: [PATCH 2/4] Refs #37619 - Add eslint rule to alert missing ouia-ids

---
 .eslintrc                      | 15 ++++++++++++---
 .github/workflows/js_tests.yml | 21 +++++++++++++++++++++
 package.json                   |  2 ++
 3 files changed, 35 insertions(+), 3 deletions(-)

diff --git a/.eslintrc b/.eslintrc
index 9befa521..7d2933ad 100644
--- a/.eslintrc
+++ b/.eslintrc
@@ -1,4 +1,13 @@
 {
-  "plugins": ["@theforeman/foreman"],
-  "extends": ["plugin:@theforeman/foreman/core", "plugin:@theforeman/foreman/plugins"]
-}
\ No newline at end of file
+  "plugins": [
+    "@theforeman/foreman",
+    "@theforeman/rules"
+  ],
+  "extends": [
+    "plugin:@theforeman/foreman/core",
+    "plugin:@theforeman/foreman/plugins"
+  ],
+  "rules":{
+    "@theforeman/rules/require-ouiaid": ["error"]
+  }
+}
diff --git a/.github/workflows/js_tests.yml b/.github/workflows/js_tests.yml
index 78543f77..050e7f3c 100644
--- a/.github/workflows/js_tests.yml
+++ b/.github/workflows/js_tests.yml
@@ -12,6 +12,27 @@ concurrency:
   cancel-in-progress: true
 
 jobs:
+  lint_custom:
+    runs-on: ubuntu-latest
+    strategy:
+      fail-fast: false
+      matrix:
+        node-version: [14]
+    steps:
+      - uses: actions/checkout@v2
+      - name: Setup Node
+        uses: actions/setup-node@v1
+        with:
+          node-version:  ${{ matrix.node-version }}
+      - name: Npm install
+        run: |
+          npm install
+      - name: Run plugin linter
+        run: |
+          npm run lint
+      - name: Run custom plugin linter
+        run: |
+          npm run lint:custom
   test:
     name: JavaScript
     uses: theforeman/actions/.github/workflows/foreman_plugin_js.yml@v0
diff --git a/package.json b/package.json
index 11db63ca..00bf1646 100644
--- a/package.json
+++ b/package.json
@@ -5,6 +5,7 @@
   "main": "index.js",
   "scripts": {
     "lint": "tfm-lint --plugin -d /webpack",
+    "lint:custom": "eslint ./webpack",
     "test": "tfm-test --plugin --config jest.config.js",
     "test:watch": "tfm-test --plugin --watchAll --config jest.config.js",
     "test:current": "tfm-test --plugin --watch --config jest.config.js",
@@ -28,6 +29,7 @@
     "@testing-library/user-event": "^13.2.1",
     "@theforeman/builder": ">= 10.1.0",
     "@theforeman/eslint-plugin-foreman": ">= 10.1.0",
+    "@theforeman/eslint-plugin-rules": ">= 10.1.0",
     "@theforeman/find-foreman": ">= 10.1.0",
     "@theforeman/test": ">= 10.1.0",
     "@theforeman/vendor-dev": ">= 10.1.0",

From 411ab70e7858aa32bc2631ae0bd684c791e272cf Mon Sep 17 00:00:00 2001
From: Oleh Fedorenko <ofedoren@redhat.com>
Date: Tue, 2 Jul 2024 14:37:18 +0000
Subject: [PATCH 3/4] Refs #37619 - Additional ouia/lint fixes

---
 webpack/components/ConfirmModal.js                 |  3 +++
 webpack/components/EditableInput.js                |  3 +++
 webpack/components/EmptyState.js                   | 14 ++++++++++++--
 webpack/components/IndexLayout.js                  |  4 +++-
 webpack/components/IndexTable/index.js             |  3 +++
 webpack/components/LinkButton.js                   |  4 ++++
 .../OpenscapRemediationWizard/steps/Finish.js      |  2 ++
 .../steps/SnippetSelect.js                         |  7 ++++++-
 webpack/helpers/formFieldsHelper.js                |  1 +
 9 files changed, 37 insertions(+), 4 deletions(-)

diff --git a/webpack/components/ConfirmModal.js b/webpack/components/ConfirmModal.js
index e02bacc0..81f98f11 100644
--- a/webpack/components/ConfirmModal.js
+++ b/webpack/components/ConfirmModal.js
@@ -11,6 +11,7 @@ const ConfirmModal = props => {
 
   const actions = [
     <Button
+      ouiaId={`oscap-conf-modal-${props.record.id}-confirm`}
       key="confirm"
       variant="primary"
       onClick={() => props.onConfirm(callMutation, props.record.id)}
@@ -19,6 +20,7 @@ const ConfirmModal = props => {
       {__('Confirm')}
     </Button>,
     <Button
+      ouiaId={`oscap-conf-modal-${props.record.id}-cancel`}
       key="cancel"
       variant="link"
       onClick={event => props.onClose()}
@@ -34,6 +36,7 @@ const ConfirmModal = props => {
 
   return (
     <Modal
+      ouiaId={`oscap-conf-modal-${props.record.id}`}
       variant={ModalVariant.medium}
       title={props.title}
       isOpen={props.isOpen}
diff --git a/webpack/components/EditableInput.js b/webpack/components/EditableInput.js
index 560f1f2e..4c1ddcaf 100644
--- a/webpack/components/EditableInput.js
+++ b/webpack/components/EditableInput.js
@@ -62,6 +62,7 @@ const EditableInput = props => {
   const editBtn = (
     <SplitItem>
       <Button
+        ouiaId={`oscap-edit-${props.attrName}-edit-button`}
         className="inline-edit-icon"
         aria-label={`edit ${props.attrName}`}
         variant="plain"
@@ -115,6 +116,7 @@ const EditableInput = props => {
       </SplitItem>
       <SplitItem>
         <Button
+          ouiaId={`oscap-edit-${props.attrName}-submit-button`}
           aria-label={`submit ${props.attrName}`}
           variant="plain"
           onClick={onSubmit}
@@ -125,6 +127,7 @@ const EditableInput = props => {
       </SplitItem>
       <SplitItem>
         <Button
+          ouiaId={`oscap-edit-${props.attrName}-cancel-button`}
           aria-label={`cancel editing ${props.attrName}`}
           variant="plain"
           onClick={onCancel}
diff --git a/webpack/components/EmptyState.js b/webpack/components/EmptyState.js
index fc7fda8b..be7cfed1 100644
--- a/webpack/components/EmptyState.js
+++ b/webpack/components/EmptyState.js
@@ -29,11 +29,19 @@ const EmptyStateIcon = ({ error, search, lock }) => {
   return <PfEmptyStateIcon icon={CubeIcon} />;
 };
 
-const EmptyState = ({ title, body, error, search, lock, primaryButton }) => (
+const EmptyState = ({
+  title,
+  body,
+  error,
+  search,
+  lock,
+  primaryButton,
+  ouiaEmptyStateTitleId,
+}) => (
   <Bullseye>
     <PfEmptyState variant={EmptyStateVariant.small}>
       <EmptyStateIcon error={!!error} search={search} lock={lock} />
-      <Title headingLevel="h2" size="lg">
+      <Title ouiaId={ouiaEmptyStateTitleId} headingLevel="h2" size="lg">
         {title}
       </Title>
       <EmptyStateBody>{body}</EmptyStateBody>
@@ -65,6 +73,7 @@ EmptyState.propTypes = {
   search: PropTypes.bool,
   lock: PropTypes.bool,
   primaryButton: PropTypes.node,
+  ouiaEmptyStateTitleId: PropTypes.string,
 };
 
 EmptyState.defaultProps = {
@@ -75,6 +84,7 @@ EmptyState.defaultProps = {
   search: false,
   lock: false,
   primaryButton: null,
+  ouiaEmptyStateTitleId: 'oscap-empty-state-title',
 };
 
 export default EmptyState;
diff --git a/webpack/components/IndexLayout.js b/webpack/components/IndexLayout.js
index 3a998d86..e2057601 100644
--- a/webpack/components/IndexLayout.js
+++ b/webpack/components/IndexLayout.js
@@ -21,7 +21,9 @@ const IndexLayout = ({ pageTitle, children, contentWidthSpan }) => (
     <Grid className="scap-page-grid">
       <GridItem span={12} className="pf-u-pb-xl">
         <TextContent>
-          <Text component={TextVariants.h1}>{pageTitle}</Text>
+          <Text ouiaId="oscap-index-title" component={TextVariants.h1}>
+            {pageTitle}
+          </Text>
         </TextContent>
       </GridItem>
       <GridItem span={contentWidthSpan}>{children}</GridItem>
diff --git a/webpack/components/IndexTable/index.js b/webpack/components/IndexTable/index.js
index 4e679074..f96d8fa6 100644
--- a/webpack/components/IndexTable/index.js
+++ b/webpack/components/IndexTable/index.js
@@ -11,6 +11,7 @@ const IndexTable = ({
   totalCount,
   toolbarBtns,
   ariaTableLabel,
+  ouiaTableId,
   columns,
   ...rest
 }) => {
@@ -38,6 +39,7 @@ const IndexTable = ({
         </FlexItem>
       </Flex>
       <Table
+        ouiaId={ouiaTableId}
         aria-label={ariaTableLabel}
         cells={columns}
         {...rest}
@@ -56,6 +58,7 @@ IndexTable.propTypes = {
   toolbarBtns: PropTypes.node,
   totalCount: PropTypes.number.isRequired,
   ariaTableLabel: PropTypes.string.isRequired,
+  ouiaTableId: PropTypes.string.isRequired,
   columns: PropTypes.array.isRequired,
 };
 
diff --git a/webpack/components/LinkButton.js b/webpack/components/LinkButton.js
index f6692f63..8978e52f 100644
--- a/webpack/components/LinkButton.js
+++ b/webpack/components/LinkButton.js
@@ -9,9 +9,11 @@ const LinkButton = ({
   btnText,
   isDisabled,
   btnAriaLabel,
+  ouiaId,
 }) => (
   <Link to={path}>
     <Button
+      ouiaId={ouiaId}
       variant={btnVariant}
       isDisabled={isDisabled}
       aria-label={btnAriaLabel}
@@ -27,12 +29,14 @@ LinkButton.propTypes = {
   btnVariant: PropTypes.string,
   isDisabled: PropTypes.bool,
   btnAriaLabel: PropTypes.string,
+  ouiaId: PropTypes.string,
 };
 
 LinkButton.defaultProps = {
   btnVariant: 'primary',
   isDisabled: false,
   btnAriaLabel: null,
+  ouiaId: 'oscap-link-button',
 };
 
 export default LinkButton;
diff --git a/webpack/components/OpenscapRemediationWizard/steps/Finish.js b/webpack/components/OpenscapRemediationWizard/steps/Finish.js
index 0533866f..30451c6a 100644
--- a/webpack/components/OpenscapRemediationWizard/steps/Finish.js
+++ b/webpack/components/OpenscapRemediationWizard/steps/Finish.js
@@ -98,6 +98,7 @@ const Finish = ({ onClose }) => {
       />
     ) : (
       <EmptyState
+        ouiaEmptyStateTitleId="oscap-rem-wiz-empty-state-title"
         error
         title={__('Error!')}
         body={errorMsg(data)}
@@ -107,6 +108,7 @@ const Finish = ({ onClose }) => {
   const body =
     status === STATUS.RESOLVED ? (
       <EmptyState
+        ouiaEmptyStateTitleId="oscap-rem-wiz-empty-state-title"
         title={__(
           'The job has started on selected host(s), you can check the status on the job details page.'
         )}
diff --git a/webpack/components/OpenscapRemediationWizard/steps/SnippetSelect.js b/webpack/components/OpenscapRemediationWizard/steps/SnippetSelect.js
index 0e040a9b..e70af826 100644
--- a/webpack/components/OpenscapRemediationWizard/steps/SnippetSelect.js
+++ b/webpack/components/OpenscapRemediationWizard/steps/SnippetSelect.js
@@ -141,7 +141,12 @@ const SnippetSelect = () => {
         )}
       </Form>
     ) : (
-      <EmptyState error title={__('Error!')} body={errorMsg(logError)} />
+      <EmptyState
+        ouiaEmptyStateTitleId="oscap-rem-wiz-empty-state-title"
+        error
+        title={__('Error!')}
+        body={errorMsg(logError)}
+      />
     );
 
   return (
diff --git a/webpack/helpers/formFieldsHelper.js b/webpack/helpers/formFieldsHelper.js
index 42daa667..fd830f38 100644
--- a/webpack/helpers/formFieldsHelper.js
+++ b/webpack/helpers/formFieldsHelper.js
@@ -25,6 +25,7 @@ export const SelectField = props => {
       validated={valid}
     >
       <FormSelect
+        ouiaId={`oscap-form-sel-${field.name}`}
         {...fieldProps}
         className="without_select2"
         aria-label={fieldProps.name}

From e2491834f0dc3fbd88d09a98b847b1176c48068b Mon Sep 17 00:00:00 2001
From: Oleh Fedorenko <ofedoren@redhat.com>
Date: Thu, 4 Jul 2024 11:35:15 +0000
Subject: [PATCH 4/4] Refs #37619 - Apply review suggestions

---
 .github/workflows/js_tests.yml     | 3 ---
 webpack/components/ConfirmModal.js | 6 +++---
 2 files changed, 3 insertions(+), 6 deletions(-)

diff --git a/.github/workflows/js_tests.yml b/.github/workflows/js_tests.yml
index 050e7f3c..83e43053 100644
--- a/.github/workflows/js_tests.yml
+++ b/.github/workflows/js_tests.yml
@@ -27,9 +27,6 @@ jobs:
       - name: Npm install
         run: |
           npm install
-      - name: Run plugin linter
-        run: |
-          npm run lint
       - name: Run custom plugin linter
         run: |
           npm run lint:custom
diff --git a/webpack/components/ConfirmModal.js b/webpack/components/ConfirmModal.js
index 81f98f11..8a35927a 100644
--- a/webpack/components/ConfirmModal.js
+++ b/webpack/components/ConfirmModal.js
@@ -11,7 +11,7 @@ const ConfirmModal = props => {
 
   const actions = [
     <Button
-      ouiaId={`oscap-conf-modal-${props.record.id}-confirm`}
+      ouiaId={`oscap-conf-modal-${props.record?.id}-confirm`}
       key="confirm"
       variant="primary"
       onClick={() => props.onConfirm(callMutation, props.record.id)}
@@ -20,7 +20,7 @@ const ConfirmModal = props => {
       {__('Confirm')}
     </Button>,
     <Button
-      ouiaId={`oscap-conf-modal-${props.record.id}-cancel`}
+      ouiaId={`oscap-conf-modal-${props.record?.id}-cancel`}
       key="cancel"
       variant="link"
       onClick={event => props.onClose()}
@@ -36,7 +36,7 @@ const ConfirmModal = props => {
 
   return (
     <Modal
-      ouiaId={`oscap-conf-modal-${props.record.id}`}
+      ouiaId={`oscap-conf-modal-${props.record?.id}`}
       variant={ModalVariant.medium}
       title={props.title}
       isOpen={props.isOpen}