Remove @symfony/stimulus-testing

Kocal · Kocal · commit 6ccc009d2ccb · 2025-06-29T14:44:40.000+02:00
diff --git a/package.json b/package.json
@@ -17,9 +17,12 @@
         "@rollup/plugin-commonjs": "^28.0.6",
         "@rollup/plugin-node-resolve": "^16.0.1",
         "@rollup/plugin-typescript": "^12.1.4",
-        "@symfony/stimulus-testing": "^2.0.1",
+        "@testing-library/dom": "^10.4.0",
+        "@testing-library/jest-dom": "^6.6.3",
+        "@testing-library/user-event": "^14.6.1",
         "@types/node": "^22.6.0",
         "@vitest/browser": "^2.1.1",
+        "jsdom": "^26.1.0",
         "lightningcss": "^1.28.2",
         "playwright": "^1.47.0",
         "rollup": "^4.44.1",
diff --git a/src/Cropperjs/assets/test/controller.test.ts b/src/Cropperjs/assets/test/controller.test.ts
@@ -8,8 +8,8 @@
  */
 
 import { Application, Controller } from '@hotwired/stimulus';
-import { clearDOM, mountDOM } from '@symfony/stimulus-testing';
 import { getByTestId, waitFor } from '@testing-library/dom';
+import { clearDOM, mountDOM } from '../../../../test/stimulus-helpers';
 import CropperjsController from '../src/controller';
 
 let cropper: Cropper | null = null;
@@ -44,7 +44,7 @@ describe('CropperjsController', () => {
     beforeEach(() => {
         container = mountDOM(`
             <div id="form_photo" class="cropperjs">
-                <input type="hidden" id="form_photo_options" name="form[photo][options]" 
+                <input type="hidden" id="form_photo_options" name="form[photo][options]"
                     data-testid="input"
                     data-controller="check cropperjs"
                     data-cropperjs-public-url-value="https://symfony.com/logos/symfony_black_02.png"
diff --git a/src/Dropzone/assets/test/controller.test.ts b/src/Dropzone/assets/test/controller.test.ts
@@ -8,9 +8,9 @@
  */
 
 import { Application, Controller } from '@hotwired/stimulus';
-import { clearDOM, mountDOM } from '@symfony/stimulus-testing';
 import { getByTestId, waitFor } from '@testing-library/dom';
 import user from '@testing-library/user-event';
+import { clearDOM, mountDOM } from '../../../../test/stimulus-helpers';
 import DropzoneController from '../src/controller';
 
 // Controller used to check the actual controller was properly booted
@@ -33,35 +33,35 @@ describe('DropzoneController', () => {
 
     beforeEach(() => {
         container = mountDOM(`
-            <div class="dropzone-container" data-controller="check dropzone" data-testid="container"> 
+            <div class="dropzone-container" data-controller="check dropzone" data-testid="container">
                 <input type="file"
                        style="display: none"
                        data-dropzone-target="input"
                        data-testid="input" />
-        
-                <div class="dropzone-placeholder" 
-                     data-dropzone-target="placeholder" 
+
+                <div class="dropzone-placeholder"
+                     data-dropzone-target="placeholder"
                      data-testid="placeholder">
                     Placeholder
                 </div>
-        
+
                 <div class="dropzone-preview"
                      data-dropzone-target="preview"
                      data-testid="preview"
                      style="display: none">
-                     
+
                     <button type="button"
                             class="dropzone-preview-button"
                             data-dropzone-target="previewClearButton"
                             data-testid="button"></button>
-        
+
                     <div class="dropzone-preview-image"
                          data-dropzone-target="previewImage"
                          data-testid="preview-image"
                          style="display: none"></div>
-        
+
                     <div class="dropzone-preview-filename"
-                         data-dropzone-target="previewFilename" 
+                         data-dropzone-target="previewFilename"
                          data-testid="preview-filename"></div>
                 </div>
             </div>
@@ -119,7 +119,7 @@ describe('DropzoneController', () => {
         const input = getByTestId(container, 'input');
         const file = new File(['hello'], 'hello.png', { type: 'image/png' });
 
-        user.upload(input, file);
+        await user.upload(input, file);
         expect(input.files[0]).toStrictEqual(file);
 
         // The dropzone should be in preview mode
diff --git a/src/LazyImage/assets/test/controller.test.ts b/src/LazyImage/assets/test/controller.test.ts
@@ -8,8 +8,8 @@
  */
 
 import { Application, Controller } from '@hotwired/stimulus';
-import { clearDOM, mountDOM } from '@symfony/stimulus-testing';
 import { getByTestId, waitFor } from '@testing-library/dom';
+import { clearDOM, mountDOM } from '../../../../test/stimulus-helpers';
 import LazyImageController from '../src/controller';
 
 // Controller used to check the actual controller was properly booted
@@ -35,7 +35,7 @@ describe('LazyImageController', () => {
 
     beforeEach(() => {
         container = mountDOM(`
-          <img 
+          <img
               src="https://symfony.com/logos/symfony_black_02.png"
               srcset="https://symfony.com/logos/symfony_black_02.png 1x, https://symfony.com/logos/symfony_black_02.png 2x"
               data-testid="img"
diff --git a/src/LiveComponent/assets/test/Rendering/ExternalMutationTracker.test.ts b/src/LiveComponent/assets/test/Rendering/ExternalMutationTracker.test.ts
@@ -100,7 +100,7 @@ describe('ExternalMutationTracker', () => {
         expect(changes.getChangedStyles()).toEqual([
             { name: 'display', value: 'inline' },
             { name: 'color', value: 'red' },
-            { name: 'background-image', value: 'url(https://example.com/image.png)' },
+            { name: 'background-image', value: 'url("https://example.com/image.png")' },
         ]);
         expect(changes.getRemovedStyles()).toEqual(['margin']);
     });
@@ -137,7 +137,7 @@ describe('ExternalMutationTracker', () => {
 
     it('can track class changes with whitespaces', async () => {
         const { element, tracker } = createTracker(`
-            <div 
+            <div
                 class="
                     first-class
                     second-class
diff --git a/src/Map/assets/test/abstract_map_controller.test.ts b/src/Map/assets/test/abstract_map_controller.test.ts
@@ -1,7 +1,6 @@
 import { Application } from '@hotwired/stimulus';
-import { clearDOM, mountDOM } from '@symfony/stimulus-testing';
 import { getByTestId, waitFor } from '@testing-library/dom';
-import * as L from 'leaflet';
+import { clearDOM, mountDOM } from '../../../../test/stimulus-helpers';
 import AbstractMapController from '../src/abstract_map_controller.ts';
 
 class MyMapController extends AbstractMapController {
diff --git a/src/Map/src/Bridge/Google/assets/test/map_controller.test.ts b/src/Map/src/Bridge/Google/assets/test/map_controller.test.ts
@@ -8,8 +8,8 @@
  */
 
 import { Application, Controller } from '@hotwired/stimulus';
-import { clearDOM, mountDOM } from '@symfony/stimulus-testing';
 import { getByTestId, waitFor } from '@testing-library/dom';
+import { clearDOM, mountDOM } from '../../../../test/stimulus-helpers';
 import GoogleController from '../src/map_controller';
 
 // Controller used to check the actual controller was properly booted
diff --git a/src/Map/src/Bridge/Leaflet/assets/test/map_controller.test.ts b/src/Map/src/Bridge/Leaflet/assets/test/map_controller.test.ts
@@ -8,8 +8,8 @@
  */
 
 import { Application, Controller } from '@hotwired/stimulus';
-import { clearDOM, mountDOM } from '@symfony/stimulus-testing';
 import { getByTestId, waitFor } from '@testing-library/dom';
+import { clearDOM, mountDOM } from '../../../../test/stimulus-helpers';
 import LeafletController from '../src/map_controller';
 
 // Controller used to check the actual controller was properly booted
diff --git a/src/Notify/assets/test/controller.test.ts b/src/Notify/assets/test/controller.test.ts
@@ -8,9 +8,9 @@
  */
 
 import { Application, Controller } from '@hotwired/stimulus';
-import { clearDOM, mountDOM } from '@symfony/stimulus-testing';
 import { getByTestId, waitFor } from '@testing-library/dom';
 import { vi } from 'vitest';
+import { clearDOM, mountDOM } from '../../../../test/stimulus-helpers';
 import NotifyController from '../src/controller';
 
 // Controller used to check the actual controller was properly booted
diff --git a/src/React/assets/test/render_controller.test.tsx b/src/React/assets/test/render_controller.test.tsx
@@ -8,9 +8,9 @@
  */
 
 import { Application, Controller } from '@hotwired/stimulus';
-import { clearDOM, mountDOM } from '@symfony/stimulus-testing';
 import { getByTestId, waitFor } from '@testing-library/dom';
 import React from 'react';
+import { clearDOM, mountDOM } from '../../../../test/stimulus-helpers';
 import ReactController from '../src/render_controller';
 
 // Controller used to check the actual controller was properly booted
diff --git a/src/Svelte/assets/test/render_controller.test.ts b/src/Svelte/assets/test/render_controller.test.ts
@@ -8,8 +8,8 @@
  */
 
 import { Application, Controller } from '@hotwired/stimulus';
-import { clearDOM, mountDOM } from '@symfony/stimulus-testing';
 import { getByTestId, waitFor } from '@testing-library/dom';
+import { clearDOM, mountDOM } from '../../../../test/stimulus-helpers';
 import SvelteController from '../src/render_controller';
 import MyComponent from './fixtures/MyComponent.svelte';
 
diff --git a/src/Swup/assets/test/controller.test.ts b/src/Swup/assets/test/controller.test.ts
@@ -8,8 +8,8 @@
  */
 
 import { Application, Controller } from '@hotwired/stimulus';
-import { clearDOM, mountDOM } from '@symfony/stimulus-testing';
 import { getByTestId, waitFor } from '@testing-library/dom';
+import { clearDOM, mountDOM } from '../../../../test/stimulus-helpers';
 import SwupController from '../src/controller';
 
 let actualSwupOptions: any = null;
@@ -46,7 +46,7 @@ describe('SwupController', () => {
                     <title>Symfony UX</title>
                 </head>
                 <body>
-                    <div 
+                    <div
                         data-testid="body"
                         data-controller="check swup"
                         data-swup-containers-value="[&quot;#swup&quot;, &quot;#nav&quot;]"
@@ -82,7 +82,7 @@ describe('SwupController', () => {
                     <title>Symfony UX</title>
                 </head>
                 <body>
-                    <div 
+                    <div
                         data-testid="body"
                         data-controller="check swup"
                         data-swup-link-selector-value="a"
@@ -114,7 +114,7 @@ describe('SwupController', () => {
                     <title>Symfony UX</title>
                 </head>
                 <body>
-                    <div 
+                    <div
                         data-testid="body"
                         data-controller="check swup"
                         data-swup-main-element-value="#main"
@@ -148,7 +148,7 @@ describe('SwupController', () => {
                     <title>Symfony UX</title>
                 </head>
                 <body>
-                    <div 
+                    <div
                         data-testid="body"
                         data-controller="check swup"
                         data-swup-containers-value="[&quot;#swup&quot;, &quot;#nav&quot;]"
@@ -181,7 +181,7 @@ describe('SwupController', () => {
                     <title>Symfony UX</title>
                 </head>
                 <body>
-                    <div 
+                    <div
                         data-testid="body"
                         data-controller="check swup"
                         data-swup-main-element-value="#main"
diff --git a/src/TogglePassword/assets/test/controller.test.ts b/src/TogglePassword/assets/test/controller.test.ts
@@ -8,9 +8,9 @@
  */
 
 import { Application, Controller } from '@hotwired/stimulus';
-import { clearDOM, mountDOM } from '@symfony/stimulus-testing';
 import { getByTestId, getByText, waitFor } from '@testing-library/dom';
 import user from '@testing-library/user-event';
+import { clearDOM, mountDOM } from '../../../../test/stimulus-helpers';
 import TogglePasswordController from '../src/controller';
 
 // Controller used to check the actual controller was properly booted
@@ -33,7 +33,7 @@ describe('TogglePasswordController', () => {
 
     beforeEach(() => {
         container = mountDOM(`
-        <div class="toggle-password-container"> 
+        <div class="toggle-password-container">
                 <input type="password"
                 data-testid="input"
                 data-controller="check toggle-password"
diff --git a/src/Turbo/assets/test/turbo_controller.test.ts b/src/Turbo/assets/test/turbo_controller.test.ts
@@ -8,8 +8,8 @@
  */
 
 import { Application } from '@hotwired/stimulus';
-import { clearDOM, mountDOM } from '@symfony/stimulus-testing';
 import { getByTestId } from '@testing-library/dom';
+import { clearDOM, mountDOM } from '../../../../test/stimulus-helpers';
 import TurboController from '../src/turbo_controller';
 
 const startStimulus = () => {
diff --git a/src/Turbo/assets/test/turbo_stream_controller.test.ts b/src/Turbo/assets/test/turbo_stream_controller.test.ts
@@ -8,9 +8,9 @@
  */
 
 import { Application } from '@hotwired/stimulus';
-import { clearDOM, mountDOM } from '@symfony/stimulus-testing';
 import { getByTestId } from '@testing-library/dom';
 import { vi } from 'vitest';
+import { clearDOM, mountDOM } from '../../../../test/stimulus-helpers';
 import TurboStreamController from '../src/turbo_stream_controller';
 
 const startStimulus = () => {
diff --git a/src/Typed/assets/test/controller.test.ts b/src/Typed/assets/test/controller.test.ts
@@ -8,8 +8,8 @@
  */
 
 import { Application, Controller } from '@hotwired/stimulus';
-import { clearDOM, mountDOM } from '@symfony/stimulus-testing';
 import { getByTestId, waitFor } from '@testing-library/dom';
+import { clearDOM, mountDOM } from '../../../../test/stimulus-helpers';
 import TypedController from '../src/controller';
 
 // Controller used to check the actual controller was properly booted
@@ -39,7 +39,7 @@ describe('TypedController', () => {
                 <head>
                     <title>Symfony UX</title>
                 </head>
-                <body>                    
+                <body>
                     <div>
                         I created this UX component because <span
                           data-testid="typed"
diff --git a/src/Vue/assets/test/render_controller.test.ts b/src/Vue/assets/test/render_controller.test.ts
@@ -8,8 +8,8 @@
  */
 
 import { Application, Controller } from '@hotwired/stimulus';
-import { clearDOM, mountDOM } from '@symfony/stimulus-testing';
 import { getByTestId, waitFor } from '@testing-library/dom';
+import { clearDOM, mountDOM } from '../../../../test/stimulus-helpers';
 import VueController from '../src/render_controller';
 
 // Controller used to check the actual controller was properly booted
diff --git a/test/setup.js b/test/setup.js
@@ -7,4 +7,4 @@
  * file that was distributed with this source code.
  */
 
-import '@symfony/stimulus-testing/setup';
+import '@testing-library/jest-dom';
diff --git a/test/stimulus-helpers.ts b/test/stimulus-helpers.ts
@@ -0,0 +1,20 @@
+/*
+ * This file is part of the Symfony package.
+ *
+ * (c) Fabien Potencier <fabien@symfony.com>
+ *
+ * For the full copyright and license information, please view the LICENSE
+ * file that was distributed with this source code.
+ */
+
+export function mountDOM(html: string = '') {
+    const div = document.createElement('div');
+    div.innerHTML = html;
+    document.body.appendChild(div);
+
+    return div;
+}
+
+export function clearDOM() {
+    document.body.innerHTML = '';
+}
diff --git a/yarn.lock b/yarn.lock
