Merge pull request #9637 from mabashian/ouiaids

Adds ouiaId's to various buttons

SUMMARY
@tiagodread @unlikelyzero @one-t @akus062381 this will likely break something because I changed some existing ouia-id's so that they are a consistent structure.
^^ Let's let one of them merge this
I also removed an unused component

Reviewed-by: Jake McDermott <yo@jakemcdermott.me>
Reviewed-by: John Hill <johill@redhat.com>

awx/ui_next/src/components/AdHocCommands/AdHocCommands.jsx

@@ -128,6 +128,7 @@ function AdHocCommands({ adHocItems, i18n, hasListItems }) {
         </DropdownItem>
       ) : (
         <Button
+          ouiaId="run-command-button"
           variant="secondary"
           aria-label={i18n._(t`Run Command`)}
           onClick={() => setIsWizardOpen(true)}

awx/ui_next/src/components/AssociateModal/AssociateModal.jsx

@@ -101,6 +101,7 @@ function AssociateModal({
         onClose={handleClose}
         actions={[
           <Button
+            ouiaId="associate-modal-save"
             aria-label={i18n._(t`Save`)}
             key="select"
             variant="primary"
@@ -110,6 +111,7 @@ function AssociateModal({
             {i18n._(t`Save`)}
           </Button>,
           <Button
+            ouiaId="associate-modal-cancel"
             aria-label={i18n._(t`Cancel`)}
             key="cancel"
             variant="link"

awx/ui_next/src/components/ClipboardCopyButton/ClipboardCopyButton.jsx

@@ -46,6 +46,7 @@ class ClipboardCopyButton extends React.Component {
       exitDelay,
       copiedSuccessTip,
       isDisabled,
+      ouiaId,
     } = this.props;
     const { copied } = this.state;
 
@@ -57,6 +58,7 @@ class ClipboardCopyButton extends React.Component {
         content={copied ? copiedSuccessTip : copyTip}
       >
         <Button
+          ouiaId={ouiaId}
           isDisabled={isDisabled}
           variant="plain"
           onClick={this.handleCopyClick}

awx/ui_next/src/components/CollapsibleSection/CollapsibleSection.jsx

@@ -1,58 +0,0 @@
-import React, { useState } from 'react';
-import { bool, string } from 'prop-types';
-import styled from 'styled-components';
-import { Button } from '@patternfly/react-core';
-import { AngleRightIcon } from '@patternfly/react-icons';
-import omitProps from '../../util/omitProps';
-import ExpandingContainer from './ExpandingContainer';
-
-// Make button findable by tests
-Button.displayName = 'Button';
-
-const Toggle = styled.div`
-  display: flex;
-
-  hr {
-    margin-left: 20px;
-    flex: 1 1 auto;
-    align-self: center;
-    border: 0;
-    border-bottom: 1px solid var(--pf-global--BorderColor--300);
-  }
-`;
-
-const Arrow = styled(omitProps(AngleRightIcon, 'isExpanded'))`
-  margin-right: -5px;
-  margin-left: 5px;
-  transition: transform 0.1s ease-out;
-  transform-origin: 50% 50%;
-  ${props => props.isExpanded && `transform: rotate(90deg);`}
-`;
-
-function CollapsibleSection({ label, startExpanded, children }) {
-  const [isExpanded, setIsExpanded] = useState(startExpanded);
-  const toggle = () => setIsExpanded(!isExpanded);
-
-  return (
-    <div>
-      <Toggle>
-        <Button onClick={toggle}>
-          {label} <Arrow isExpanded={isExpanded} />
-        </Button>
-        <hr />
-      </Toggle>
-      <ExpandingContainer isExpanded={isExpanded}>
-        {children}
-      </ExpandingContainer>
-    </div>
-  );
-}
-CollapsibleSection.propTypes = {
-  label: string.isRequired,
-  startExpanded: bool,
-};
-CollapsibleSection.defaultProps = {
-  startExpanded: false,
-};
-
-export default CollapsibleSection;

awx/ui_next/src/components/CollapsibleSection/CollapsibleSection.test.jsx

@@ -1,26 +0,0 @@
-import React from 'react';
-import { shallow } from 'enzyme';
-import CollapsibleSection from './CollapsibleSection';
-
-describe('<CollapsibleSection>', () => {
-  it('should render contents', () => {
-    const wrapper = shallow(
-      <CollapsibleSection label="Advanced">foo</CollapsibleSection>
-    );
-    expect(wrapper.find('Button > *').prop('isExpanded')).toEqual(false);
-    expect(wrapper.find('ExpandingContainer').prop('isExpanded')).toEqual(
-      false
-    );
-    expect(wrapper.find('ExpandingContainer').prop('children')).toEqual('foo');
-  });
-
-  it('should toggle when clicked', () => {
-    const wrapper = shallow(
-      <CollapsibleSection label="Advanced">foo</CollapsibleSection>
-    );
-    expect(wrapper.find('Button > *').prop('isExpanded')).toEqual(false);
-    wrapper.find('Button').simulate('click');
-    expect(wrapper.find('Button > *').prop('isExpanded')).toEqual(true);
-    expect(wrapper.find('ExpandingContainer').prop('isExpanded')).toEqual(true);
-  });
-});

awx/ui_next/src/components/CollapsibleSection/ExpandingContainer.jsx

@@ -1,44 +0,0 @@
-import 'styled-components/macro';
-import React, { useState, useEffect, useRef } from 'react';
-import { bool } from 'prop-types';
-import styled from 'styled-components';
-
-const Container = styled.div`
-  margin: 15px 0;
-  transition: height 0.2s ease-out;
-  ${props => props.hideOverflow && `overflow: hidden;`}
-`;
-
-function ExpandingContainer({ isExpanded, children }) {
-  const [contentHeight, setContentHeight] = useState(0);
-  const [hideOverflow, setHideOverflow] = useState(!isExpanded);
-  const ref = useRef(null);
-  useEffect(() => {
-    ref.current.addEventListener('transitionend', () => {
-      setHideOverflow(!isExpanded);
-    });
-  });
-  useEffect(() => {
-    setContentHeight(ref.current.scrollHeight);
-  }, [setContentHeight, children]);
-  const height = isExpanded ? contentHeight : '0';
-  return (
-    <Container
-      ref={ref}
-      css={`
-        height: ${height}px;
-      `}
-      hideOverflow={!isExpanded || hideOverflow}
-    >
-      {children}
-    </Container>
-  );
-}
-ExpandingContainer.propTypes = {
-  isExpanded: bool,
-};
-ExpandingContainer.defaultProps = {
-  isExpanded: false,
-};
-
-export default ExpandingContainer;

awx/ui_next/src/components/CollapsibleSection/index.js

@@ -1 +0,0 @@
-export { default } from './CollapsibleSection';

awx/ui_next/src/components/DeleteButton/DeleteButton.jsx

@@ -35,6 +35,7 @@ function DeleteButton({
         onClose={() => setIsOpen(false)}
         actions={[
           <Button
+            ouiaId="delete-modal-confirm"
             key="delete"
             variant="danger"
             aria-label={i18n._(t`Delete`)}
@@ -44,6 +45,7 @@ function DeleteButton({
             {i18n._(t`Delete`)}
           </Button>,
           <Button
+            ouiaId="delete-modal-cancel"
             key="cancel"
             variant="link"
             aria-label={i18n._(t`Cancel`)}

awx/ui_next/src/components/DisassociateButton/DisassociateButton.jsx

@@ -90,6 +90,7 @@ function DisassociateButton({
         <Tooltip content={renderTooltip()} position="top">
           <div>
             <Button
+              ouiaId="disassociate-button"
               variant="secondary"
               aria-label={i18n._(t`Disassociate`)}
               onClick={() => setIsOpen(true)}
@@ -109,6 +110,7 @@ function DisassociateButton({
           onClose={() => setIsOpen(false)}
           actions={[
             <Button
+              ouiaId="disassociate-modal-confirm"
               key="disassociate"
               variant="danger"
               aria-label={i18n._(t`confirm disassociate`)}
@@ -117,6 +119,7 @@ function DisassociateButton({
               {i18n._(t`Disassociate`)}
             </Button>,
             <Button
+              ouiaId="disassociate-modal-cancel"
               key="cancel"
               variant="link"
               aria-label={i18n._(t`Cancel`)}

awx/ui_next/src/components/ExpandCollapse/ExpandCollapse.jsx

@@ -36,6 +36,7 @@ function ExpandCollapse({ isCompact, onCompact, onExpand, i18n }) {
     <Fragment>
       <ToolbarItem>
         <Button
+          ouiaId="toolbar-collapse-button"
           variant="plain"
           aria-label={i18n._(t`Collapse`)}
           onClick={onCompact}
@@ -46,6 +47,7 @@ function ExpandCollapse({ isCompact, onCompact, onExpand, i18n }) {
       </ToolbarItem>
       <ToolbarItem>
         <Button
+          ouiaId="toolbar-expand-button"
           variant="plain"
           aria-label={i18n._(t`Expand`)}
           onClick={onExpand}

awx/ui_next/src/components/FormActionGroup/FormActionGroup.jsx

@@ -10,7 +10,7 @@ const FormActionGroup = ({ onCancel, onSubmit, submitDisabled, i18n }) => {
     <FormFullWidthLayout>
       <ActionGroup>
         <Button
-          ouiaId="Save"
+          ouiaId="form-save-button"
           aria-label={i18n._(t`Save`)}
           variant="primary"
           type="button"
@@ -20,7 +20,7 @@ const FormActionGroup = ({ onCancel, onSubmit, submitDisabled, i18n }) => {
           {i18n._(t`Save`)}
         </Button>
         <Button
-          ouiaId="Cancel"
+          ouiaId="form-cancel-button"
           aria-label={i18n._(t`Cancel`)}
           variant="link"
           type="button"

awx/ui_next/src/components/FormField/PasswordInput.jsx

@@ -36,6 +36,7 @@ function PasswordInput(props) {
         content={inputType === 'password' ? i18n._(t`Show`) : i18n._(t`Hide`)}
       >
         <Button
+          ouiaId={`${id}-toggle`}
           variant={ButtonVariant.control}
           aria-label={i18n._(t`Toggle Password`)}
           onClick={handlePasswordToggle}

awx/ui_next/src/components/JobList/JobListCancelButton.jsx

@@ -115,6 +115,7 @@ function JobListCancelButton({ i18n, jobsToCancel, onCancel }) {
         <Tooltip content={renderTooltip()} position="top">
           <div>
             <Button
+              ouiaId="cancel-job-button"
               variant="secondary"
               aria-label={cancelJobText}
               onClick={toggleModal}
@@ -133,6 +134,7 @@ function JobListCancelButton({ i18n, jobsToCancel, onCancel }) {
           onClose={toggleModal}
           actions={[
             <Button
+              ouiaId="cancel-job-confirm-button"
               id="cancel-job-confirm-button"
               key="delete"
               variant="danger"
@@ -142,6 +144,7 @@ function JobListCancelButton({ i18n, jobsToCancel, onCancel }) {
               {cancelJobText}
             </Button>,
             <Button
+              ouiaId="cancel-job-return-button"
               id="cancel-job-return-button"
               key="cancel"
               variant="secondary"

awx/ui_next/src/components/JobList/JobListItem.jsx

@@ -99,6 +99,7 @@ function JobListItem({
               <LaunchButton resource={job}>
                 {({ handleRelaunch }) => (
                   <Button
+                    ouiaId={`${job.id}-relaunch-button`}
                     variant="plain"
                     onClick={handleRelaunch}
                     aria-label={i18n._(t`Relaunch`)}

awx/ui_next/src/components/LaunchButton/ReLaunchDropDown.jsx

@@ -54,6 +54,7 @@ function ReLaunchDropDown({ isPrimary = false, handleRelaunch, i18n, ouiaId }) {
   if (isPrimary) {
     return (
       <Dropdown
+        ouiaId={ouiaId}
         position={DropdownPosition.left}
         direction={DropdownDirection.up}
         isOpen={isOpen}

awx/ui_next/src/components/Lookup/HostFilterLookup.jsx

@@ -247,6 +247,7 @@ function HostFilterLookup({
   const renderLookup = () => (
     <InputGroup onBlur={onBlur}>
       <Button
+        ouiaId="host-filter-search-button"
         aria-label={i18n._(t`Search`)}
         id="host-filter"
         isDisabled={isDisabled}
@@ -311,6 +312,7 @@ function HostFilterLookup({
         variant="large"
         actions={[
           <Button
+            ouiaId="host-filter-modal-select-button"
             isDisabled={!location.search}
             key="select"
             onClick={save}
@@ -318,7 +320,12 @@ function HostFilterLookup({
           >
             {i18n._(t`Select`)}
           </Button>,
-          <Button key="cancel" variant="link" onClick={handleClose}>
+          <Button
+            ouiaId="host-filter-modal-cancel-button"
+            key="cancel"
+            variant="link"
+            onClick={handleClose}
+          >
             {i18n._(t`Cancel`)}
           </Button>,
         ]}

awx/ui_next/src/components/ResourceAccessList/DeleteRoleConfirmationModal.jsx

@@ -29,6 +29,7 @@ function DeleteRoleConfirmationModal({
       onClose={onCancel}
       actions={[
         <Button
+          ouiaId="delete-role-modal-delete-button"
           key="delete"
           variant="danger"
           aria-label={i18n._(t`Confirm delete`)}
@@ -36,7 +37,12 @@ function DeleteRoleConfirmationModal({
         >
           {i18n._(t`Delete`)}
         </Button>,
-        <Button key="cancel" variant="link" onClick={onCancel}>
+        <Button
+          ouiaId="delete-role-modal-cancel-button"
+          key="cancel"
+          variant="link"
+          onClick={onCancel}
+        >
           {i18n._(t`Cancel`)}
         </Button>,
       ]}

awx/ui_next/src/components/ResourceAccessList/__snapshots__/DeleteRoleConfirmationModal.test.jsx.snap

@@ -23,12 +23,14 @@ exports[`<DeleteRoleConfirmationModal /> should render initially 1`] = `
         <Button
           aria-label="Confirm delete"
           onClick={[Function]}
+          ouiaId="delete-role-modal-delete-button"
           variant="danger"
         >
           Delete
         </Button>,
         <Button
           onClick={[Function]}
+          ouiaId="delete-role-modal-cancel-button"
           variant="link"
         >
           Cancel
@@ -50,12 +52,14 @@ exports[`<DeleteRoleConfirmationModal /> should render initially 1`] = `
             <Button
               aria-label="Confirm delete"
               onClick={[Function]}
+              ouiaId="delete-role-modal-delete-button"
               variant="danger"
             >
               Delete
             </Button>,
             <Button
               onClick={[Function]}
+              ouiaId="delete-role-modal-cancel-button"
               variant="link"
             >
               Cancel
@@ -74,12 +78,14 @@ exports[`<DeleteRoleConfirmationModal /> should render initially 1`] = `
               <Button
                 aria-label="Confirm delete"
                 onClick={[Function]}
+                ouiaId="delete-role-modal-delete-button"
                 variant="danger"
               >
                 Delete
               </Button>,
               <Button
                 onClick={[Function]}
+                ouiaId="delete-role-modal-cancel-button"
                 variant="link"
               >
                 Cancel
@@ -203,7 +209,7 @@ exports[`<DeleteRoleConfirmationModal /> should render initially 1`] = `
                           aria-disabled="false"
                           aria-label="Confirm delete"
                           class="pf-c-button pf-m-danger"
-                          data-ouia-component-id="OUIA-Generated-Button-danger-1"
+                          data-ouia-component-id="delete-role-modal-delete-button"
                           data-ouia-component-type="PF4/Button"
                           data-ouia-safe="true"
                           type="button"
@@ -213,7 +219,7 @@ exports[`<DeleteRoleConfirmationModal /> should render initially 1`] = `
                         <button
                           aria-disabled="false"
                           class="pf-c-button pf-m-link"
-                          data-ouia-component-id="OUIA-Generated-Button-link-1"
+                          data-ouia-component-id="delete-role-modal-cancel-button"
                           data-ouia-component-type="PF4/Button"
                           data-ouia-safe="true"
                           type="button"
@@ -233,12 +239,14 @@ exports[`<DeleteRoleConfirmationModal /> should render initially 1`] = `
                   <Button
                     aria-label="Confirm delete"
                     onClick={[Function]}
+                    ouiaId="delete-role-modal-delete-button"
                     variant="danger"
                   >
                     Delete
                   </Button>,
                   <Button
                     onClick={[Function]}
+                    ouiaId="delete-role-modal-cancel-button"
                     variant="link"
                   >
                     Cancel
@@ -498,13 +506,14 @@ exports[`<DeleteRoleConfirmationModal /> should render initially 1`] = `
                                 aria-label="Confirm delete"
                                 key="delete"
                                 onClick={[Function]}
+                                ouiaId="delete-role-modal-delete-button"
                                 variant="danger"
                               >
                                 <button
                                   aria-disabled={false}
                                   aria-label="Confirm delete"
                                   className="pf-c-button pf-m-danger"
-                                  data-ouia-component-id="OUIA-Generated-Button-danger-1"
+                                  data-ouia-component-id="delete-role-modal-delete-button"
                                   data-ouia-component-type="PF4/Button"
                                   data-ouia-safe={true}
                                   disabled={false}
@@ -518,13 +527,14 @@ exports[`<DeleteRoleConfirmationModal /> should render initially 1`] = `
                               <Button
                                 key="cancel"
                                 onClick={[Function]}
+                                ouiaId="delete-role-modal-cancel-button"
                                 variant="link"
                               >
                                 <button
                                   aria-disabled={false}
                                   aria-label={null}
                                   className="pf-c-button pf-m-link"
-                                  data-ouia-component-id="OUIA-Generated-Button-link-1"
+                                  data-ouia-component-id="delete-role-modal-cancel-button"
                                   data-ouia-component-type="PF4/Button"
                                   data-ouia-safe={true}
                                   disabled={false}

awx/ui_next/src/components/Schedule/ScheduleDetail/ScheduleDetail.jsx

@@ -393,6 +393,7 @@ function ScheduleDetail({ hasDaysToKeepField, schedule, i18n, surveyConfig }) {
       <CardActionsRow>
         {summary_fields?.user_capabilities?.edit && (
           <Button
+            ouiaId="schedule-detail-edit-button"
             aria-label={i18n._(t`Edit`)}
             component={Link}
             to={pathname.replace('details', 'edit')}

awx/ui_next/src/components/Schedule/ScheduleList/ScheduleListItem.jsx

@@ -116,6 +116,7 @@ function ScheduleListItem({
           tooltip={i18n._(t`Edit Schedule`)}
         >
           <Button
+            ouiaId={`${schedule.id}-edit-button`}
             aria-label={i18n._(t`Edit Schedule`)}
             css="grid-column: 2"
             variant="plain"

awx/ui_next/src/components/Schedule/shared/ScheduleForm.jsx

@@ -541,6 +541,7 @@ function ScheduleForm({
                   <FormFullWidthLayout>
                     <ActionGroup>
                       <Button
+                        ouiaId="schedule-form-save-button"
                         aria-label={i18n._(t`Save`)}
                         variant="primary"
                         type="button"
@@ -552,6 +553,7 @@ function ScheduleForm({
 
                       {isTemplate && showPromptButton && (
                         <Button
+                          ouiaId="schedule-form-prompt-button"
                           variant="secondary"
                           type="button"
                           aria-label={i18n._(t`Prompt`)}
@@ -561,6 +563,7 @@ function ScheduleForm({
                         </Button>
                       )}
                       <Button
+                        ouiaId="schedule-form-cancel-button"
                         aria-label={i18n._(t`Cancel`)}
                         variant="secondary"
                         type="button"

awx/ui_next/src/components/ScreenHeader/ScreenHeader.jsx

@@ -53,6 +53,7 @@ const ScreenHeader = ({ breadcrumbConfig, i18n, streamType }) => {
           <div>
             <Tooltip content={i18n._(t`View activity stream`)} position="top">
               <Button
+                ouiaId="activity-stream-button"
                 aria-label={i18n._(t`View activity stream`)}
                 variant="plain"
                 component={Link}

awx/ui_next/src/components/TemplateList/TemplateListItem.jsx

@@ -159,6 +159,7 @@ function TemplateListItem({
             tooltip={i18n._(t`Visualizer`)}
           >
             <Button
+              ouiaId={`${template.id}-visualizer-button`}
               id={`template-action-visualizer-${template.id}`}
               isDisabled={isDisabled}
               aria-label={i18n._(t`Visualizer`)}
@@ -176,6 +177,7 @@ function TemplateListItem({
             <LaunchButton resource={template}>
               {({ handleLaunch }) => (
                 <Button
+                  ouiaId={`${template.id}-launch-button`}
                   id={`template-action-launch-${template.id}`}
                   isDisabled={isDisabled}
                   aria-label={i18n._(t`Launch template`)}
@@ -192,6 +194,7 @@ function TemplateListItem({
             tooltip={i18n._(t`Edit Template`)}
           >
             <Button
+              ouiaId={`${template.id}-edit-button`}
               id={`template-action-edit-${template.id}`}
               isDisabled={isDisabled}
               aria-label={i18n._(t`Edit Template`)}

awx/ui_next/src/components/UserAndTeamAccessAdd/UserAndTeamAccessAdd.jsx

@@ -156,6 +156,7 @@ function UserAndTeamAccessAdd({ i18n, title, onFetchData, apiModel }) {
         </DropdownItem>
       ) : (
         <Button
+          ouiaId="access-add-button"
           variant="primary"
           aria-label={i18n._(t`Add`)}
           onClick={() => setIsWizardOpen(true)}

awx/ui_next/src/components/Workflow/WorkflowTools.jsx

@@ -90,6 +90,7 @@ function WorkflowTools({
           position="bottom"
         >
           <Button
+            ouiaId="visualizer-zoom-to-fit-button"
             variant="tertiary"
             css="margin-right: 30px;"
             onClick={() => onFitGraph()}
@@ -99,6 +100,7 @@ function WorkflowTools({
         </Tooltip>
         <Tooltip content={i18n._(t`Zoom Out`)} position="bottom">
           <Button
+            ouiaId="visualizer-zoom-out-button"
             variant="tertiary"
             css="margin-right: 10px;"
             onClick={() => zoomOut()}
@@ -119,6 +121,7 @@ function WorkflowTools({
         />
         <Tooltip content={i18n._(t`Zoom In`)} position="bottom">
           <Button
+            ouiaId="visualizer-zoom-in-button"
             variant="tertiary"
             css="margin: 0px 25px 0px 10px;"
             onClick={() => zoomIn()}
@@ -129,6 +132,7 @@ function WorkflowTools({
         <Pan>
           <Tooltip content={i18n._(t`Pan Left`)} position="left">
             <Button
+              ouiaId="visualizer-pan-left-button"
               variant="tertiary"
               css="margin-right: 10px;"
               onClick={() => onPan('left')}
@@ -139,6 +143,7 @@ function WorkflowTools({
           <PanCenter>
             <Tooltip content={i18n._(t`Pan Up`)} position="top">
               <Button
+                ouiaId="visualizer-pan-up-button"
                 variant="tertiary"
                 css="margin-bottom: 10px;"
                 onClick={() => onPan('up')}
@@ -150,12 +155,17 @@ function WorkflowTools({
               content={i18n._(t`Set zoom to 100% and center graph`)}
               position="top"
             >
-              <Button variant="tertiary" onClick={() => onPanToMiddle()}>
+              <Button
+                ouiaId="visualizer-pan-middle-button"
+                variant="tertiary"
+                onClick={() => onPanToMiddle()}
+              >
                 <HomeIcon />
               </Button>
             </Tooltip>
             <Tooltip content={i18n._(t`Pan Down`)} position="bottom">
               <Button
+                ouiaId="visualizer-pan-down-button"
                 variant="tertiary"
                 css="margin-top: 10px;"
                 onClick={() => onPan('down')}
@@ -166,6 +176,7 @@ function WorkflowTools({
           </PanCenter>
           <Tooltip content={i18n._(t`Pan Right`)} position="right">
             <Button
+              ouiaId="visualizer-pan-right-button"
               variant="tertiary"
               css="margin-left: 10px;"
               onClick={() => onPan('right')}

awx/ui_next/src/screens/ActivityStream/ActivityStreamDetailButton.jsx

@@ -21,6 +21,7 @@ function ActivityStreamDetailButton({ i18n, streamItem, user, description }) {
   return (
     <>
       <Button
+        ouiaId={`${streamItem.id}-view-details-button`}
         aria-label={i18n._(t`View event details`)}
         variant="plain"
         component="button"

awx/ui_next/src/screens/Application/ApplicationDetails/ApplicationDetails.jsx

@@ -112,6 +112,7 @@ function ApplicationDetails({
         {application.summary_fields.user_capabilities &&
           application.summary_fields.user_capabilities.edit && (
             <Button
+              ouiaId="application-details-edit-button"
               component={Link}
               to={`/applications/${application.id}/edit`}
               aria-label={i18n._(t`Edit`)}

awx/ui_next/src/screens/Application/ApplicationsList/ApplicationListItem.jsx

@@ -50,6 +50,7 @@ function ApplicationListItem({
           tooltip={i18n._(t`Edit application`)}
         >
           <Button
+            ouiaId={`${application.id}-edit-button`}
             aria-label={i18n._(t`Edit application`)}
             variant="plain"
             component={Link}

awx/ui_next/src/screens/Credential/CredentialDetail/CredentialDetail.jsx

@@ -259,7 +259,11 @@ function CredentialDetail({ i18n, credential }) {
       )}
       <CardActionsRow>
         {user_capabilities.edit && (
-          <Button component={Link} to={`/credentials/${credentialId}/edit`}>
+          <Button
+            ouiaId="credential-detail-edit-button"
+            component={Link}
+            to={`/credentials/${credentialId}/edit`}
+          >
             {i18n._(t`Edit`)}
           </Button>
         )}

awx/ui_next/src/screens/Credential/CredentialList/CredentialListItem.jsx

@@ -63,6 +63,7 @@ function CredentialListItem({
       <ActionsTd dataLabel={i18n._(t`Actions`)}>
         <ActionItem visible={canEdit} tooltip={i18n._(t`Edit Credential`)}>
           <Button
+            ouiaId={`${credential.id}-edit-button`}
             isDisabled={isDisabled}
             aria-label={i18n._(t`Edit Credential`)}
             variant="plain"

awx/ui_next/src/screens/Credential/shared/CredentialForm.jsx

@@ -269,6 +269,7 @@ function CredentialForm({
               <FormFullWidthLayout>
                 <ActionGroup>
                   <Button
+                    ouiaId="credential-form-save-button"
                     id="credential-form-save-button"
                     aria-label={i18n._(t`Save`)}
                     variant="primary"
@@ -281,6 +282,7 @@ function CredentialForm({
                     credentialTypes[formik.values.credential_type]?.kind ===
                       'external' && (
                       <Button
+                        ouiaId="credential-form-test-button"
                         id="credential-form-test-button"
                         aria-label={i18n._(t`Test`)}
                         variant="secondary"
@@ -292,6 +294,7 @@ function CredentialForm({
                       </Button>
                     )}
                   <Button
+                    ouiaId="credential-form-cancel-button"
                     id="credential-form-cancel-button"
                     aria-label={i18n._(t`Cancel`)}
                     variant="link"

awx/ui_next/src/screens/Credential/shared/CredentialPlugins/CredentialPluginField.jsx

@@ -45,6 +45,7 @@ function CredentialPluginInput(props) {
           credential={inputField?.value?.credential}
           onClearPlugin={() => helpers.setValue('')}
           onEditPlugin={() => setShowPluginWizard(true)}
+          fieldId={fieldOptions.id}
         />
       ) : (
         <InputGroup>
@@ -63,6 +64,7 @@ function CredentialPluginInput(props) {
             )}
           >
             <Button
+              ouiaId={`credential-field-${fieldOptions.id}-external-button`}
               id={`credential-${fieldOptions.id}-external-button`}
               variant={ButtonVariant.control}
               aria-label={i18n._(

awx/ui_next/src/screens/Credential/shared/CredentialPlugins/CredentialPluginPrompt/CredentialPluginPrompt.jsx

@@ -58,6 +58,7 @@ function CredentialPluginWizard({ i18n, handleSubmit, onClose }) {
         {({ activeStep, onNext, onBack }) => (
           <>
             <Button
+              ouiaId="credential-plugin-prompt-next"
               id="credential-plugin-prompt-next"
               variant="primary"
               onClick={onNext}
@@ -74,6 +75,7 @@ function CredentialPluginWizard({ i18n, handleSubmit, onClose }) {
                   position="right"
                 >
                   <Button
+                    ouiaId="credential-plugin-prompt-test"
                     id="credential-plugin-prompt-test"
                     variant="secondary"
                     onClick={() => testPluginMetadata()}
@@ -83,6 +85,7 @@ function CredentialPluginWizard({ i18n, handleSubmit, onClose }) {
                 </Tooltip>
 
                 <Button
+                  ouiaId="credential-plugin-prompt-back"
                   id="credential-plugin-prompt-back"
                   variant="secondary"
                   onClick={onBack}
@@ -92,6 +95,7 @@ function CredentialPluginWizard({ i18n, handleSubmit, onClose }) {
               </>
             )}
             <Button
+              ouiaId="credential-plugin-prompt-cancel"
               id="credential-plugin-prompt-cancel"
               variant="link"
               onClick={onClose}

awx/ui_next/src/screens/Credential/shared/CredentialPlugins/CredentialPluginSelected.jsx

@@ -28,6 +28,7 @@ function CredentialPluginSelected({
   credential,
   onEditPlugin,
   onClearPlugin,
+  fieldId,
 }) {
   return (
     <>
@@ -38,6 +39,7 @@ function CredentialPluginSelected({
           position="top"
         >
           <Button
+            ouiaId={`credential-field-${fieldId}-edit-plugin-button`}
             aria-label={i18n._(t`Edit Credential Plugin Configuration`)}
             onClick={onEditPlugin}
             variant={ButtonVariant.control}

awx/ui_next/src/screens/Credential/shared/ExternalTestModal.jsx

@@ -81,6 +81,7 @@ function ExternalTestModal({
             variant="small"
             actions={[
               <Button
+                ouiaId="external-test-modal-run-button"
                 id="run-external-credential-test"
                 key="confirm"
                 variant="primary"
@@ -89,6 +90,7 @@ function ExternalTestModal({
                 {i18n._(t`Run`)}
               </Button>,
               <Button
+                ouiaId="external-test-modal-cancel-button"
                 id="cancel-external-credential-test"
                 key="cancel"
                 variant="link"

awx/ui_next/src/screens/CredentialType/CredentialTypeDetails/CredentialTypeDetails.jsx

@@ -68,6 +68,7 @@ function CredentialTypeDetails({ credentialType, i18n }) {
         {credentialType.summary_fields.user_capabilities &&
           credentialType.summary_fields.user_capabilities.edit && (
             <Button
+              ouiaId="credential-type-detail-edit-button"
               aria-label={i18n._(t`edit`)}
               component={Link}
               to={`/credential_types/${id}/edit`}

awx/ui_next/src/screens/CredentialType/CredentialTypeList/CredentialTypeListItem.jsx

@@ -40,6 +40,7 @@ function CredentialTypeListItem({
           tooltip={i18n._(t`Edit credential type`)}
         >
           <Button
+            ouiaId={`${credentialType.id}-edit-button`}
             aria-label={i18n._(t`Edit credential type`)}
             variant="plain"
             component={Link}

awx/ui_next/src/screens/ExecutionEnvironment/ExecutionEnvironmentDetails/ExecutionEnvironmentDetails.jsx

@@ -107,10 +107,10 @@ function ExecutionEnvironmentDetails({ executionEnvironment, i18n }) {
       {!managedByTower && (
         <CardActionsRow>
           <Button
+            ouiaId="execution-environment-detail-edit-button"
             aria-label={i18n._(t`edit`)}
             component={Link}
             to={`/execution_environments/${id}/edit`}
-            ouiaId="edit-button"
           >
             {i18n._(t`Edit`)}
           </Button>

awx/ui_next/src/screens/ExecutionEnvironment/ExecutionEnvironmentList/ExecutionEnvironmentListItem.jsx

@@ -81,7 +81,7 @@ function ExecutionEnvironmentListItem({
           tooltip={i18n._(t`Edit Execution Environment`)}
         >
           <Button
-            ouiaId={`edit-ee-${executionEnvironment.id}`}
+            ouiaId={`${executionEnvironment.id}-edit-button`}
             aria-label={i18n._(t`Edit Execution Environment`)}
             variant="plain"
             component={Link}

awx/ui_next/src/screens/Host/HostDetail/HostDetail.jsx

@@ -109,6 +109,7 @@ function HostDetail({ i18n, host }) {
       <CardActionsRow>
         {user_capabilities?.edit && (
           <Button
+            ouiaId="host-detail-edit-button"
             aria-label={i18n._(t`edit`)}
             component={Link}
             to={`/hosts/${id}/edit`}

awx/ui_next/src/screens/Host/HostGroups/HostGroupItem.jsx

@@ -48,7 +48,12 @@ function HostGroupItem({ i18n, group, inventoryId, isSelected, onSelect }) {
         >
           {group.summary_fields.user_capabilities.edit && (
             <Tooltip content={i18n._(t`Edit Group`)} position="top">
-              <Button variant="plain" component={Link} to={editUrl}>
+              <Button
+                ouiaId={`${group.id}-edit-button`}
+                variant="plain"
+                component={Link}
+                to={editUrl}
+              >
                 <PencilAltIcon />
               </Button>
             </Tooltip>

awx/ui_next/src/screens/Host/HostList/HostListItem.jsx

@@ -52,6 +52,7 @@ function HostListItem({
           tooltip={i18n._(t`Edit Host`)}
         >
           <Button
+            ouiaId={`${host.id}-edit-button}`}
             aria-label={i18n._(t`Edit Host`)}
             variant="plain"
             component={Link}

awx/ui_next/src/screens/Host/HostList/SmartInventoryButton.jsx

@@ -35,6 +35,7 @@ function SmartInventoryButton({ onClick, i18n, isDisabled }) {
     >
       <div>
         <Button
+          ouiaId="smart-inventory-button"
           onClick={onClick}
           aria-label={i18n._(t`Smart Inventory`)}
           variant="secondary"

awx/ui_next/src/screens/InstanceGroup/ContainerGroupDetails/ContainerGroupDetails.jsx

@@ -86,6 +86,7 @@ function ContainerGroupDetails({ instanceGroup, i18n }) {
         {instanceGroup.summary_fields.user_capabilities &&
           instanceGroup.summary_fields.user_capabilities.edit && (
             <Button
+              ouiaId="container-group-detail-edit-button"
               aria-label={i18n._(t`edit`)}
               component={Link}
               to={`/instance_groups/container_group/${id}/edit`}

awx/ui_next/src/screens/InstanceGroup/InstanceGroupDetails/InstanceGroupDetails.jsx

@@ -126,6 +126,7 @@ function InstanceGroupDetails({ instanceGroup, i18n }) {
         {instanceGroup.summary_fields.user_capabilities &&
           instanceGroup.summary_fields.user_capabilities.edit && (
             <Button
+              ouiaId="instance-group-detail-edit-button"
               aria-label={i18n._(t`edit`)}
               component={Link}
               to={`/instance_groups/${id}/edit`}

awx/ui_next/src/screens/InstanceGroup/InstanceGroupList/InstanceGroupListItem.jsx

@@ -105,6 +105,7 @@ function InstanceGroupListItem({
           tooltip={i18n._(t`Edit instance group`)}
         >
           <Button
+            ouiaId={`${instanceGroup.id}-edit-button`}
             aria-label={i18n._(t`Edit instance group`)}
             variant="plain"
             component={Link}

awx/ui_next/src/screens/Inventory/InventoryDetail/InventoryDetail.jsx

@@ -114,6 +114,7 @@ function InventoryDetail({ inventory, i18n }) {
       <CardActionsRow>
         {userCapabilities.edit && (
           <Button
+            ouiaId="inventory-detail-edit-button"
             component={Link}
             to={`/inventories/inventory/${inventory.id}/edit`}
           >

awx/ui_next/src/screens/Inventory/InventoryGroupDetail/InventoryGroupDetail.jsx

@@ -56,6 +56,7 @@ function InventoryGroupDetail({ i18n, inventoryGroup }) {
       <CardActionsRow>
         {user_capabilities?.edit && (
           <Button
+            ouiaId="inventory-group-detail-edit-button"
             variant="primary"
             aria-label={i18n._(t`Edit`)}
             onClick={() =>

awx/ui_next/src/screens/Inventory/InventoryGroupHosts/InventoryGroupHostListItem.jsx

@@ -74,6 +74,7 @@ function InventoryGroupHostListItem({
           {host.summary_fields.user_capabilities?.edit && (
             <Tooltip content={i18n._(t`Edit Host`)} position="top">
               <Button
+                ouiaId={`${host.id}-edit-button`}
                 aria-label={i18n._(t`Edit Host`)}
                 css="grid-column: 2"
                 variant="plain"

awx/ui_next/src/screens/Inventory/InventoryGroups/InventoryGroupItem.jsx

@@ -55,6 +55,7 @@ function InventoryGroupItem({
           {group.summary_fields.user_capabilities.edit && (
             <Tooltip content={i18n._(t`Edit Group`)} position="top">
               <Button
+                ouiaId={`${group.id}-edit-button`}
                 aria-label={i18n._(t`Edit Group`)}
                 variant="plain"
                 component={Link}

awx/ui_next/src/screens/Inventory/InventoryHostDetail/InventoryHostDetail.jsx

@@ -99,6 +99,7 @@ function InventoryHostDetail({ i18n, host }) {
       <CardActionsRow>
         {user_capabilities?.edit && (
           <Button
+            ouiaId="inventory-host-detail-edit-button"
             aria-label={i18n._(t`edit`)}
             component={Link}
             to={`/inventories/inventory/${inventory.id}/hosts/${id}/edit`}

awx/ui_next/src/screens/Inventory/InventoryHostGroups/InventoryHostGroupItem.jsx

@@ -54,7 +54,12 @@ function InventoryHostGroupItem({
         >
           {group.summary_fields.user_capabilities.edit && (
             <Tooltip content={i18n._(t`Edit Group`)} position="top">
-              <Button variant="plain" component={Link} to={editUrl}>
+              <Button
+                ouiaId={`${group.id}-edit-button`}
+                variant="plain"
+                component={Link}
+                to={editUrl}
+              >
                 <PencilAltIcon />
               </Button>
             </Tooltip>

awx/ui_next/src/screens/Inventory/InventoryHosts/InventoryHostItem.jsx

@@ -66,7 +66,12 @@ function InventoryHostItem(props) {
           <HostToggle host={host} />
           {host.summary_fields.user_capabilities?.edit && (
             <Tooltip content={i18n._(t`Edit Host`)} position="top">
-              <Button variant="plain" component={Link} to={`${editUrl}`}>
+              <Button
+                ouiaId={`${host.id}-edit-button`}
+                variant="plain"
+                component={Link}
+                to={`${editUrl}`}
+              >
                 <PencilAltIcon />
               </Button>
             </Tooltip>

awx/ui_next/src/screens/Inventory/InventoryList/InventoryListItem.jsx

@@ -115,6 +115,7 @@ function InventoryListItem({
             tooltip={i18n._(t`Edit Inventory`)}
           >
             <Button
+              ouiaId={`${inventory.id}-edit-button`}
               isDisabled={isCopying}
               aria-label={i18n._(t`Edit Inventory`)}
               variant="plain"

awx/ui_next/src/screens/Inventory/InventoryRelatedGroups/InventoryRelatedGroupListItem.jsx

@@ -63,6 +63,7 @@ function InventoryRelatedGroupListItem({
           {group.summary_fields.user_capabilities?.edit && (
             <Tooltip content={i18n._(t`Edit Group`)} position="top">
               <Button
+                ouiaId={`${group.id}-edit-button`}
                 aria-label={i18n._(t`Edit Group`)}
                 css="grid-column: 2"
                 variant="plain"

awx/ui_next/src/screens/Inventory/InventorySourceDetail/InventorySourceDetail.jsx

@@ -265,6 +265,7 @@ function InventorySourceDetail({ inventorySource, i18n }) {
       <CardActionsRow>
         {user_capabilities?.edit && (
           <Button
+            ouiaId="inventory-source-detail-edit-button"
             component={Link}
             aria-label={i18n._(t`edit`)}
             to={`/inventories/inventory/${inventory.id}/sources/${id}/edit`}

awx/ui_next/src/screens/Inventory/InventorySources/InventorySourceList.jsx

@@ -183,6 +183,7 @@ function InventorySourceList({ i18n }) {
                       position="top"
                     >
                       <Button
+                        ouiaId="sync-all-button"
                         onClick={syncAll}
                         aria-label={i18n._(t`Sync all`)}
                         variant="secondary"

awx/ui_next/src/screens/Inventory/InventorySources/InventorySourceListItem.jsx

@@ -122,6 +122,7 @@ function InventorySourceListItem({
             )}
             {source.summary_fields.user_capabilities.edit && (
               <Button
+                ouiaId={`${source.id}-edit-button`}
                 aria-label={i18n._(t`Edit Source`)}
                 variant="plain"
                 component={Link}

awx/ui_next/src/screens/Inventory/SmartInventoryDetail/SmartInventoryDetail.jsx

@@ -151,6 +151,7 @@ function SmartInventoryDetail({ inventory, i18n }) {
         <CardActionsRow>
           {user_capabilities?.edit && (
             <Button
+              ouiaId="smart-inventory-detail-edit-button"
               component={Link}
               aria-label={i18n._(t`edit`)}
               to={`/inventories/smart_inventory/${id}/edit`}

awx/ui_next/src/screens/Inventory/shared/InventorySourceSyncButton.jsx

@@ -57,6 +57,7 @@ function InventorySourceSyncButton({ source, icon, i18n }) {
       {['running', 'pending', 'updating'].includes(source.status) ? (
         <Tooltip content={i18n._(t`Cancel sync process`)} position="top">
           <Button
+            ouiaId={`${source}-cancel-sync-button`}
             isDisabled={cancelSyncLoading || startSyncLoading}
             aria-label={i18n._(t`Cancel sync source`)}
             variant={icon ? 'plain' : 'secondary'}
@@ -68,6 +69,7 @@ function InventorySourceSyncButton({ source, icon, i18n }) {
       ) : (
         <Tooltip content={i18n._(t`Start sync process`)} position="top">
           <Button
+            ouiaId={`${source}-sync-button`}
             isDisabled={cancelSyncLoading || startSyncLoading}
             aria-label={i18n._(t`Start sync source`)}
             variant={icon ? 'plain' : 'secondary'}

awx/ui_next/src/screens/Job/JobDetail/JobDetail.jsx

@@ -387,13 +387,21 @@ function JobDetail({ job, i18n }) {
           (job.status === 'failed' && job.type === 'job' ? (
             <LaunchButton resource={job}>
               {({ handleRelaunch }) => (
-                <ReLaunchDropDown isPrimary handleRelaunch={handleRelaunch} />
+                <ReLaunchDropDown
+                  ouiaId="job-detail-relaunch-dropdown"
+                  isPrimary
+                  handleRelaunch={handleRelaunch}
+                />
               )}
             </LaunchButton>
           ) : (
             <LaunchButton resource={job} aria-label={i18n._(t`Relaunch`)}>
               {({ handleRelaunch }) => (
-                <Button type="submit" onClick={handleRelaunch}>
+                <Button
+                  ouiaId="job-detail-relaunch-button"
+                  type="submit"
+                  onClick={handleRelaunch}
+                >
                   {i18n._(t`Relaunch`)}
                 </Button>
               )}

awx/ui_next/src/screens/ManagementJob/ManagementJobList/ManagementJobListItem.jsx

@@ -95,6 +95,7 @@ function ManagementJobListItem({
                     position="top"
                   >
                     <Button
+                      ouiaId={`${id}-launch-button`}
                       aria-label={i18n._(t`Launch management job`)}
                       variant="plain"
                       onClick={handleLaunch}

awx/ui_next/src/screens/NotificationTemplate/NotificationTemplateDetail/NotificationTemplateDetail.jsx

@@ -350,6 +350,7 @@ function NotificationTemplateDetail({ i18n, template, defaultMessages }) {
         {summary_fields.user_capabilities &&
           summary_fields.user_capabilities.edit && (
             <Button
+              ouiaId="notification-template-detail-edit-button"
               component={Link}
               to={`/notification_templates/${template.id}/edit`}
               aria-label={i18n._(t`Edit`)}

awx/ui_next/src/screens/Organization/OrganizationDetail/OrganizationDetail.jsx

@@ -142,6 +142,7 @@ function OrganizationDetail({ i18n, organization }) {
       <CardActionsRow>
         {summary_fields.user_capabilities.edit && (
           <Button
+            ouiaId="organization-detail-edit-button"
             aria-label={i18n._(t`Edit`)}
             component={Link}
             to={`/organizations/${id}/edit`}

awx/ui_next/src/screens/Organization/OrganizationList/OrganizationListItem.jsx

@@ -74,6 +74,7 @@ function OrganizationListItem({
           tooltip={i18n._(t`Edit Organization`)}
         >
           <Button
+            ouiaId={`${organization.id}-edit-button`}
             aria-label={i18n._(t`Edit Organization`)}
             variant="plain"
             component={Link}

awx/ui_next/src/screens/Organization/OrganizationTeams/OrganizationTeamListItem.jsx

@@ -39,6 +39,7 @@ function OrganizationTeamListItem({ i18n, team, detailUrl }) {
           {team.summary_fields.user_capabilities.edit && (
             <Tooltip content={i18n._(t`Edit Team`)} position="top">
               <Button
+                ouiaId={`${team.id}-edit-button`}
                 aria-label={i18n._(t`Edit Team`)}
                 css="grid-column: 2"
                 variant="plain"

awx/ui_next/src/screens/Project/ProjectDetail/ProjectDetail.jsx

@@ -154,6 +154,7 @@ function ProjectDetail({ project, i18n }) {
       <CardActionsRow>
         {summary_fields.user_capabilities?.edit && (
           <Button
+            ouiaId="project-detail-edit-button"
             aria-label={i18n._(t`edit`)}
             component={Link}
             to={`/projects/${id}/edit`}

awx/ui_next/src/screens/Project/ProjectJobTemplatesList/ProjectJobTemplatesListItem.jsx

@@ -118,6 +118,7 @@ function ProjectJobTemplateListItem({
               <LaunchButton resource={template}>
                 {({ handleLaunch }) => (
                   <Button
+                    ouiaId={`${template.id}-launch-button`}
                     css="grid-column: 1"
                     variant="plain"
                     onClick={handleLaunch}
@@ -131,6 +132,7 @@ function ProjectJobTemplateListItem({
           {template.summary_fields.user_capabilities.edit && (
             <Tooltip content={i18n._(t`Edit Template`)} position="top">
               <Button
+                ouiaId={`${template.id}-edit-button`}
                 css="grid-column: 2"
                 variant="plain"
                 component={Link}

awx/ui_next/src/screens/Project/ProjectList/ProjectListItem.jsx

@@ -146,6 +146,7 @@ function ProjectListItem({
           stringToCopy={project.scm_revision}
           copyTip={i18n._(t`Copy full revision to clipboard.`)}
           copiedSuccessTip={i18n._(t`Successfully copied to clipboard!`)}
+          ouiaId="copy-revision-button"
         />
       </Td>
       <ActionsTd dataLabel={i18n._(t`Actions`)}>
@@ -160,6 +161,7 @@ function ProjectListItem({
           tooltip={i18n._(t`Edit Project`)}
         >
           <Button
+            ouiaId={`${project.id}-edit-button`}
             isDisabled={isDisabled}
             aria-label={i18n._(t`Edit Project`)}
             variant="plain"

awx/ui_next/src/screens/Project/shared/ProjectSyncButton.jsx

@@ -27,6 +27,7 @@ function ProjectSyncButton({ i18n, projectId }) {
   return (
     <>
       <Button
+        ouiaId={`${projectId}-sync-button`}
         aria-label={i18n._(t`Sync Project`)}
         variant={isDetailsView ? 'secondary' : 'plain'}
         onClick={handleSync}

awx/ui_next/src/screens/Setting/ActivityStream/ActivityStreamDetail/ActivityStreamDetail.jsx

@@ -84,9 +84,9 @@ function ActivityStreamDetail({ i18n }) {
         {me?.is_superuser && (
           <CardActionsRow>
             <Button
+              ouiaId="activity-stream-detail-edit-button"
               aria-label={i18n._(t`Edit`)}
               component={Link}
-              ouiaId="edit-button"
               to="/settings/activity_stream/edit"
             >
               {i18n._(t`Edit`)}

awx/ui_next/src/screens/Setting/AzureAD/AzureADDetail/AzureADDetail.jsx

@@ -76,9 +76,9 @@ function AzureADDetail({ i18n }) {
         {me?.is_superuser && (
           <CardActionsRow>
             <Button
+              ouiaId="azure-detail-edit-button"
               aria-label={i18n._(t`Edit`)}
               component={Link}
-              ouiaId="edit-button"
               to="/settings/azure/edit"
             >
               {i18n._(t`Edit`)}

awx/ui_next/src/screens/Setting/GitHub/GitHubDetail/GitHubDetail.jsx

@@ -139,9 +139,9 @@ function GitHubDetail({ i18n }) {
         {me?.is_superuser && (
           <CardActionsRow>
             <Button
+              ouiaId="github-detail-edit-button"
               aria-label={i18n._(t`Edit`)}
               component={Link}
-              ouiaId="edit-button"
               to={`${baseURL}/${category}/edit`}
             >
               {i18n._(t`Edit`)}

awx/ui_next/src/screens/Setting/GoogleOAuth2/GoogleOAuth2Detail/GoogleOAuth2Detail.jsx

@@ -76,9 +76,9 @@ function GoogleOAuth2Detail({ i18n }) {
         {me?.is_superuser && (
           <CardActionsRow>
             <Button
+              ouiaId="google-detail-edit-button"
               aria-label={i18n._(t`Edit`)}
               component={Link}
-              ouiaId="edit-button"
               to="/settings/google_oauth2/edit"
             >
               {i18n._(t`Edit`)}

awx/ui_next/src/screens/Setting/Jobs/JobsDetail/JobsDetail.jsx

@@ -93,9 +93,9 @@ function JobsDetail({ i18n }) {
         {me?.is_superuser && (
           <CardActionsRow>
             <Button
+              ouiaId="jobs-detail-edit-button"
               aria-label={i18n._(t`Edit`)}
               component={Link}
-              ouiaId="edit-button"
               to="/settings/jobs/edit"
             >
               {i18n._(t`Edit`)}

awx/ui_next/src/screens/Setting/LDAP/LDAPDetail/LDAPDetail.jsx

@@ -157,9 +157,9 @@ function LDAPDetail({ i18n }) {
         {me?.is_superuser && (
           <CardActionsRow>
             <Button
+              ouiaId="ldap-detail-edit-button"
               aria-label={i18n._(t`Edit`)}
               component={Link}
-              ouiaId="edit-button"
               to={`${baseURL}/${category}/edit`}
             >
               {i18n._(t`Edit`)}

awx/ui_next/src/screens/Setting/License/LicenseDetail/LicenseDetail.jsx

@@ -11,9 +11,9 @@ function LicenseDetail({ i18n }) {
       {i18n._(t`Detail coming soon :)`)}
       <CardActionsRow>
         <Button
+          ouiaId="license-detail-edit-button"
           aria-label={i18n._(t`Edit`)}
           component={Link}
-          ouiaId="edit-button"
           to="/settings/license/edit"
         >
           {i18n._(t`Edit`)}

awx/ui_next/src/screens/Setting/Logging/LoggingDetail/LoggingDetail.jsx

@@ -97,9 +97,9 @@ function LoggingDetail({ i18n }) {
         {me?.is_superuser && (
           <CardActionsRow>
             <Button
+              ouiaId="logging-detail-edit-button"
               aria-label={i18n._(t`Edit`)}
               component={Link}
-              ouiaId="edit-button"
               to="/settings/logging/edit"
             >
               {i18n._(t`Edit`)}

awx/ui_next/src/screens/Setting/MiscSystem/MiscSystemDetail/MiscSystemDetail.jsx

@@ -137,9 +137,9 @@ function MiscSystemDetail({ i18n }) {
         {me?.is_superuser && (
           <CardActionsRow>
             <Button
+              ouiaId="system-detail-edit-button"
               aria-label={i18n._(t`Edit`)}
               component={Link}
-              ouiaId="edit-button"
               to="/settings/miscellaneous_system/edit"
             >
               {i18n._(t`Edit`)}

awx/ui_next/src/screens/Setting/RADIUS/RADIUSDetail/RADIUSDetail.jsx

@@ -76,9 +76,9 @@ function RADIUSDetail({ i18n }) {
         {me?.is_superuser && (
           <CardActionsRow>
             <Button
+              ouiaId="radius-detail-edit-button"
               aria-label={i18n._(t`Edit`)}
               component={Link}
-              ouiaId="edit-button"
               to="/settings/radius/edit"
             >
               {i18n._(t`Edit`)}

awx/ui_next/src/screens/Setting/SAML/SAMLDetail/SAMLDetail.jsx

@@ -77,9 +77,9 @@ function SAMLDetail({ i18n }) {
         {me?.is_superuser && (
           <CardActionsRow>
             <Button
+              ouiaId="saml-detail-edit-button"
               aria-label={i18n._(t`Edit`)}
               component={Link}
-              ouiaId="edit-button"
               to="/settings/saml/edit"
             >
               {i18n._(t`Edit`)}

awx/ui_next/src/screens/Setting/TACACS/TACACSDetail/TACACSDetail.jsx

@@ -79,7 +79,7 @@ function TACACSDetail({ i18n }) {
               aria-label={i18n._(t`Edit`)}
               component={Link}
               to="/settings/tacacs/edit"
-              ouiaId="edit-button"
+              ouiaId="tacacs-detail-edit-button"
             >
               {i18n._(t`Edit`)}
             </Button>

awx/ui_next/src/screens/Setting/UI/UIDetail/UIDetail.jsx

@@ -94,7 +94,7 @@ function UIDetail({ i18n }) {
               aria-label={i18n._(t`Edit`)}
               component={Link}
               to="/settings/ui/edit"
-              ouiaId="edit-button"
+              ouiaId="ui-detail-edit-button"
             >
               {i18n._(t`Edit`)}
             </Button>

awx/ui_next/src/screens/Setting/shared/RevertAllAlert.jsx

@@ -14,20 +14,20 @@ function RevertAllAlert({ i18n, onClose, onRevertAll }) {
       ouiaId="revert-all-modal"
       actions={[
         <Button
+          ouiaId="revert-all-confirm-button"
           key="revert"
           variant="primary"
           aria-label={i18n._(t`Confirm revert all`)}
           onClick={onRevertAll}
-          ouiaId="confirm-revert-all-button"
         >
           {i18n._(t`Revert all`)}
         </Button>,
         <Button
+          ouiaId="revert-all-cancel-button"
           key="cancel"
           variant="link"
           aria-label={i18n._(t`Cancel revert`)}
           onClick={onClose}
-          ouiaId="cancel-revert-all-button"
         >
           {i18n._(t`Cancel`)}
         </Button>,

awx/ui_next/src/screens/Team/TeamDetail/TeamDetail.jsx

@@ -54,6 +54,7 @@ function TeamDetail({ team, i18n }) {
         {summary_fields.user_capabilities &&
           summary_fields.user_capabilities.edit && (
             <Button
+              ouiaId="team-detail-edit-button"
               aria-label={i18n._(t`Edit`)}
               component={Link}
               to={`/teams/${id}/edit`}

awx/ui_next/src/screens/Team/TeamList/TeamListItem.jsx

@@ -57,6 +57,7 @@ function TeamListItem({
           tooltip={i18n._(t`Edit Team`)}
         >
           <Button
+            ouiaId={`${team.id}-edit-button`}
             aria-label={i18n._(t`Edit Team`)}
             variant="plain"
             component={Link}

awx/ui_next/src/screens/Team/TeamRoles/TeamRolesList.jsx

@@ -196,6 +196,7 @@ function TeamRolesList({ i18n, me, team }) {
           onClose={() => setRoleToDisassociate(null)}
           actions={[
             <Button
+              ouiaId="disassociate-confirm-button"
               key="disassociate"
               variant="danger"
               aria-label={i18n._(t`confirm disassociate`)}
@@ -204,6 +205,7 @@ function TeamRolesList({ i18n, me, team }) {
               {i18n._(t`Disassociate`)}
             </Button>,
             <Button
+              ouiaId="disassociate-cancel-button"
               key="cancel"
               variant="link"
               aria-label={i18n._(t`Cancel`)}

awx/ui_next/src/screens/Template/JobTemplateDetail/JobTemplateDetail.jsx

@@ -372,6 +372,7 @@ function JobTemplateDetail({ i18n, template }) {
         {summary_fields.user_capabilities &&
           summary_fields.user_capabilities.edit && (
             <Button
+              ouiaId="job-template-detail-edit-button"
               component={Link}
               to={`/templates/job_template/${templateId}/edit`}
               aria-label={i18n._(t`Edit`)}
@@ -382,7 +383,12 @@ function JobTemplateDetail({ i18n, template }) {
         {canLaunch && (
           <LaunchButton resource={template} aria-label={i18n._(t`Launch`)}>
             {({ handleLaunch }) => (
-              <Button variant="secondary" type="submit" onClick={handleLaunch}>
+              <Button
+                ouiaId="job-template-detail-launch-button"
+                variant="secondary"
+                type="submit"
+                onClick={handleLaunch}
+              >
                 {i18n._(t`Launch`)}
               </Button>
             )}

awx/ui_next/src/screens/Template/Survey/SurveyList.jsx

@@ -98,6 +98,7 @@ function SurveyList({
       }}
       actions={[
         <Button
+          ouiaId="delete-confirm-button"
           key="delete"
           variant="danger"
           aria-label={i18n._(t`confirm delete`)}
@@ -106,6 +107,7 @@ function SurveyList({
           {i18n._(t`Delete`)}
         </Button>,
         <Button
+          ouiaId="delete-cancel-button"
           key="cancel"
           variant="link"
           aria-label={i18n._(t`cancel delete`)}

awx/ui_next/src/screens/Template/Survey/SurveyListItem.jsx

@@ -66,6 +66,7 @@ function SurveyListItem({
           <Stack>
             <StackItem>
               <Button
+                ouiaId={`${question.variable}-move-up-button`}
                 variant="plain"
                 aria-label={i18n._(t`move up`)}
                 isDisabled={isFirst || !canEdit}
@@ -76,6 +77,7 @@ function SurveyListItem({
             </StackItem>
             <StackItem>
               <Button
+                ouiaId={`${question.variable}-move-down-button`}
                 variant="plain"
                 aria-label={i18n._(t`move down`)}
                 isDisabled={isLast || !canEdit}

awx/ui_next/src/screens/Template/Survey/SurveyToolbar.jsx

@@ -65,6 +65,7 @@ function SurveyToolbar({
           </ToolbarItem>
           <ToolbarItem>
             <Button
+              ouiaId="survey-delete-button"
               variant="secondary"
               isDisabled={isDeleteDisabled}
               onClick={() => onToggleDeleteModal(true)}

awx/ui_next/src/screens/Template/WorkflowJobTemplateDetail/WorkflowJobTemplateDetail.jsx

@@ -212,6 +212,7 @@ function WorkflowJobTemplateDetail({ template, i18n }) {
         {summary_fields.user_capabilities &&
           summary_fields.user_capabilities.edit && (
             <Button
+              ouiaId="workflow-job-template-detail-edit-button"
               component={Link}
               to={`/templates/workflow_job_template/${id}/edit`}
               aria-label={i18n._(t`Edit`)}
@@ -222,7 +223,12 @@ function WorkflowJobTemplateDetail({ template, i18n }) {
         {canLaunch && (
           <LaunchButton resource={template} aria-label={i18n._(t`Launch`)}>
             {({ handleLaunch }) => (
-              <Button variant="secondary" type="submit" onClick={handleLaunch}>
+              <Button
+                ouiaId="workflow-job-template-detail-launch-button"
+                variant="secondary"
+                type="submit"
+                onClick={handleLaunch}
+              >
                 {i18n._(t`Launch`)}
               </Button>
             )}

awx/ui_next/src/screens/Template/WorkflowJobTemplateVisualizer/Modals/DeleteAllNodesModal.jsx

@@ -11,6 +11,7 @@ function DeleteAllNodesModal({ i18n }) {
     <AlertModal
       actions={[
         <Button
+          ouiaId="delete-all-confirm-button"
           id="confirm-delete-all-nodes"
           key="remove"
           variant="danger"
@@ -20,6 +21,7 @@ function DeleteAllNodesModal({ i18n }) {
           {i18n._(t`Remove`)}
         </Button>,
         <Button
+          ouiaId="delete-all-cancel-button"
           id="cancel-delete-all-nodes"
           key="cancel"
           variant="link"

awx/ui_next/src/screens/Template/WorkflowJobTemplateVisualizer/Modals/LinkModals/LinkDeleteModal.jsx

@@ -19,6 +19,7 @@ function LinkDeleteModal({ i18n }) {
       onClose={() => dispatch({ type: 'SET_LINK_TO_DELETE', value: null })}
       actions={[
         <Button
+          ouiaId="link-remove-confirm-button"
           id="confirm-link-removal"
           aria-label={i18n._(t`Confirm link removal`)}
           key="remove"
@@ -28,6 +29,7 @@ function LinkDeleteModal({ i18n }) {
           {i18n._(t`Remove`)}
         </Button>,
         <Button
+          ouiaId="link-remove-cancel-button"
           id="cancel-link-removal"
           aria-label={i18n._(t`Cancel link removal`)}
           key="cancel"

awx/ui_next/src/screens/Template/WorkflowJobTemplateVisualizer/Modals/LinkModals/LinkModal.jsx

@@ -25,6 +25,7 @@ function LinkModal({ header, i18n, onConfirm }) {
       onClose={() => dispatch({ type: 'CANCEL_LINK_MODAL' })}
       actions={[
         <Button
+          ouiaId="link-confirm-button"
           id="link-confirm"
           key="save"
           variant="primary"
@@ -34,6 +35,7 @@ function LinkModal({ header, i18n, onConfirm }) {
           {i18n._(t`Save`)}
         </Button>,
         <Button
+          ouiaId="link-cancel-button"
           id="link-cancel"
           key="cancel"
           variant="link"

awx/ui_next/src/screens/Template/WorkflowJobTemplateVisualizer/Modals/NodeModals/NodeDeleteModal.jsx

@@ -20,6 +20,7 @@ function NodeDeleteModal({ i18n }) {
       onClose={() => dispatch({ type: 'SET_NODE_TO_DELETE', value: null })}
       actions={[
         <Button
+          ouiaId="node-removal-confirm-button"
           id="confirm-node-removal"
           key="remove"
           variant="danger"
@@ -29,6 +30,7 @@ function NodeDeleteModal({ i18n }) {
           {i18n._(t`Remove`)}
         </Button>,
         <Button
+          ouiaId="node-removal-cancel-button"
           id="cancel-node-removal"
           key="cancel"
           variant="link"

awx/ui_next/src/screens/Template/WorkflowJobTemplateVisualizer/Modals/NodeModals/NodeModal.jsx

@@ -134,6 +134,7 @@ function NodeModalForm({
             />
             {activeStep && activeStep.id !== promptSteps[0]?.id && (
               <Button
+                ouiaId="node-modal-back-button"
                 id="back-node-modal"
                 variant="secondary"
                 aria-label={i18n._(t`Back`)}
@@ -143,6 +144,7 @@ function NodeModalForm({
               </Button>
             )}
             <Button
+              ouiaId="node-modal-cancel-button"
               id="cancel-node-modal"
               variant="link"
               aria-label={i18n._(t`Cancel`)}

awx/ui_next/src/screens/Template/WorkflowJobTemplateVisualizer/Modals/NodeModals/NodeNextButton.jsx

@@ -19,6 +19,7 @@ function NodeNextButton({
 
   return (
     <Button
+      ouiaId="node-modal-next-button"
       id="next-node-modal"
       variant="primary"
       type="submit"

awx/ui_next/src/screens/Template/WorkflowJobTemplateVisualizer/Modals/NodeModals/NodeViewModal.jsx

@@ -199,6 +199,7 @@ function NodeViewModal({ i18n, readOnly }) {
           ? []
           : [
               <Button
+                ouiaId="node-view-edit-button"
                 id="node-view-edit-button"
                 key="edit"
                 aria-label={i18n._(t`Edit Node`)}

awx/ui_next/src/screens/Template/WorkflowJobTemplateVisualizer/Modals/UnsavedChangesModal.jsx

@@ -16,6 +16,7 @@ function UnsavedChangesModal({ i18n, onSaveAndExit, onExit }) {
       onClose={() => dispatch({ type: 'TOGGLE_UNSAVED_CHANGES_MODAL' })}
       actions={[
         <Button
+          ouiaId="unsaved-changes-exit-button"
           id="confirm-exit-without-saving"
           key="exit"
           variant="danger"
@@ -25,6 +26,7 @@ function UnsavedChangesModal({ i18n, onSaveAndExit, onExit }) {
           {i18n._(t`Exit Without Saving`)}
         </Button>,
         <Button
+          ouiaId="unsaved-changes-save-exit-button"
           id="confirm-save-and-exit"
           key="save"
           variant="primary"