From 5f8061d5cee54f6365ada3d429199710191fd46f Mon Sep 17 00:00:00 2001
From: "m.ray" <16125548+MadalinaRaicu@users.noreply.github.com>
Date: Mon, 13 Jun 2022 13:40:28 +0100
Subject: [PATCH] Fix: data test ids for price change and visual regression
 fixes (#511)

* fix: add data test ids for price change percentage

* fix: add data test id for dialog overlay
---
 .../src/lib/components/landing/landing-dialog.tsx           | 2 +-
 .../src/lib/components/landing/select-market-dialog.tsx     | 2 +-
 libs/ui-toolkit/src/components/dialog/dialog.tsx            | 5 ++++-
 .../src/components/price-change/price-change-cell.tsx       | 6 +++---
 4 files changed, 9 insertions(+), 6 deletions(-)

diff --git a/libs/market-list/src/lib/components/landing/landing-dialog.tsx b/libs/market-list/src/lib/components/landing/landing-dialog.tsx
index 0f870f39e..fb8692692 100644
--- a/libs/market-list/src/lib/components/landing/landing-dialog.tsx
+++ b/libs/market-list/src/lib/components/landing/landing-dialog.tsx
@@ -26,7 +26,7 @@ export const LandingDialog = ({ open, setOpen }: LandingDialogProps) => {
     <AsyncRenderer loading={loading} error={error} data={data}>
       <Dialog
         title={t('Select a market to get started')}
-        intent={Intent.Warning}
+        intent={Intent.Primary}
         open={open}
         onChange={setClose}
         titleClassNames="font-bold font-sans text-3xl tracking-tight mb-0 pl-8"
diff --git a/libs/market-list/src/lib/components/landing/select-market-dialog.tsx b/libs/market-list/src/lib/components/landing/select-market-dialog.tsx
index 4d3c18884..d3b616e08 100644
--- a/libs/market-list/src/lib/components/landing/select-market-dialog.tsx
+++ b/libs/market-list/src/lib/components/landing/select-market-dialog.tsx
@@ -14,7 +14,7 @@ export const SelectMarketDialog = ({
   return (
     <Dialog
       title={t('Select a market')}
-      intent={Intent.Warning}
+      intent={Intent.Primary}
       open={dialogOpen}
       onChange={() => setDialogOpen(false)}
       titleClassNames="font-bold font-sans text-3xl tracking-tight mb-0 pl-8"
diff --git a/libs/ui-toolkit/src/components/dialog/dialog.tsx b/libs/ui-toolkit/src/components/dialog/dialog.tsx
index 9433d0de7..275707150 100644
--- a/libs/ui-toolkit/src/components/dialog/dialog.tsx
+++ b/libs/ui-toolkit/src/components/dialog/dialog.tsx
@@ -35,7 +35,10 @@ export function Dialog({
   return (
     <DialogPrimitives.Root open={open} onOpenChange={(x) => onChange(x)}>
       <DialogPrimitives.Portal>
-        <DialogPrimitives.Overlay className="fixed inset-0 bg-black/50 z-10" />
+        <DialogPrimitives.Overlay
+          className="fixed inset-0 bg-black/50 z-10"
+          data-testid="dialog-overlay"
+        />
         <DialogPrimitives.Content className={contentClasses}>
           <DialogPrimitives.Close
             className="p-12 absolute top-0 right-0"
diff --git a/libs/ui-toolkit/src/components/price-change/price-change-cell.tsx b/libs/ui-toolkit/src/components/price-change/price-change-cell.tsx
index 152a75115..edb7e18df 100644
--- a/libs/ui-toolkit/src/components/price-change/price-change-cell.tsx
+++ b/libs/ui-toolkit/src/components/price-change/price-change-cell.tsx
@@ -54,15 +54,15 @@ export const PriceCellChange = React.memo(
         )} flex items-center gap-4 justify-end`}
       >
         <Arrow value={change} />
-        <span className="flex items-center gap-6 font-mono">
-          <span>
+        <span className="flex items-center gap-6 font-mono text-ui-small">
+          <span data-testid="price-change-percentage">
             {formatNumberPercentage(
               new BigNumber(changePercentage.toString()),
               2
             )}
             &nbsp;
           </span>
-          <span>
+          <span data-testid="price-change">
             {addDecimalsFormatNumber(change.toString(), decimalPlaces ?? 0, 3)}
           </span>
         </span>