From 9bdbd83198a865a91d0459095dcce4271d036ad3 Mon Sep 17 00:00:00 2001
From: albertjcuac <albertjcuac@gmail.com>
Date: Mon, 19 Aug 2024 12:38:19 +0200
Subject: [PATCH] test: fix use disable animation test

---
 .../__tests__/use-disable-animation.spec.ts   | 31 ++++++-------------
 1 file changed, 10 insertions(+), 21 deletions(-)

diff --git a/packages/x-components/src/components/animations/__tests__/use-disable-animation.spec.ts b/packages/x-components/src/components/animations/__tests__/use-disable-animation.spec.ts
index 91a642a215..33a09a2542 100644
--- a/packages/x-components/src/components/animations/__tests__/use-disable-animation.spec.ts
+++ b/packages/x-components/src/components/animations/__tests__/use-disable-animation.spec.ts
@@ -1,23 +1,18 @@
 import { mount } from '@vue/test-utils';
-import { defineComponent, provide, ref } from 'vue';
+import { defineComponent, provide, ref, h, Transition } from 'vue';
 import { DISABLE_ANIMATIONS_KEY } from '../../decorators/injection.consts';
 import { useDisableAnimation } from '../use-disable-animation';
-
+import { TransitionGroup } from 'vue';
 const Provider = defineComponent({
   props: {
     disableAnimation: Boolean
   },
-  setup(props) {
+  setup(props, { slots }) {
     provide(DISABLE_ANIMATIONS_KEY as string, ref(props.disableAnimation));
-  },
-  render(h) {
-    return this.$slots.default?.[0] ?? h();
+    return () => (slots.default ? slots.default() : h('div'));
   }
 });
 
-/**
- * Animation component.
- */
 const Animation = defineComponent({
   setup() {
     return useDisableAnimation('x-animation');
@@ -29,12 +24,6 @@ const Animation = defineComponent({
   `
 });
 
-/**
- * Function that returns an Animation wrapper.
- *
- * @param disableAnimation - Flag to disable the animation.
- * @returns Animation wrapper.
- */
 function renderDisableAnimation({ disableAnimation = true }: DisableAnimationOptions = {}) {
   const wrapper = mount({
     template: `
@@ -51,25 +40,25 @@ function renderDisableAnimation({ disableAnimation = true }: DisableAnimationOpt
   });
 
   return {
-    wrapper
+    wrapper,
+    transitionGroup: wrapper.findComponent(TransitionGroup)
   };
 }
 
 describe('testing disable animation', () => {
   it('should disable the animations', () => {
-    const { wrapper } = renderDisableAnimation();
+    const { transitionGroup } = renderDisableAnimation();
 
-    expect(wrapper.attributes('name')).toBe('__no-animation__');
+    expect(transitionGroup.attributes('name')).toBe('__no-animation__');
   });
 
   it('should enable the animations', () => {
-    const { wrapper } = renderDisableAnimation({ disableAnimation: false });
+    const { transitionGroup } = renderDisableAnimation({ disableAnimation: false });
 
-    expect(wrapper.attributes('name')).toBe('x-animation');
+    expect(transitionGroup.attributes('name')).toBe('x-animation');
   });
 });
 
 interface DisableAnimationOptions {
-  /** Flag to disable the animation. */
   disableAnimation?: boolean;
 }