@pequity/squirrel 5.2.2 → 5.2.3

package/squirrel/components/p-input/p-input.spec.js

@@ -1,5 +1,5 @@
 import PInput from '@squirrel/components/p-input/p-input.vue';
-import { createWrapperFor } from '@tests/jest.helpers';
+import { createWrapperFor } from '@tests/vitest.helpers';
 
 describe('PInput.vue', () => {
   it('renders correctly', async () => {

package/squirrel/components/p-input-number/p-input-number.spec.js

@@ -1,5 +1,5 @@
 import PInputNumber from '@squirrel/components/p-input-number/p-input-number.vue';
-import { createWrapperFor } from '@tests/jest.helpers';
+import { createWrapperFor } from '@tests/vitest.helpers';
 
 const baseClasses = () => [
   'text-night',

package/squirrel/components/p-input-percent/p-input-percent.spec.js

@@ -1,5 +1,5 @@
 import PInputPercent from '@squirrel/components/p-input-percent/p-input-percent.vue';
-import { createWrapperFor } from '@tests/jest.helpers';
+import { createWrapperFor } from '@tests/vitest.helpers';
 
 const prefixClasses = {
   sm: 'text-sm h-8 left-2',

package/squirrel/components/p-input-search/p-input-search.spec.js

@@ -1,5 +1,5 @@
 import PInputSearch from '@squirrel/components/p-input-search/p-input-search.vue';
-import { createWrapperFor } from '@tests/jest.helpers';
+import { createWrapperFor } from '@tests/vitest.helpers';
 
 describe('PInputSearch.vue', () => {
   it('renders correctly', async () => {

package/squirrel/components/p-input-search/p-input-search.vue

@@ -92,7 +92,7 @@ export default defineComponent({
     clearSearch() {
       this.query = '';
       requestAnimationFrame(() => {
-        (this.$refs.searchInput as PInputInstance).$el.querySelector('input').focus();
+        (this.$refs.searchInput as PInputInstance)?.$el.querySelector('input').focus();
       });
     },
     keydownEnter() {

package/squirrel/components/p-link/p-link.spec.js

@@ -1,11 +1,11 @@
 import PLink from '@squirrel/components/p-link/p-link.vue';
-import { createWrapperFor } from '@tests/jest.helpers';
+import { createWrapperFor } from '@tests/vitest.helpers';
 import { isExternalLink } from '@squirrel/utils/link';
 import { sanitizeUrl } from '@squirrel/utils/sanitization';
 
-jest.mock('@squirrel/utils/sanitization');
+vi.mock('@squirrel/utils/sanitization');
 
-jest.mock('@squirrel/utils/link');
+vi.mock('@squirrel/utils/link');
 
 const createWrapper = (props, attrs) => {
   return createWrapperFor(PLink, {
@@ -23,10 +23,6 @@ const createWrapper = (props, attrs) => {
 };
 
 describe('PLink.vue', () => {
-  afterEach(() => {
-    jest.clearAllMocks();
-  });
-
   it('renders a router link when the link is internal', () => {
     isExternalLink.mockReturnValue(false);
 

package/squirrel/components/p-loading/p-loading.spec.js

@@ -1,6 +1,6 @@
 import PLoading from '@squirrel/components/p-loading/p-loading.vue';
 import PSkeletonLoader from '@squirrel/components/p-skeleton-loader/p-skeleton-loader.vue';
-import { createWrapperFor, waitNT } from '@tests/jest.helpers';
+import { createWrapperFor, waitNT } from '@tests/vitest.helpers';
 import { defineComponent, ref } from 'vue';
 import { usePLoading } from '@squirrel/components/p-loading/usePLoading';
 
@@ -65,11 +65,11 @@ describe('PLoading.vue', () => {
   let appWrapper;
 
   beforeAll(() => {
-    jest.useFakeTimers();
+    vi.useFakeTimers();
   });
 
   afterAll(() => {
-    jest.useRealTimers();
+    vi.useRealTimers();
   });
 
   beforeEach(() => {
@@ -94,7 +94,7 @@ describe('PLoading.vue', () => {
     const wrapper = createWrapper({ delay: 1000 });
 
     await wrapper.find('.show').trigger('click');
-    jest.advanceTimersByTime(500);
+    vi.advanceTimersByTime(500);
     await waitNT(appWrapper.vm);
     expect(appWrapper.find('[aria-busy]').exists()).toBe(false);
   });
@@ -104,11 +104,11 @@ describe('PLoading.vue', () => {
 
     await wrapper.find('.request-1-sec').trigger('click');
 
-    jest.advanceTimersByTime(500);
+    vi.advanceTimersByTime(500);
     await waitNT(appWrapper.vm);
     expect(appWrapper.find('[aria-busy]').exists()).toBe(true);
 
-    jest.advanceTimersByTime(1000);
+    vi.advanceTimersByTime(1000);
     await waitNT(appWrapper.vm);
     expect(appWrapper.find('[aria-busy]').exists()).toBe(false);
   });
@@ -118,13 +118,13 @@ describe('PLoading.vue', () => {
 
     await wrapper.find('.request-1-sec').trigger('click');
 
-    jest.advanceTimersByTime(500);
+    vi.advanceTimersByTime(500);
     await waitNT(appWrapper.vm);
     expect(appWrapper.find('[aria-busy]').exists()).toBe(true);
 
     await wrapper.find('.request-3-secs').trigger('click');
 
-    jest.advanceTimersByTime(500);
+    vi.advanceTimersByTime(500);
     await waitNT(appWrapper.vm);
 
     await wrapper.find('.hide').trigger('click');
@@ -136,17 +136,17 @@ describe('PLoading.vue', () => {
 
     await wrapper.find('.request-1-sec').trigger('click');
 
-    jest.advanceTimersByTime(500);
+    vi.advanceTimersByTime(500);
     await waitNT(appWrapper.vm);
     expect(appWrapper.find('[aria-busy]').exists()).toBe(true);
 
     await wrapper.find('.request-3-secs').trigger('click');
 
-    jest.advanceTimersByTime(1000);
+    vi.advanceTimersByTime(1000);
     await waitNT(appWrapper.vm);
     expect(appWrapper.find('[aria-busy]').exists()).toBe(true);
 
-    jest.advanceTimersByTime(2000);
+    vi.advanceTimersByTime(2000);
     await waitNT(appWrapper.vm);
     expect(appWrapper.find('[aria-busy]').exists()).toBe(false);
   });
@@ -156,13 +156,13 @@ describe('PLoading.vue', () => {
 
     await wrapper.find('.show').trigger('click');
 
-    jest.advanceTimersByTime(500);
+    vi.advanceTimersByTime(500);
     await waitNT(appWrapper.vm);
     expect(appWrapper.find('[aria-busy]').exists()).toBe(false);
 
     await wrapper.find('.show').trigger('click');
 
-    jest.advanceTimersByTime(200);
+    vi.advanceTimersByTime(200);
     await waitNT(appWrapper.vm);
     expect(appWrapper.find('[aria-busy]').exists()).toBe(true);
   });
@@ -172,21 +172,21 @@ describe('PLoading.vue', () => {
 
     await wrapper.find('.request-3-secs-text').trigger('click');
 
-    jest.advanceTimersByTime(300);
+    vi.advanceTimersByTime(300);
     await waitNT(appWrapper.vm);
     expect(appWrapper.find('[aria-busy]').text()).toBe('3 secs');
 
     await wrapper.find('.request-1-sec-text').trigger('click');
 
-    jest.advanceTimersByTime(300);
+    vi.advanceTimersByTime(300);
     await waitNT(appWrapper.vm);
     expect(appWrapper.find('[aria-busy]').text()).toBe('1 sec');
 
-    jest.advanceTimersByTime(1200);
+    vi.advanceTimersByTime(1200);
     await waitNT(appWrapper.vm);
     expect(appWrapper.find('[aria-busy]').text()).toBe('3 secs');
 
-    jest.advanceTimersByTime(1200);
+    vi.advanceTimersByTime(1200);
     await waitNT(appWrapper.vm);
     expect(appWrapper.find('[aria-busy]').exists()).toBe(false);
   });
@@ -196,12 +196,12 @@ describe('PLoading.vue', () => {
 
     await wrapper.find('.request-1-sec-component').trigger('click');
 
-    jest.advanceTimersByTime(300);
+    vi.advanceTimersByTime(300);
     await waitNT(appWrapper.vm);
     expect(appWrapper.find('[aria-busy]').exists()).toBe(true);
     expect(appWrapper.findComponent(PSkeletonLoader).exists()).toBe(true);
 
-    jest.advanceTimersByTime(800);
+    vi.advanceTimersByTime(800);
     await waitNT(appWrapper.vm);
     expect(appWrapper.find('[aria-busy]').exists()).toBe(false);
   });
@@ -270,7 +270,7 @@ describe('PLoading.vue', () => {
 
     await wrapper.find('.request-1-sec-component-props').trigger('click');
 
-    jest.advanceTimersByTime(300);
+    vi.advanceTimersByTime(300);
     await waitNT(appWrapper.vm);
     const getTestComponent = () => appWrapper.findComponent(TestComponent);
 
@@ -278,12 +278,12 @@ describe('PLoading.vue', () => {
     expect(getTestComponent().exists()).toBe(true);
     expect(getTestComponent().props().modelValue).toBe(10);
 
-    jest.advanceTimersByTime(300);
+    vi.advanceTimersByTime(300);
     await waitNT(appWrapper.vm);
     await wrapper.find('.update-props').trigger('click');
     expect(getTestComponent().props().modelValue).toBe(20);
 
-    jest.advanceTimersByTime(500);
+    vi.advanceTimersByTime(500);
     await waitNT(appWrapper.vm);
     expect(appWrapper.find('[aria-busy]').exists()).toBe(false);
   });
@@ -293,7 +293,7 @@ describe('PLoading.vue', () => {
 
     await wrapper.find('.request-1-sec-component').trigger('click');
 
-    jest.advanceTimersByTime(300);
+    vi.advanceTimersByTime(300);
     await waitNT(appWrapper.vm);
 
     expect(wrapper.vm.show).toBe(true);

package/squirrel/components/p-modal/p-modal-basic.spec.js

@@ -1,6 +1,6 @@
 import PModal from '@squirrel/components/p-modal/p-modal.vue';
 import { mount } from '@vue/test-utils';
-import { waitRAF } from '@tests/jest.helpers';
+import { waitRAF } from '@tests/vitest.helpers';
 
 const createWrapperContainer = (componentArgs) => {
   const args = componentArgs || {};

package/squirrel/components/p-modal/p-modal-events.spec.js

@@ -1,6 +1,6 @@
 import PModal from '@squirrel/components/p-modal/p-modal.vue';
 import { mount } from '@vue/test-utils';
-import { sleep, waitRAF } from '@tests/jest.helpers';
+import { sleep, waitRAF } from '@tests/vitest.helpers';
 
 const createWrapper = () => {
   return mount(PModal, {

package/squirrel/components/p-modal/p-modal-features.spec.js

@@ -1,6 +1,6 @@
 import PModal from '@squirrel/components/p-modal/p-modal.vue';
 import { mount } from '@vue/test-utils';
-import { sleep, waitNT } from '@tests/jest.helpers';
+import { sleep, waitNT } from '@tests/vitest.helpers';
 
 const originalOffsetHeight = Object.getOwnPropertyDescriptor(HTMLElement.prototype, 'offsetHeight');
 const originalOffsetWidth = Object.getOwnPropertyDescriptor(HTMLElement.prototype, 'offsetWidth');

package/squirrel/components/p-modal/p-modal.vue

@@ -277,6 +277,10 @@ const getTopZindex = () => {
 };
 
 const handleFocus = (wrapper: HTMLElement) => {
+  if (!wrapper) {
+    return;
+  }
+
   const autofocus = wrapper.querySelector('[autofocus]') as HTMLElement;
 
   if (autofocus) {

package/squirrel/components/p-pagination/p-pagination.spec.js

@@ -1,5 +1,5 @@
 import PPagination from '@squirrel/components/p-pagination/p-pagination.vue';
-import { createWrapperFor } from '@tests/jest.helpers';
+import { createWrapperFor } from '@tests/vitest.helpers';
 
 describe('PPagination.vue', () => {
   it('renders the controls correctly', async () => {

package/squirrel/components/p-pagination-info/p-pagination-info.spec.js

@@ -1,5 +1,5 @@
 import PPaginationInfo from '@squirrel/components/p-pagination-info/p-pagination-info.vue';
-import { createWrapperFor } from '@tests/jest.helpers';
+import { createWrapperFor } from '@tests/vitest.helpers';
 
 describe('PPaginationInfo.vue', () => {
   it.each([

package/squirrel/components/p-progress-bar/p-progess-bar.spec.js

@@ -1,5 +1,5 @@
 import PProgressBar from '@squirrel/components/p-progress-bar/p-progress-bar.vue';
-import { createWrapperFor } from '@tests/jest.helpers';
+import { createWrapperFor } from '@tests/vitest.helpers';
 
 const items = [
   { vaLue: 50, label: 'bar1', color: 'rgb(204, 204, 204)' },

package/squirrel/components/p-ring-loader/p-ring-loader.spec.js

@@ -1,5 +1,5 @@
 import PRingLoader from '@squirrel/components/p-ring-loader/p-ring-loader.vue';
-import { createWrapperFor } from '@tests/jest.helpers';
+import { createWrapperFor } from '@tests/vitest.helpers';
 
 describe('PRingLoader.vue', () => {
   it('renders correctly with custom props', async () => {

package/squirrel/components/p-select/p-select.spec.js

@@ -1,6 +1,6 @@
 import PSelect from '@squirrel/components/p-select/p-select.vue';
 import { cloneDeep } from 'lodash-es';
-import { createWrapperFor, sleep, waitNT } from '@tests/jest.helpers';
+import { createWrapperFor, sleep, waitNT } from '@tests/vitest.helpers';
 
 const baseClasses = () => [
   'text-night',

package/squirrel/components/p-select-btn/p-select-btn.spec.js

@@ -1,6 +1,6 @@
 import PSelectBtn from '@squirrel/components/p-select-btn/p-select-btn.vue';
 import { cloneDeep } from 'lodash-es';
-import { createWrapperFor } from '@tests/jest.helpers';
+import { createWrapperFor } from '@tests/vitest.helpers';
 
 const items = [
   { textCustom: 'Option 1', valueCustom: 1 },

package/squirrel/components/p-select-list/p-select-list.spec.js

@@ -1,12 +1,12 @@
 import PSelectList from '@squirrel/components/p-select-list/p-select-list.vue';
 import filterListItems from '@squirrel/components/p-dropdown-select/p-dropdown-select.mock.json';
 import { cloneDeep } from 'lodash-es';
-import { createWrapperFor, sleep } from '@tests/jest.helpers';
+import { createWrapperFor, sleep } from '@tests/vitest.helpers';
 import { ref } from 'vue';
 import { useVirtualizer } from '@tanstack/vue-virtual';
 
-jest.mock('@tanstack/vue-virtual', () => ({
-  useVirtualizer: jest.fn(),
+vi.mock('@tanstack/vue-virtual', () => ({
+  useVirtualizer: vi.fn(),
 }));
 
 const createMockedVirtualizer = (count) => {
@@ -67,13 +67,12 @@ const cleanup = async (wrapper) => {
 
 describe('PSelectList.vue', () => {
   beforeEach(() => {
-    jest.spyOn(console, 'warn').mockImplementation(() => {});
+    vi.spyOn(console, 'warn').mockImplementation(() => {});
   });
 
   // When using `attachTo: document.body` we have to cleanup the DOM and call `wrapper.destroy()` after each test
   afterEach(() => {
     document.body.innerHTML = '';
-    jest.clearAllMocks();
   });
 
   it('renders correctly', async () => {

package/squirrel/components/p-select-pill/p-select-pill.spec.js

@@ -1,5 +1,5 @@
 import PSelectPill from '@squirrel/components/p-select-pill/p-select-pill.vue';
-import { createWrapperFor } from '@tests/jest.helpers';
+import { createWrapperFor } from '@tests/vitest.helpers';
 
 const ACTIVE_CLASS = 'text-p-purple-60';
 

package/squirrel/components/p-skeleton-loader/p-skeleton-loader.spec.js

@@ -1,5 +1,5 @@
 import PSkeletonLoader from '@squirrel/components/p-skeleton-loader/p-skeleton-loader.vue';
-import { createWrapperFor } from '@tests/jest.helpers';
+import { createWrapperFor } from '@tests/vitest.helpers';
 
 describe('PSkeletonLoader.vue', () => {
   it.each([

package/squirrel/components/p-table/p-table.spec.js

@@ -5,7 +5,7 @@ import {
   isFirstColFixedInjectionKey,
   isLastColFixedInjectionKey,
 } from '@squirrel/components/p-table/p-table.types';
-import { createWrapperFor } from '@tests/jest.helpers';
+import { createWrapperFor } from '@tests/vitest.helpers';
 import { defineComponent, h, inject } from 'vue';
 
 const columns = [

package/squirrel/components/p-table-header-cell/p-filter-icon.spec.js

@@ -1,5 +1,5 @@
 import PFilterIcon from '@squirrel/components/p-table-header-cell/p-table-filter-icon.vue';
-import { createWrapperFor } from '@tests/jest.helpers';
+import { createWrapperFor } from '@tests/vitest.helpers';
 
 describe('PFilterIcon.vue', () => {
   it('renders a filter icon', async () => {

package/squirrel/components/p-table-header-cell/p-table-header-cell.spec.js

@@ -1,6 +1,6 @@
 import PFilterIcon from '@squirrel/components/p-table-header-cell/p-table-filter-icon.vue';
 import PTableHeaderCell from '@squirrel/components/p-table-header-cell/p-table-header-cell.vue';
-import { createWrapperFor } from '@tests/jest.helpers';
+import { createWrapperFor } from '@tests/vitest.helpers';
 
 describe('PTableHeaderCell.vue', () => {
   it('renders correctly', async () => {

package/squirrel/components/p-table-loader/p-table-loader.spec.js

@@ -1,6 +1,6 @@
 import PTable from '@squirrel/components/p-table/p-table.vue';
 import PTableLoader from '@squirrel/components/p-table-loader/p-table-loader.vue';
-import { createWrapperFor } from '@tests/jest.helpers';
+import { createWrapperFor } from '@tests/vitest.helpers';
 
 describe('PTableLoader.vue', () => {
   it('matches the PTable classes', async () => {

package/squirrel/components/p-table-sort/p-table-sort.spec.js

@@ -1,6 +1,6 @@
 import PTableSort from '@squirrel/components/p-table-sort/p-table-sort.vue';
 import { SORTING_TYPES } from '@squirrel/components/p-table-sort/p-table-sort.config';
-import { createWrapperFor } from '@tests/jest.helpers';
+import { createWrapperFor } from '@tests/vitest.helpers';
 
 describe('PTableSort.vue', () => {
   it('renders correctly', async () => {

package/squirrel/components/p-table-td/p-table-td.spec.js

@@ -1,10 +1,12 @@
 import PTableTd from '@squirrel/components/p-table-td/p-table-td.vue';
 import {
   colsInjectionKey,
+  isColsResizableInjectionKey,
   isFirstColFixedInjectionKey,
   isLastColFixedInjectionKey,
 } from '@squirrel/components/p-table/p-table.types';
-import { createWrapperFor } from '@tests/jest.helpers';
+import { createWrapperFor } from '@tests/vitest.helpers';
+import { expect } from 'vitest';
 import { ref } from 'vue';
 
 const DEFAULT_TD_CLASSES = [
@@ -23,6 +25,16 @@ const DEFAULT_TD_CLASSES = [
 
 const DEFAULT_INNER_DIV_CLASSES = ['w-max', 'px-2'];
 
+const GRADIENT_TD_CLASSES = [
+  'min-w-[80px]',
+  'border-l',
+  'border-p-gray-30',
+  'bg-gradient-to-r',
+  'from-white',
+  'via-p-gray-10',
+  'to-p-gray-10',
+];
+
 describe('PTableTd.vue', () => {
   it('renders a td', async () => {
     const wrapper = createWrapperFor(PTableTd, {
@@ -145,4 +157,27 @@ describe('PTableTd.vue', () => {
 
     expect([...innerDiv.classes()].sort()).toEqual(['w-max', 'pl-2', 'pr-4'].sort());
   });
+
+  it(`renders a td with a gradient when it's the last sticky column`, async () => {
+    const wrapper = createWrapperFor(PTableTd, {
+      props: { colIndex: 2, isEditable: true },
+      slots: { default: `Cell content` },
+      global: {
+        provide: {
+          [colsInjectionKey]: ref([{ id: 1 }, { id: 2 }, { id: 3 }]),
+          [isColsResizableInjectionKey]: ref(true),
+          [isLastColFixedInjectionKey]: ref(false),
+        },
+      },
+    });
+
+    const tds = wrapper.findAll('td');
+
+    expect(tds.length).toBe(2);
+
+    const gradientTd = tds[1];
+
+    expect(gradientTd.exists()).toBe(true);
+    expect(gradientTd.classes()).toEqual(GRADIENT_TD_CLASSES);
+  });
 });

package/squirrel/components/p-tabs/p-tabs.spec.js

@@ -1,5 +1,5 @@
 import PTabs from '@squirrel/components/p-tabs/p-tabs.vue';
-import { createWrapperFor } from '@tests/jest.helpers';
+import { createWrapperFor } from '@tests/vitest.helpers';
 import { markRaw } from 'vue';
 
 const Tab1Icon = markRaw({ template: `<i data-icon="icon-tab1"></i>` });

package/squirrel/components/p-textarea/p-textarea.spec.js

@@ -1,5 +1,5 @@
 import PTextarea from '@squirrel/components/p-textarea/p-textarea.vue';
-import { createWrapperFor } from '@tests/jest.helpers';
+import { createWrapperFor } from '@tests/vitest.helpers';
 
 describe('PTextarea.vue', () => {
   it('renders correctly', async () => {

package/squirrel/components/p-toggle/p-toggle.spec.js

@@ -1,5 +1,5 @@
 import PToggle from '@squirrel/components/p-toggle/p-toggle.vue';
-import { createWrapperFor } from '@tests/jest.helpers';
+import { createWrapperFor } from '@tests/vitest.helpers';
 
 describe('PToggle.vue', () => {
   it('renders correctly', async () => {

package/squirrel/composables/useInputClasses.spec.js

@@ -1,3 +1,4 @@
+import { SPACING_LEFT, SPACING_PREFIX, SPACING_RIGHT, SPACING_SUFFIX } from '@squirrel/utils/inputClassesShared';
 import { reactive } from 'vue';
 import { useInputClasses } from '@squirrel/composables/useInputClasses';
 
@@ -164,4 +165,44 @@ describe('useInputClasses', () => {
     );
     expect(errorMsgClasses.value).toBe('text-xs text-on-error mt-1');
   });
+
+  it('should apply the SPACING_PREFIX when prefix is true', () => {
+    const props = reactive({
+      size: 'md',
+      prefix: true,
+    });
+    const { inputClasses } = useInputClasses(props);
+
+    expect(inputClasses.value).toContain(SPACING_PREFIX.md);
+  });
+
+  it('should apply the SPACING_SUFFIX when suffix is true', () => {
+    const props = reactive({
+      size: 'md',
+      suffix: true,
+    });
+    const { inputClasses } = useInputClasses(props);
+
+    expect(inputClasses.value).toContain(SPACING_SUFFIX.md);
+  });
+
+  it('should apply SPACING_LEFT when prefix is false', () => {
+    const props = reactive({
+      size: 'md',
+      prefix: false,
+    });
+    const { inputClasses } = useInputClasses(props);
+
+    expect(inputClasses.value).toContain(SPACING_LEFT.md);
+  });
+
+  it('should apply SPACING_RIGHT when suffix is false', () => {
+    const props = reactive({
+      size: 'md',
+      suffix: false,
+    });
+    const { inputClasses } = useInputClasses(props);
+
+    expect(inputClasses.value).toContain(SPACING_RIGHT.md);
+  });
 });

package/squirrel/index.spec.js

@@ -0,0 +1,21 @@
+describe('index.ts module exports', () => {
+  it('should export from @squirrel/tailwind/config', async () => {
+    const config = await import('@squirrel/tailwind/config');
+    expect(config).toBeDefined();
+  });
+
+  it('should export from @squirrel/components', async () => {
+    const components = await import('@squirrel/components');
+    expect(components).toBeDefined();
+  });
+
+  it('should export from @squirrel/composables', async () => {
+    const composables = await import('@squirrel/composables');
+    expect(composables).toBeDefined();
+  });
+
+  it('should export from @squirrel/utils', async () => {
+    const utils = await import('@squirrel/utils');
+    expect(utils).toBeDefined();
+  });
+});

package/squirrel/utils/dom.spec.js

@@ -6,13 +6,12 @@ describe('isVisible', () => {
   beforeEach(() => {
     element = document.createElement('div');
     // Simulate element dimensions since jsdom doesn't support layout
-    jest.spyOn(element, 'offsetWidth', 'get').mockImplementation(() => 100);
-    jest.spyOn(element, 'offsetHeight', 'get').mockImplementation(() => 100);
+    vi.spyOn(element, 'offsetWidth', 'get').mockImplementation(() => 100);
+    vi.spyOn(element, 'offsetHeight', 'get').mockImplementation(() => 100);
   });
 
   afterEach(() => {
     element = null;
-    jest.clearAllMocks();
   });
 
   it('throws an error when no element is provided', () => {

package/squirrel/utils/listKeyboardNavigation.spec.js

@@ -53,20 +53,16 @@ describe('listKeyboardNavigation', () => {
   };
 
   it('initializes correctly', () => {
-    document.addEventListener = jest.fn().mockImplementationOnce();
+    document.addEventListener = vi.fn().mockImplementationOnce();
 
     const navigationSvc = createTestSvc();
 
     navigationSvc.init();
 
-    expect(navigationSvc).toHaveProperty(
-      'getItems',
-      'getFocusedItem',
-      'clearFocusedState',
-      'setFocusedItem',
-      'listKeydown',
-      'init',
-      'destroy'
+    ['getItems', 'getFocusedItem', 'clearFocusedState', 'setFocusedItem', 'listKeydown', 'init', 'destroy'].forEach(
+      (method) => {
+        expect(navigationSvc).toHaveProperty(method);
+      }
     );
 
     expect(document.addEventListener).toBeCalledWith('keydown', navigationSvc.listKeydown);

package/squirrel/utils/sanitization.spec.js

@@ -1,7 +1,7 @@
 import { sanitizeUrl } from '@squirrel/utils/sanitization';
 
 describe('sanitizeUrl', () => {
-  const consoleMock = jest.spyOn(console, 'warn').mockImplementation(() => undefined);
+  const consoleMock = vi.spyOn(console, 'warn').mockImplementation(() => undefined);
 
   afterAll(() => {
     consoleMock.mockReset();