diff --git a/packages/hydrogen/src/components/AddToCartButton/tests/AddToCart.vitest.tsx b/packages/hydrogen/src/components/AddToCartButton/tests/AddToCart.vitest.tsx
index aceb376d52..3419ee3909 100644
--- a/packages/hydrogen/src/components/AddToCartButton/tests/AddToCart.vitest.tsx
+++ b/packages/hydrogen/src/components/AddToCartButton/tests/AddToCart.vitest.tsx
@@ -55,7 +55,7 @@ describe('AddToCartButton', () => {
       }
     );
 
-    expect(screen.getByRole('button')).toHaveAttribute('class', 'bg-blue-600');
+    expect(screen.getByRole('button')).toHaveClass('bg-blue-600');
   });
 
   describe('when variantId is set explicity', () => {
@@ -69,7 +69,7 @@ describe('AddToCartButton', () => {
         {wrapper: CartTestProviders}
       );
 
-      expect(screen.getByRole('button')).toHaveAttribute('disabled', '');
+      expect(screen.getByRole('button')).toBeDisabled();
     });
 
     it('calls linesAdd with the variantId', async () => {
@@ -226,7 +226,7 @@ describe('AddToCartButton', () => {
 
         await user.click(screen.getByRole('button'));
 
-        expect(screen.getByRole('alert').textContent).toBe(
+        expect(screen.getByRole('alert')).toHaveTextContent(
           'Adding product to your cart'
         );
       });
diff --git a/packages/hydrogen/src/components/BaseButton/tests/BaseButton.test.tsx b/packages/hydrogen/src/components/BaseButton/tests/BaseButton.test.tsx
deleted file mode 100644
index 58bb8f8317..0000000000
--- a/packages/hydrogen/src/components/BaseButton/tests/BaseButton.test.tsx
+++ /dev/null
@@ -1,97 +0,0 @@
-import React from 'react';
-import {mountWithProviders} from '../../../utilities/tests/shopifyMount.js';
-import {BaseButton} from '../BaseButton.client.js';
-
-describe('BaseButton', () => {
-  afterEach(() => {
-    jest.clearAllMocks();
-  });
-
-  it('renders a button', () => {
-    const component = mountWithProviders(<BaseButton>Base Button</BaseButton>);
-
-    expect(component).toContainReactComponent('button', {
-      children: 'Base Button',
-    });
-  });
-
-  it('allows passthrough props', () => {
-    const component = mountWithProviders(
-      <BaseButton className="bg-blue-600">Base Button</BaseButton>
-    );
-
-    expect(component.find('button')).toHaveReactProps({
-      className: 'bg-blue-600',
-    });
-  });
-
-  describe('given an on click event handler', () => {
-    it('calls the on click event handler', () => {
-      const mockOnClick = jest.fn();
-      const mouseEvent = new MouseEvent('click', {cancelable: true});
-
-      const component = mountWithProviders(
-        <BaseButton onClick={mockOnClick}>Base Button</BaseButton>
-      );
-
-      component.find('button')?.trigger('onClick', mouseEvent);
-
-      expect(mockOnClick).toBeCalledWith(mouseEvent);
-    });
-
-    it('calls the given default on click behaviour', () => {
-      const mockDefaultOnClick = jest.fn();
-      const mouseEvent = new MouseEvent('click', {cancelable: true});
-
-      const component = mountWithProviders(
-        <BaseButton onClick={() => {}} defaultOnClick={mockDefaultOnClick}>
-          Base Button
-        </BaseButton>
-      );
-
-      component.find('button')?.trigger('onClick', mouseEvent);
-
-      expect(mockDefaultOnClick).toBeCalledWith(mouseEvent);
-    });
-
-    describe('and event preventDefault is called', () => {
-      it('calls the on click event handler without calling the default on click behaviour', () => {
-        const mockOnClick = jest.fn((event) => {
-          event.preventDefault();
-        });
-        const mockDefaultOnClick = jest.fn();
-        const mouseEvent = new MouseEvent('click', {cancelable: true});
-
-        const component = mountWithProviders(
-          <BaseButton onClick={mockOnClick} defaultOnClick={mockDefaultOnClick}>
-            Base Button
-          </BaseButton>
-        );
-
-        component.find('button')?.trigger('onClick', mouseEvent);
-
-        expect(mockOnClick).toHaveBeenCalledWith(mouseEvent);
-        expect(mockDefaultOnClick).not.toBeCalled();
-      });
-    });
-
-    describe('and the on click handler returns false', () => {
-      it('calls the on click event handler without calling the default on click behaviour', () => {
-        const mockOnClick = jest.fn(() => false);
-        const mockDefaultOnClick = jest.fn();
-        const mouseEvent = new MouseEvent('click', {cancelable: true});
-
-        const component = mountWithProviders(
-          <BaseButton onClick={mockOnClick} defaultOnClick={mockDefaultOnClick}>
-            Base Button
-          </BaseButton>
-        );
-
-        component.find('button')?.trigger('onClick', mouseEvent);
-
-        expect(mockOnClick).toBeCalledWith(mouseEvent);
-        expect(mockDefaultOnClick).not.toBeCalled();
-      });
-    });
-  });
-});
diff --git a/packages/hydrogen/src/components/BaseButton/tests/BaseButton.vitest.tsx b/packages/hydrogen/src/components/BaseButton/tests/BaseButton.vitest.tsx
new file mode 100644
index 0000000000..848b6518ae
--- /dev/null
+++ b/packages/hydrogen/src/components/BaseButton/tests/BaseButton.vitest.tsx
@@ -0,0 +1,103 @@
+import React from 'react';
+import {ShopifyTestProviders} from '../../../utilities/tests/provider-helpers.js';
+import {render, screen} from '@testing-library/react';
+import {BaseButton} from '../BaseButton.client.js';
+import {vi} from 'vitest';
+import userEvent from '@testing-library/user-event';
+
+describe('BaseButton', () => {
+  it('renders a button', () => {
+    render(<BaseButton>Base Button</BaseButton>, {
+      wrapper: ShopifyTestProviders,
+    });
+
+    expect(screen.getByRole('button')).toHaveTextContent('Base Button');
+  });
+
+  it('allows passthrough props', () => {
+    render(<BaseButton className="bg-blue-600">Base Button</BaseButton>, {
+      wrapper: ShopifyTestProviders,
+    });
+
+    expect(screen.getByRole('button')).toHaveClass('bg-blue-600');
+  });
+
+  describe('given an on click event handler', () => {
+    it('calls the on click event handler', async () => {
+      const mockOnClick = vi.fn();
+      const user = userEvent.setup();
+
+      render(<BaseButton onClick={mockOnClick}>Base Button</BaseButton>, {
+        wrapper: ShopifyTestProviders,
+      });
+
+      await user.click(screen.getByRole('button'));
+
+      expect(mockOnClick).toBeCalled();
+    });
+
+    it('calls the given default on click behaviour', async () => {
+      const mockDefaultOnClick = vi.fn();
+      const user = userEvent.setup();
+
+      render(
+        <BaseButton onClick={() => {}} defaultOnClick={mockDefaultOnClick}>
+          Base Button
+        </BaseButton>,
+        {
+          wrapper: ShopifyTestProviders,
+        }
+      );
+
+      await user.click(screen.getByRole('button'));
+
+      expect(mockDefaultOnClick).toBeCalled();
+    });
+
+    describe('and event preventDefault is called', () => {
+      it('calls the on click event handler without calling the default on click behaviour', async () => {
+        const mockOnClick = vi.fn((event) => {
+          event.preventDefault();
+        });
+        const mockDefaultOnClick = vi.fn();
+        const user = userEvent.setup();
+
+        render(
+          <BaseButton onClick={mockOnClick} defaultOnClick={mockDefaultOnClick}>
+            Base Button
+          </BaseButton>,
+          {
+            wrapper: ShopifyTestProviders,
+          }
+        );
+
+        await user.click(screen.getByRole('button'));
+
+        expect(mockOnClick).toBeCalled();
+        expect(mockDefaultOnClick).not.toBeCalled();
+      });
+    });
+
+    describe('and the on click handler returns false', () => {
+      it('calls the on click event handler without calling the default on click behaviour', async () => {
+        const mockOnClick = vi.fn(() => false);
+        const mockDefaultOnClick = vi.fn();
+        const user = userEvent.setup();
+
+        render(
+          <BaseButton onClick={mockOnClick} defaultOnClick={mockDefaultOnClick}>
+            Base Button
+          </BaseButton>,
+          {
+            wrapper: ShopifyTestProviders,
+          }
+        );
+
+        await user.click(screen.getByRole('button'));
+
+        expect(mockOnClick).toBeCalled();
+        expect(mockDefaultOnClick).not.toBeCalled();
+      });
+    });
+  });
+});