@pequity/squirrel 5.2.1 → 5.2.3

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

@@ -1,6 +1,7 @@
 import PIcon from '@squirrel/components/p-icon/p-icon.vue';
 import { P_ICON_ALIASES } from '@squirrel/components/p-icon/p-icon.types';
-import { createWrapperFor } from '@tests/jest.helpers';
+import { createWrapperFor } from '@tests/vitest.helpers';
+import { expect } from 'vitest';
 
 const createWrapper = (props, attrs) => {
   return createWrapperFor(PIcon, {
@@ -9,11 +10,6 @@ const createWrapper = (props, attrs) => {
       ...props,
     },
     attrs,
-    global: {
-      stubs: {
-        'iconify-icon': true,
-      },
-    },
   });
 };
 
@@ -23,43 +19,34 @@ describe('PIcon.vue', () => {
       icon: 'ant-design:build-twotone',
     });
 
-    const icon = wrapper.findComponent('iconify-icon-stub');
+    const icon = wrapper.findComponent('iconify-icon');
 
     expect(icon.exists()).toBe(true);
-    expect(icon.attributes().icon).toBe('ant-design:build-twotone');
+    expect(icon.props().icon).toBe('ant-design:build-twotone');
   });
 
   it('passes arbitrary attrs to the icon component', async () => {
     const wrapper = createWrapper({}, { 'data-test': 'test' });
 
-    const icon = wrapper.findComponent('iconify-icon-stub');
+    const icon = wrapper.findComponent('iconify-icon');
 
     expect(icon.attributes()['data-test']).toBe('test');
   });
 
   it('passes down events to the icon component', async () => {
-    const clickFn = jest.fn();
+    const clickFn = vi.fn();
 
-    const wrapper = createWrapperFor(
-      {
-        template: '<PIcon icon="ant-design:build-twotone" @click="onClick" />',
-        components: {
-          PIcon,
-        },
-        methods: {
-          onClick: clickFn,
-        },
+    const wrapper = createWrapperFor({
+      template: '<PIcon icon="ant-design:build-twotone" @click="onClick" />',
+      components: {
+        PIcon,
       },
-      {
-        global: {
-          stubs: {
-            'iconify-icon': true,
-          },
-        },
-      }
-    );
+      methods: {
+        onClick: clickFn,
+      },
+    });
 
-    const icon = wrapper.findComponent('iconify-icon-stub');
+    const icon = wrapper.findComponent('iconify-icon');
 
     await icon.trigger('click');
 
@@ -71,7 +58,7 @@ describe('PIcon.vue', () => {
     async (iconAliasKey, iconAlias) => {
       const wrapper = createWrapper({ icon: iconAliasKey });
 
-      const icon = wrapper.findComponent('iconify-icon-stub');
+      const icon = wrapper.findComponent('iconify-icon');
 
       expect(icon.attributes().icon).toBe(iconAlias);
     }

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

@@ -1,5 +1,5 @@
 import PInfoIcon from '@squirrel/components/p-info-icon/p-info-icon.vue';
-import { createWrapperFor } from '@tests/jest.helpers';
+import { createWrapperFor } from '@tests/vitest.helpers';
 
 describe('PInfoIcon.vue', () => {
   it('renders an info icon', async () => {
@@ -55,6 +55,7 @@ describe('PInfoIcon.vue', () => {
     });
 
     expect(wrapper.text()).toBe('Lorem ipsum dolor sit amet.');
+    expect(wrapper.attributes().disabled).toBe('false');
   });
 
   it('tooltip should stay visible on hover', async () => {

package/squirrel/components/p-info-icon/p-info-icon.vue

@@ -1,5 +1,5 @@
 <template>
-  <VTooltip :popper-triggers="['hover']" :delay="{ show: 750, hide: 0 }" :disabled="!text">
+  <VTooltip :popper-triggers="['hover']" :delay="{ show: 750, hide: 0 }" :disabled="!$slots.default && !text">
     <i class="bg-info-circle-icon block h-3 w-3"></i>
     <template #popper>
       <slot>{{ text }}</slot>
@@ -13,7 +13,7 @@ defineOptions({
 });
 
 type Props = {
-  text: string | null;
+  text?: string | null;
 };
 
 withDefaults(defineProps<Props>(), {

package/squirrel/components/p-inline-date-picker/p-inline-date-picker.spec.js

@@ -1,5 +1,5 @@
 import PInlineDatePicker from '@squirrel/components/p-inline-date-picker/p-inline-date-picker.vue';
-import { createWrapperFor } from '@tests/jest.helpers';
+import { createWrapperFor } from '@tests/vitest.helpers';
 
 const createWrapper = (props) => {
   return createWrapperFor(PInlineDatePicker, {
@@ -81,9 +81,9 @@ describe('PInlineDatePicker.vue', () => {
   it('passes listeners to the datepicker', () => {
     // Since DatePicker emits are not defined on PInlineDatePicker we need to Spy on console.warn and mock the implementation to suppress the warning:
     // [Vue warn]: Component emitted event "update:view" but it is neither declared in the emits option nor as an "onUpdate:view" prop.
-    const warnSpy = jest.spyOn(console, 'warn').mockImplementation(() => {});
+    const warnSpy = vi.spyOn(console, 'warn').mockImplementation(() => {});
 
-    const testFn = jest.fn();
+    const testFn = vi.fn();
 
     const wrapper = createWrapperFor({
       template: `<PInlineDatePicker v-model="dateStrVal" @update:view="testEvent" />`,
@@ -139,7 +139,7 @@ describe('PInlineDatePicker.vue', () => {
     const wrapper = createWrapper({ modelValue: '2024-09-01' });
 
     const datePicker = wrapper.findComponent({ name: 'DatePicker' });
-    datePicker.vm.move = jest.fn();
+    datePicker.vm.move = vi.fn();
 
     expect(datePicker.props().modelValue).toEqual(new Date('2024-09-01'));
 

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 () => {