Add Ids to ease tests

Add Ids to ease tests.

See: https://github.com/ansible/awx/issues/8680#issuecomment-893663314

awx/ui/src/components/PaginatedTable/ToolbarDeleteButton.js

@@ -273,6 +273,7 @@ function ToolbarDeleteButton({
               {t`Delete`}
             </Button>,
             <Button
+              ouiaId="delete-cancel"
               key="cancel"
               variant="link"
               aria-label={t`cancel delete`}
@@ -284,7 +285,7 @@ function ToolbarDeleteButton({
         >
           <div>{t`This action will delete the following:`}</div>
           {itemsToDelete.map((item) => (
-            <span key={item.id}>
+            <span key={item.id} id={`item-to-be-deleted-${item.id}`}>
               <strong>{item.name || item.username || item.image}</strong>
               <br />
             </span>

awx/ui/src/screens/User/UserTokenList/UserTokenList.js

@@ -170,6 +170,7 @@ function UserTokenList() {
                   ]
                 : []),
               <ToolbarDeleteButton
+                ouiaId="user-token-delete-button"
                 key="delete"
                 onDelete={handleDelete}
                 itemsToDelete={modifiedSelected}

awx/ui/src/screens/User/UserTokenList/UserTokenListItem.js

@@ -16,16 +16,22 @@ function UserTokenListItem({ token, isSelected, onSelect, rowIndex }) {
           isSelected,
           onSelect,
         }}
+        dataLabel={t`Selected`}
+        id={`token-${token.id}`}
       />
-      <Td dataLabel={t`Name`}>
+      <Td dataLabel={t`Name`} id={`token-name-${token.id}`}>
         <Link to={`/users/${id}/tokens/${token.id}/details`}>
           {token.summary_fields?.application
             ? token.summary_fields.application.name
             : t`Personal access token`}
         </Link>
       </Td>
-      <Td dataLabel={t`Scope`}>{toTitleCase(token.scope)}</Td>
+      <Td dataLabel={t`Scope`} id={`token-scope-${token.id}`}>
-      <Td dataLabel={t`Expires`}>{formatDateString(token.expires)}</Td>
+        {toTitleCase(token.scope)}
+      </Td>
+      <Td dataLabel={t`Expires`} id={`token-expires-${token.id}`}>
+        {formatDateString(token.expires)}
+      </Td>
     </Tr>
   );
 }