[StimulusBundle] Add support for typescript controllers

Author: evertharmeling

src/StimulusBundle/.gitignore

@@ -1,5 +1,6 @@
 .php-cs-fixer.cache
 .phpunit.result.cache
 composer.lock
+var/
 vendor/
 tests/fixtures/var

src/StimulusBundle/CHANGELOG.md

@@ -1,5 +1,9 @@
 # CHANGELOG
 
+## 2.x
+
+-   Added Typescript controllers support
+
 ## 2.13.2
 
 -   Revert "Change JavaScript package to `type: module`"

src/StimulusBundle/src/AssetMapper/ControllersMapGenerator.php

@@ -28,6 +28,8 @@
  */
 class ControllersMapGenerator
 {
+    private const FILENAME_REGEX = '/^.*[-_](controller\.[jt]s)$/';
+
     public function __construct(
         private AssetMapperInterface $assetMapper,
         private UxPackageReader $uxPackageReader,
@@ -66,12 +68,14 @@ private function loadCustomControllers(): array
         $finder = new Finder();
         $finder->in($this->controllerPaths)
             ->files()
-            ->name('/^.*[-_]controller\.js$/');
+            ->name(self::FILENAME_REGEX);
 
         $controllersMap = [];
         foreach ($finder as $file) {
             $name = $file->getRelativePathname();
-            $name = str_replace(['_controller.js', '-controller.js'], '', $name);
+            // use regex to extract 'controller'-postfix including extension
+            preg_match(self::FILENAME_REGEX, $name, $matches);
+            $name = str_replace(['_'.$matches[1], '-'.$matches[1]], '', $name);
             $name = str_replace(['_', '/'], ['-', '--'], $name);
 
             $asset = $this->assetMapper->getAssetFromSourcePath($file->getRealPath());

src/StimulusBundle/tests/AssetMapper/ControllerMapGeneratorTest.php

@@ -73,8 +73,8 @@ public function testGetControllersMap()
         $map = $generator->getControllersMap();
         // + 3 controller.json UX controllers
         // - 1 controllers.json UX controller is disabled
-        // + 8 custom controllers (1 file is not a controller & 1 is overridden)
-        $this->assertCount(10, $map);
+        // + 9 custom controllers (1 file is not a controller & 1 is overridden)
+        $this->assertCount(11, $map);
         $packageNames = array_keys($map);
         sort($packageNames);
         $this->assertSame([
@@ -88,6 +88,7 @@ public function testGetControllersMap()
             'subdir--deeper',
             'subdir--deeper-with-dashes',
             'subdir--deeper-with-underscores',
+            'typescript',
         ], $packageNames);
 
         $controllerSecond = $map['fake-vendor--ux-package1--controller-second'];

src/StimulusBundle/tests/AssetMapper/StimulusControllerLoaderFunctionalTest.php

@@ -52,13 +52,14 @@ public function testFullApplicationLoad()
             $this->assertSame([
                 // 1x import from loader.js (which is aliased to @symfony/stimulus-bundle via importmap)
                 '/assets/@symfony/stimulus-bundle/controllers.js',
-                // 6x from "controllers" (hello is overridden)
+                // 7x from "controllers" (hello is overridden)
                 '/assets/controllers/bye_controller.js',
                 '/assets/controllers/hello-with-dashes-controller.js',
                 '/assets/controllers/hello_with_underscores-controller.js',
                 '/assets/controllers/subdir/deeper-controller.js',
                 '/assets/controllers/subdir/deeper-with-dashes-controller.js',
                 '/assets/controllers/subdir/deeper_with_underscores-controller.js',
+                '/assets/controllers/typescript-controller.ts',
                 // 2x from UX packages, which are enabled in controllers.json
                 '/assets/fake-vendor/ux-package1/package-controller-second.js',
                 '/assets/fake-vendor/ux-package2/package-hello-controller.js',
@@ -92,7 +93,7 @@ public function testFullApplicationLoad()
             $preLoadHrefs = $crawler->filter('link[rel="modulepreload"]')->each(function ($link) {
                 return $link->attr('href');
             });
-            $this->assertCount(11, $preLoadHrefs);
+            $this->assertCount(12, $preLoadHrefs);
             sort($preLoadHrefs);
             $this->assertStringStartsWith('/assets/@symfony/stimulus-bundle/controllers-', $preLoadHrefs[0]);
             $this->assertStringStartsWith('/assets/@symfony/stimulus-bundle/loader-', $preLoadHrefs[1]);
@@ -101,9 +102,10 @@ public function testFullApplicationLoad()
             $this->assertStringStartsWith('/assets/controllers/subdir/deeper-controller-', $preLoadHrefs[5]);
             $this->assertStringStartsWith('/assets/controllers/subdir/deeper-with-dashes-controller-', $preLoadHrefs[6]);
             $this->assertStringStartsWith('/assets/controllers/subdir/deeper_with_underscores-controller-', $preLoadHrefs[7]);
-            $this->assertStringStartsWith('/assets/fake-vendor/ux-package2/package-hello-controller-', $preLoadHrefs[8]);
-            $this->assertStringStartsWith('/assets/more-controllers/hello-controller-', $preLoadHrefs[9]);
-            $this->assertStringStartsWith('/assets/vendor/@hotwired/stimulus/stimulus.index', $preLoadHrefs[10]);
+            $this->assertStringStartsWith('/assets/controllers/typescript-controller-', $preLoadHrefs[8]);
+            $this->assertStringStartsWith('/assets/fake-vendor/ux-package2/package-hello-controller-', $preLoadHrefs[9]);
+            $this->assertStringStartsWith('/assets/more-controllers/hello-controller-', $preLoadHrefs[10]);
+            $this->assertStringStartsWith('/assets/vendor/@hotwired/stimulus/stimulus.index', $preLoadHrefs[11]);
         } else {
             // legacy
             $this->assertSame([

src/StimulusBundle/tests/fixtures/assets/controllers/typescript-controller.ts

@@ -0,0 +1,6 @@
+// typescript-controller.js
+// @ts-ignore
+import { Controller } from '@hotwired/stimulus';
+
+export default class extends Controller {
+}