From 76029502a48d627fc090f26165d059a1291eb02d Mon Sep 17 00:00:00 2001
From: Michael Novotny <manovotny@gmail.com>
Date: Mon, 24 Jul 2023 14:28:35 -0500
Subject: [PATCH] Removes `data-testid`'s

---
 components/cart/modal.tsx                | 12 ++++--------
 components/grid/three-items.tsx          |  5 +----
 components/label.tsx                     |  4 +---
 components/layout/navbar/mobile-menu.tsx | 14 ++------------
 components/product/variant-selector.tsx  |  1 -
 5 files changed, 8 insertions(+), 28 deletions(-)

diff --git a/components/cart/modal.tsx b/components/cart/modal.tsx
index 2abf49b8e..0c20ede64 100644
--- a/components/cart/modal.tsx
+++ b/components/cart/modal.tsx
@@ -39,11 +39,11 @@ export default function CartModal({ cart }: { cart: Cart | undefined }) {
 
   return (
     <>
-      <button aria-label="Open cart" onClick={openCart} data-testid="open-cart">
+      <button aria-label="Open cart" onClick={openCart}>
         <OpenCart quantity={cart?.totalQuantity} />
       </button>
       <Transition show={isOpen}>
-        <Dialog onClose={closeCart} className="relative z-50" data-testid="cart">
+        <Dialog onClose={closeCart} className="relative z-50">
           <Transition.Child
             as={Fragment}
             enter="transition-all ease-in-out duration-300"
@@ -68,7 +68,7 @@ export default function CartModal({ cart }: { cart: Cart | undefined }) {
               <div className="flex items-center justify-between">
                 <p className="text-lg font-semibold">My Cart</p>
 
-                <button aria-label="Close cart" onClick={closeCart} data-testid="close-cart">
+                <button aria-label="Close cart" onClick={closeCart}>
                   <CloseCart />
                 </button>
               </div>
@@ -98,7 +98,6 @@ export default function CartModal({ cart }: { cart: Cart | undefined }) {
                       return (
                         <li
                           key={i}
-                          data-testid="cart-item"
                           className="flex w-full flex-col border-b border-neutral-300 dark:border-neutral-700"
                         >
                           <div className="relative flex w-full flex-row justify-between px-1 py-4">
@@ -128,10 +127,7 @@ export default function CartModal({ cart }: { cart: Cart | undefined }) {
                                   {item.merchandise.product.title}
                                 </span>
                                 {item.merchandise.title !== DEFAULT_OPTION ? (
-                                  <p
-                                    className="text-sm text-neutral-800"
-                                    data-testid="cart-product-variant"
-                                  >
+                                  <p className="text-sm text-neutral-800">
                                     {item.merchandise.title}
                                   </p>
                                 ) : null}
diff --git a/components/grid/three-items.tsx b/components/grid/three-items.tsx
index cea0488ad..04b73e8c2 100644
--- a/components/grid/three-items.tsx
+++ b/components/grid/three-items.tsx
@@ -38,10 +38,7 @@ export async function ThreeItemGrid() {
   const [firstProduct, secondProduct, thirdProduct] = homepageItems;
 
   return (
-    <section
-      className="mx-auto max-w-screen-2xl p-2 lg:grid lg:grid-cols-6 lg:grid-rows-2"
-      data-testid="homepage-products"
-    >
+    <section className="mx-auto max-w-screen-2xl p-2 lg:grid lg:grid-cols-6 lg:grid-rows-2">
       <ThreeItemGridItem size="full" item={firstProduct} />
       <ThreeItemGridItem size="half" item={secondProduct} />
       <ThreeItemGridItem size="half" item={thirdProduct} />
diff --git a/components/label.tsx b/components/label.tsx
index 791609521..471fe7a25 100644
--- a/components/label.tsx
+++ b/components/label.tsx
@@ -19,9 +19,7 @@ const Label = ({
       })}
     >
       <div className="flex items-center rounded-full border bg-white/70 p-1 text-[10px] font-semibold text-black backdrop-blur-md @[275px]/label:text-xs dark:border-neutral-800 dark:bg-black/70 dark:text-white">
-        <h3 data-testid="product-name" className="mr-4 inline pl-2 leading-none tracking-tight">
-          {title}
-        </h3>
+        <h3 className="mr-4 inline pl-2 leading-none tracking-tight">{title}</h3>
         <Price
           className="flex-none rounded-full bg-blue-600 p-2 text-white"
           amount={amount}
diff --git a/components/layout/navbar/mobile-menu.tsx b/components/layout/navbar/mobile-menu.tsx
index 69ddb8e45..05654d9c1 100644
--- a/components/layout/navbar/mobile-menu.tsx
+++ b/components/layout/navbar/mobile-menu.tsx
@@ -32,12 +32,7 @@ export default function MobileMenu({ menu }: { menu: Menu[] }) {
 
   return (
     <>
-      <button
-        onClick={openMobileMenu}
-        aria-label="Open mobile menu"
-        className="md:hidden"
-        data-testid="open-mobile-menu"
-      >
+      <button onClick={openMobileMenu} aria-label="Open mobile menu" className="md:hidden">
         <Bars3Icon className="h-6" />
       </button>
       <Transition show={isOpen}>
@@ -64,12 +59,7 @@ export default function MobileMenu({ menu }: { menu: Menu[] }) {
           >
             <Dialog.Panel className="fixed bottom-0 left-0 right-0 top-0 flex h-full w-full flex-col bg-white pb-6 dark:bg-black">
               <div className="p-4">
-                <button
-                  className="mb-4"
-                  onClick={closeMobileMenu}
-                  aria-label="Close mobile menu"
-                  data-testid="close-mobile-menu"
-                >
+                <button className="mb-4" onClick={closeMobileMenu} aria-label="Close mobile menu">
                   <XMarkIcon className="h-6" />
                 </button>
 
diff --git a/components/product/variant-selector.tsx b/components/product/variant-selector.tsx
index 52748ee68..3b2e8ac36 100644
--- a/components/product/variant-selector.tsx
+++ b/components/product/variant-selector.tsx
@@ -123,7 +123,6 @@ export function VariantSelector({
                     !isAvailableForSale
                 }
               )}
-              data-testid={isActive ? 'selected-variant' : 'variant'}
             >
               {value}
             </DynamicTag>