Removes data-testid's

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}

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} />

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}

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>
 

components/product/variant-selector.tsx

@@ -123,7 +123,6 @@ export function VariantSelector({
                     !isAvailableForSale
                 }
               )}
-              data-testid={isActive ? 'selected-variant' : 'variant'}
             >
               {value}
             </DynamicTag>