From ac1320de8926033e401bc49ee8a9e1767b9abc4d Mon Sep 17 00:00:00 2001
From: Hugo Alliaume <hugo@alliau.me>
Date: Thu, 21 Aug 2025 10:36:16 +0200
Subject: [PATCH] [Map] Add E2E tests

---
 assets/test/browser/map.test.ts            | 13 ++++
 assets/test/browser/map_controller.test.ts | 71 ----------------------
 2 files changed, 13 insertions(+), 71 deletions(-)
 create mode 100644 assets/test/browser/map.test.ts
 delete mode 100644 assets/test/browser/map_controller.test.ts

diff --git a/assets/test/browser/map.test.ts b/assets/test/browser/map.test.ts
new file mode 100644
index 0000000..a81d741
--- /dev/null
+++ b/assets/test/browser/map.test.ts
@@ -0,0 +1,13 @@
+import { expect, test } from '@playwright/test';
+
+test('Can render basic map', async ({ page }) => {
+    await page.goto('/ux-map/basic?renderer=google');
+
+    await expect(await page.getByTestId('map')).toBeVisible();
+
+    // Since we can't test Google Maps rendering due to API costs, we only assert that Google Maps API is (wrongly) loaded
+    await expect(await page.getByTestId('map')).toContainText('Oops! Something went wrong.');
+    await expect(await page.getByTestId('map')).toContainText(
+        "This page didn't load Google Maps correctly. See the JavaScript console for technical details."
+    );
+});
diff --git a/assets/test/browser/map_controller.test.ts b/assets/test/browser/map_controller.test.ts
deleted file mode 100644
index 8e0f339..0000000
--- a/assets/test/browser/map_controller.test.ts
+++ /dev/null
@@ -1,71 +0,0 @@
-/*
- * 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.
- */
-
-import { Application, Controller } from '@hotwired/stimulus';
-import { getByTestId, waitFor } from '@testing-library/dom';
-import { afterEach, beforeEach, describe, expect, it } from 'vitest';
-import { clearDOM, mountDOM } from '../../../../../../../../test/stimulus-helpers';
-import GoogleController from '../../src/map_controller';
-
-// Controller used to check the actual controller was properly booted
-class CheckController extends Controller {
-    connect() {
-        this.element.addEventListener('ux:map:pre-connect', (_event) => {
-            this.element.classList.add('pre-connected');
-        });
-
-        this.element.addEventListener('ux:map:connect', (_event) => {
-            this.element.classList.add('connected');
-        });
-    }
-}
-
-const startStimulus = () => {
-    const application = Application.start();
-    application.register('check', CheckController);
-    application.register('symfony--ux-google-map--map', GoogleController);
-};
-
-describe('GoogleMapsController', () => {
-    let container: HTMLElement;
-
-    beforeEach(() => {
-        container = mountDOM(`
-          <div
-              data-testid="map"
-              data-controller="check symfony--ux-google-map--map"
-              data-symfony--ux-google-map--map-provider-options-value="{&quot;version&quot;:&quot;weekly&quot;,&quot;libraries&quot;:[&quot;maps&quot;,&quot;marker&quot;],&quot;apiKey&quot;:&quot;&quot;}"
-              data-symfony--ux-google-map--map-center-value="{&quot;lat&quot;:48.8566,&quot;lng&quot;:2.3522}"
-              data-symfony--ux-google-map--map-zoom-value="7"
-              data-symfony--ux-google-map--map-fit-bounds-to-markers-value="false"
-              data-symfony--ux-google-map--map-options-value="{&quot;mapId&quot;:null,&quot;gestureHandling&quot;:&quot;auto&quot;,&quot;backgroundColor&quot;:null,&quot;disableDoubleClickZoom&quot;:false,&quot;zoomControlOptions&quot;:{&quot;position&quot;:22},&quot;mapTypeControlOptions&quot;:{&quot;mapTypeIds&quot;:[],&quot;position&quot;:14,&quot;style&quot;:0},&quot;streetViewControlOptions&quot;:{&quot;position&quot;:22},&quot;fullscreenControlOptions&quot;:{&quot;position&quot;:20},&quot;@provider&quot;:&quot;google&quot;}"
-              data-symfony--ux-google-map--map-markers-value="[]"
-              data-symfony--ux-google-map--map-polygons-value="[]"
-              data-symfony--ux-google-map--map-polylines-value="[]"
-              data-symfony--ux-google-map--map-circles-value="[]"
-              data-symfony--ux-google-map--map-rectangles-value="[]"
-              style="height: 600px"
-          ></div>
-        `);
-    });
-
-    afterEach(() => {
-        clearDOM();
-    });
-
-    it('connect', async () => {
-        const div = getByTestId(container, 'map');
-        expect(div).not.toHaveClass('pre-connected');
-        expect(div).not.toHaveClass('connected');
-
-        startStimulus();
-        await waitFor(() => expect(div).toHaveClass('pre-connected'));
-        await waitFor(() => expect(div).toHaveClass('connected'));
-    });
-});