chore(data-cy): require data-cy attributes [EE-6880] (#11453)

app/react/edge/edge-stacks/ItemView/EditEdgeStackForm/ComposeForm.tsx

@@ -54,6 +54,7 @@ export function ComposeForm({
       )}
 
       <WebEditorForm
+        data-cy="compose-editor"
         value={values.content}
         yaml
         id="compose-editor"

app/react/edge/edge-stacks/ItemView/EditEdgeStackForm/EditEdgeStackForm.tsx

@@ -159,6 +159,7 @@ function InnerForm({
               <div className="col-sm-12">
                 <SwitchField
                   label="Create an Edge stack webhook"
+                  data-cy="edge-stack-enable-webhook-switch"
                   checked={values.webhookEnabled}
                   labelClass="col-sm-3 col-lg-2"
                   onChange={(value) => setFieldValue('webhookEnabled', value)}
@@ -212,6 +213,7 @@ function InnerForm({
           <div className="col-sm-12">
             <LoadingButton
               className="!ml-0"
+              data-cy="update-stack-button"
               size="small"
               disabled={!isValid}
               isLoading={isSubmitting}

app/react/edge/edge-stacks/ItemView/EditEdgeStackForm/GitForm/GitForm.tsx

@@ -273,6 +273,7 @@ function InnerForm({
       <FormSection title="Actions">
         <LoadingButton
           disabled={dirty || !isValid || isLoading}
+          data-cy="pull-and-update-stack-button"
           isLoading={isUpdateVersion && isLoading}
           loadingText="updating stack..."
         >
@@ -285,6 +286,7 @@ function InnerForm({
           isLoading={!isUpdateVersion && isLoading}
           loadingText="updating settings..."
           onClick={onUpdateSettingsClick}
+          data-cy="edge-stack-update-settings-button"
         >
           Update settings
         </LoadingButton>

app/react/edge/edge-stacks/ItemView/EditEdgeStackForm/KubernetesForm.tsx

@@ -20,6 +20,7 @@ export function KubernetesForm({
         <div className="col-sm-12">
           <SwitchField
             label="Use namespace(s) specified from manifest"
+            data-cy="use-manifest-namespaces-switch"
             tooltip="If you have defined namespaces in your deployment file turning this on will enforce the use of those only in the deployment"
             checked={values.useManifestNamespaces}
             onChange={(value) => setFieldValue('useManifestNamespaces', value)}
@@ -28,6 +29,7 @@ export function KubernetesForm({
       </div>
 
       <WebEditorForm
+        data-cy="kube-manifest-editor"
         value={values.content}
         yaml
         id="kube-manifest-editor"

app/react/edge/edge-stacks/ItemView/EnvironmentsDatatable/EnvironmentActions.tsx

@@ -25,8 +25,13 @@ export function EnvironmentActions({ environment }: Props) {
           to="edge.browse.containers"
           params={{ environmentId: environment.Id, edgeStackId }}
           className="!text-inherit hover:!no-underline"
+          data-cy="browse-snapshot-link"
         >
-          <Button color="none" title="Browse Snapshot">
+          <Button
+            color="none"
+            title="Browse Snapshot"
+            data-cy="browse-snapshot-button"
+          >
             <Icon icon={Search} className="searchIcon" />
           </Button>
         </Link>

app/react/edge/edge-stacks/ItemView/EnvironmentsDatatable/EnvironmentsDatatable.tsx

@@ -116,9 +116,11 @@ export function EnvironmentsDatatable() {
             value={statusFilter}
             onChange={(e) => setStatusFilter(e ?? undefined)}
             options={envStatusSelectOptions}
+            data-cy="edge-stacks-environments-status-filter"
           />
         </div>
       }
+      data-cy="edge-stacks-environments-datatable"
     />
   );
 }

app/react/edge/edge-stacks/ItemView/EnvironmentsDatatable/LogsActions.tsx

@@ -34,7 +34,12 @@ export function LogsActions({ environmentId, edgeStackId }: Props) {
 
   return (
     <>
-      <Button color="none" title="Retrieve logs" onClick={handleCollectLogs}>
+      <Button
+        color="none"
+        title="Retrieve logs"
+        onClick={handleCollectLogs}
+        data-cy="edge-stack-logs-collect-button"
+      >
         <Icon
           icon={clsx({
             'file-text': !collecting,
@@ -44,6 +49,7 @@ export function LogsActions({ environmentId, edgeStackId }: Props) {
       </Button>
       <Button
         color="none"
+        data-cy="edge-stack-logs-download-button"
         title="Download logs"
         disabled={status !== 'collected'}
         onClick={handleDownloadLogs}
@@ -60,6 +66,7 @@ export function LogsActions({ environmentId, edgeStackId }: Props) {
         title="Delete logs"
         disabled={status !== 'collected'}
         onClick={handleDeleteLogs}
+        data-cy="edge-stack-logs-delete-button"
       >
         <Icon
           icon={clsx({

app/react/edge/edge-stacks/ItemView/EnvironmentsDatatable/columns.tsx

@@ -30,7 +30,11 @@ export const columns = _.compact([
     cell({ row: { original: env } }) {
       const { to, params } = getDashboardRoute(env);
       return (
-        <Link to={to} params={params}>
+        <Link
+          to={to}
+          params={params}
+          data-cy={`edge-stack-environment-link-${env.Name}`}
+        >
           {env.Name}
         </Link>
       );
@@ -112,7 +116,10 @@ export const columns = _.compact([
     : []),
 ]);
 
-function ErrorCell({ getValue }: CellContext<EdgeStackEnvironment, string>) {
+function ErrorCell({
+  getValue,
+  row,
+}: CellContext<EdgeStackEnvironment, string>) {
   const [isExpanded, setIsExpanded] = useState(false);
 
   const value = getValue();
@@ -125,6 +132,7 @@ function ErrorCell({ getValue }: CellContext<EdgeStackEnvironment, string>) {
       color="none"
       className="flex cursor-pointer"
       onClick={() => setIsExpanded(!isExpanded)}
+      data-cy={`edge-stack-environment-error-${row.index}`}
     >
       <div className="pr-1 pt-0.5">
         <Icon icon={isExpanded ? ChevronDown : ChevronRight} />