Merge pull request #1080 from IntersectMBO/chore/1070-bug-missing-tes…

…t-ids-governance-action-proposal chore/1070-bug-missing-test-ids-governance-action-proposal
IntersectMBO · May 27, 2024 · 93c3969 · 93c3969
2 parents 4c652cd + fa49120
commit 93c3969
Show file tree

Hide file tree

Showing 7 changed files with 29 additions and 7 deletions.
diff --git a/govtool/frontend/src/components/molecules/LinkWithIcon.tsx b/govtool/frontend/src/components/molecules/LinkWithIcon.tsx
@@ -6,14 +6,15 @@ import { Typography } from "@atoms";
 import { LinkWithIconProps } from "./types";
 
 export const LinkWithIcon = ({
+  dataTestId,
   label,
   onClick,
   icon,
   sx,
   cutWithEllipsis,
 }: LinkWithIconProps) => (
   <Box
-    data-testid={`${label.split(" ").join("-")}-link`}
+    data-testid={dataTestId ?? `${label.split(" ").join("-")}-link`}
     sx={{
       alignItems: "center",
       cursor: "pointer",

diff --git a/govtool/frontend/src/components/molecules/types.ts b/govtool/frontend/src/components/molecules/types.ts
@@ -6,6 +6,7 @@ export type LinkWithIconProps = {
   icon?: JSX.Element;
   sx?: SxProps;
   cutWithEllipsis?: boolean;
+  dataTestId?: string;
 };
 
 export type StepProps = {

diff --git a/...ntend/src/components/organisms/CreateGovernanceActionSteps/CreateGovernanceActionForm.tsx b/...ntend/src/components/organisms/CreateGovernanceActionSteps/CreateGovernanceActionForm.tsx
@@ -6,7 +6,7 @@ import { Button, InfoText, Spacer, Typography } from "@atoms";
 import { GOVERNANCE_ACTION_FIELDS, Placeholders } from "@consts";
 import { useCreateGovernanceActionForm, useTranslation } from "@hooks";
 import { Field } from "@molecules";
-import { URL_REGEX } from "@/utils";
+import { URL_REGEX, testIdFromLabel } from "@/utils";
 import { GovernanceActionField } from "@/types/governanceAction";
 
 import { BgCard } from "../BgCard";
@@ -74,7 +74,11 @@ export const CreateGovernanceActionForm = ({
       }
       if (field.component === GovernanceActionField.TextArea) {
         return (
-          <ControlledField.TextArea {...{ control, errors }} {...fieldProps} />
+          <ControlledField.TextArea
+            {...{ control, errors }}
+            {...fieldProps}
+            data-testid={`${testIdFromLabel(fieldProps.label)}-input`}
+          />
         );
       }
     });
@@ -93,8 +97,9 @@ export const CreateGovernanceActionForm = ({
             links.length > 1 ? (
               <DeleteOutlineIcon
                 color="primary"
-                sx={{ cursor: "pointer", height: 24, with: 24 }}
+                data-testid={`delete-link-${index + 1}-button`}
                 onClick={() => removeLink(index)}
+                sx={{ cursor: "pointer", height: 24, with: 24 }}
               />
             ) : null
           }
@@ -141,7 +146,12 @@ export const CreateGovernanceActionForm = ({
       <Spacer y={4.25} />
       {renderLinks()}
       {links?.length < MAX_NUMBER_OF_LINKS ? (
-        <Button onClick={addLink} size="extraLarge" variant="text">
+        <Button
+          data-testid="add-link-button"
+          onClick={addLink}
+          size="extraLarge"
+          variant="text"
+        >
           {t("addLink")}
         </Button>
       ) : null}

diff --git a/...nd/src/components/organisms/CreateGovernanceActionSteps/ReviewCreatedGovernanceAction.tsx b/...nd/src/components/organisms/CreateGovernanceActionSteps/ReviewCreatedGovernanceAction.tsx
@@ -9,7 +9,7 @@ import {
   useTranslation,
 } from "@hooks";
 import { LinkWithIcon } from "@molecules";
-import { openInNewTab } from "@utils";
+import { openInNewTab, testIdFromLabel } from "@utils";
 
 import { Dispatch, SetStateAction } from "react";
 import { BgCard } from "../BgCard";
@@ -58,6 +58,8 @@ export const ReviewCreatedGovernanceAction = ({
               {label}
             </Typography>
             <Typography
+              data-testid={`governance-action-${testIdFromLabel(label)}-
+                content`}
               sx={{ mt: 0.5, wordBreak: "break-word" }}
               variant="body2"
             >
@@ -82,9 +84,10 @@ export const ReviewCreatedGovernanceAction = ({
           {t("createGovernanceAction.supportingLinks")}
         </Typography>
         {links.map(
-          (link: string) =>
+          (link: string, index: number) =>
             link && (
               <LinkWithIcon
+                dataTestId={`governance-action-link-${index + 1}-content`}
                 icon={<img alt="link" src={ICONS.link} />}
                 label={link}
                 onClick={() => onClickLink(link)}
@@ -107,6 +110,7 @@ export const ReviewCreatedGovernanceAction = ({
       </Typography>
       <Spacer y={4.25} />
       <Button
+        data-testid="edit-submission-button"
         startIcon={
           <DriveFileRenameOutlineOutlinedIcon
             color="primary"

diff --git a/govtool/frontend/src/components/organisms/CreateGovernanceActionSteps/StorageInformation.tsx b/govtool/frontend/src/components/organisms/CreateGovernanceActionSteps/StorageInformation.tsx
@@ -59,6 +59,7 @@ export const StorageInformation = ({ setStep }: StorageInformationProps) => {
         {t("createGovernanceAction.storingInformationTitle")}
       </Typography>
       <Button
+        data-testid="read-guide-button"
         endIcon={
           <OpenInNewIcon
             sx={{
@@ -82,6 +83,7 @@ export const StorageInformation = ({ setStep }: StorageInformationProps) => {
         <Step
           component={
             <Button
+              data-testid="metadata-download-button"
               onClick={onClickDownloadJson}
               size="extraLarge"
               startIcon={<img alt="download" src={ICONS.download} />}
@@ -112,6 +114,7 @@ export const StorageInformation = ({ setStep }: StorageInformationProps) => {
           component={
             <ControlledField.Input
               {...{ control, errors }}
+              dataTestId="metadata-url-input"
               name="storingURL"
               layoutStyles={{ mt: 1.5 }}
               placeholder={t(

diff --git a/govtool/frontend/src/components/organisms/CreateGovernanceActionSteps/StoreDataInfo.tsx b/govtool/frontend/src/components/organisms/CreateGovernanceActionSteps/StoreDataInfo.tsx
@@ -39,6 +39,7 @@ export const StoreDataInfo = ({ setStep }: StoreDataInfoProps) => {
         {t("createGovernanceAction.storeDataTitle")}
       </Typography>
       <Link
+        data-testid="storing-information-link"
         onClick={openLink}
         sx={{
           cursor: "pointer",
@@ -54,6 +55,7 @@ export const StoreDataInfo = ({ setStep }: StoreDataInfoProps) => {
       </Link>
       <ControlledField.Checkbox
         {...{ control, errors }}
+        data-testid="storing-information-checkbox"
         name="storeData"
         label={t("createGovernanceAction.storeDataCheckboxLabel")}
       />

diff --git a/govtool/frontend/src/components/organisms/EditDRepInfoSteps/EditDRepStorageInformation.tsx b/govtool/frontend/src/components/organisms/EditDRepInfoSteps/EditDRepStorageInformation.tsx
@@ -115,6 +115,7 @@ export const EditDRepStorageInformation = ({
           component={
             <ControlledField.Input
               {...{ control, errors }}
+              dataTestId="metadata-url-input"
               layoutStyles={{ mt: 1.5 }}
               name="storingURL"
               placeholder={t("editMetadata.storingInformationURLPlaceholder")}