docs(docs-infra): Use type aquisition in the tutorial editor

JeanMeche · JeanMeche · commit 5763dbcb7fcb · 2025-07-01T10:40:41.000+02:00
Automatic Type Acquisition (ata), loads all the necessary types from a given file content.
diff --git a/.aspect/rules/external_repository_action_cache/npm_translate_lock_MzA5NzUwNzMx b/.aspect/rules/external_repository_action_cache/npm_translate_lock_MzA5NzUwNzMx
@@ -6,7 +6,7 @@
 adev/shared-docs/pipeline/api-gen/package.json=939673974
 integration/package.json=-239561259
 modules/package.json=364168920
-package.json=-1928784858
+package.json=903175873
 packages/animations/package.json=-678724831
 packages/benchpress/package.json=-1908328724
 packages/common/package.json=1729763064
@@ -22,7 +22,7 @@ packages/platform-browser/package.json=-1163479450
 packages/router/package.json=860819913
 packages/upgrade/package.json=16347051
 packages/zone.js/package.json=-1005735564
-pnpm-lock.yaml=-103202685
+pnpm-lock.yaml=-1818670978
 pnpm-workspace.yaml=-375658197
 tools/bazel/rules_angular_store/package.json=-239561259
-yarn.lock=-774434861
+yarn.lock=1951867410
diff --git a/adev/BUILD.bazel b/adev/BUILD.bazel
@@ -70,6 +70,7 @@ APPLICATION_DEPS = [
     "@npm//xhr2",
     "@npm//typescript",
     "@npm//@typescript/vfs",
+    "@npm//@typescript/ata",
     "@npm//@codemirror/state",
     "@npm//@codemirror/view",
     "@npm//@codemirror/language",
diff --git a/adev/src/app/editor/typings-loader.service.ts b/adev/src/app/editor/typings-loader.service.ts
@@ -10,6 +10,8 @@ import {Injectable, signal} from '@angular/core';
 import {toObservable} from '@angular/core/rxjs-interop';
 import {WebContainer} from '@webcontainer/api';
 import {Typing} from './code-editor/workers/interfaces/define-types-request';
+import {setupTypeAcquisition} from '@typescript/ata';
+import ts from 'typescript';
 
 /**
  * This service is responsible for retrieving the types definitions for the
@@ -41,15 +43,37 @@ export class TypingsLoader {
 
     const typesDefinitions: Typing[] = [];
 
+    const ata = setupTypeAcquisition({
+      projectName: 'My ATA Project',
+      typescript: ts,
+      logger: console,
+      delegate: {
+        receivedFile: (content: string, path: string) => {
+          if (path.endsWith('.d.ts')) {
+            typesDefinitions.push({path, content});
+          }
+        },
+        started: () => {},
+        progress: () => {},
+        finished: () => {},
+      },
+    });
+
     try {
       const filesToRead = await this.getFilesToRead();
 
       if (filesToRead && filesToRead.length > 0) {
         await Promise.all(
           filesToRead.map((path) =>
-            webContainer.fs.readFile(path, 'utf-8').then((content) => {
-              typesDefinitions.push({path, content});
-            }),
+            webContainer.fs
+              .readFile(path, 'utf-8')
+              .then(async (content) => {
+                await ata(content);
+                return content;
+              })
+              .then((content) => {
+                typesDefinitions.push({path, content});
+              }),
           ),
         );
 
diff --git a/package.json b/package.json
@@ -65,7 +65,6 @@
     "@babel/generator": "7.27.5",
     "@bazel/concatjs": "5.8.1",
     "@bazel/esbuild": "5.8.1",
-    "esbuild": "0.25.5",
     "@bazel/jasmine": "5.8.1",
     "@bazel/protractor": "5.8.1",
     "@bazel/rollup": "5.8.1",
@@ -116,6 +115,7 @@
     "dagre-d3-es": "^7.0.11",
     "diff": "^8.0.0",
     "domino": "https://github.com/angular/domino.git#93e720f143d0296dd2726ffbcf4fc12283363a7b",
+    "esbuild": "0.25.5",
     "hammerjs": "~2.0.8",
     "http-server": "^14.0.0",
     "jasmine": "~5.8.0",
@@ -196,6 +196,7 @@
     "@types/jsdom": "^21.1.5",
     "@types/live-server": "^1.2.3",
     "@types/tmp": "^0.2.6",
+    "@typescript/ata": "^0.9.8",
     "@typescript/vfs": "^1.5.0",
     "@webcontainer/api": "^1.3.0-internal.2",
     "@yarnpkg/lockfile": "^1.1.0",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
diff --git a/yarn.lock b/yarn.lock
@@ -320,7 +320,6 @@
 
 "@angular/build-tooling@https://github.com/angular/dev-infra-private-build-tooling-builds.git#5db176c0f3211663830fd3ff4064c1dff0eaccb4":
   version "0.0.0-d44be7e28087c3499d70dda9859d51c1cd3fe1bf"
-  uid "5db176c0f3211663830fd3ff4064c1dff0eaccb4"
   resolved "https://github.com/angular/dev-infra-private-build-tooling-builds.git#5db176c0f3211663830fd3ff4064c1dff0eaccb4"
   dependencies:
     "@angular/benchpress" "0.3.0"
@@ -470,7 +469,6 @@
 
 "@angular/ng-dev@https://github.com/angular/dev-infra-private-ng-dev-builds.git#8fe809d31ea3536087ca56cf7ff9ddd544dba658":
   version "0.0.0-dfe138678e4edb4789fbe40ae7792c046de3b4bd"
-  uid "8fe809d31ea3536087ca56cf7ff9ddd544dba658"
   resolved "https://github.com/angular/dev-infra-private-ng-dev-builds.git#8fe809d31ea3536087ca56cf7ff9ddd544dba658"
   dependencies:
     "@google-cloud/spanner" "8.0.0"
@@ -4839,6 +4837,11 @@
   dependencies:
     "@types/node" "*"
 
+"@typescript/ata@^0.9.8":
+  version "0.9.8"
+  resolved "https://registry.yarnpkg.com/@typescript/ata/-/ata-0.9.8.tgz#97fe634905ad6140197bc812a696d3ebe315d519"
+  integrity sha512-+M815CeDRJS5H5ciWfhFCKp25nNfF+LFWawWAaBhNlquFb2wS5IIMDI+2bKWN3GuU6mpj+FzySsOD29M4nG8Xg==
+
 "@typescript/vfs@^1.5.0":
   version "1.6.1"
   resolved "https://registry.yarnpkg.com/@typescript/vfs/-/vfs-1.6.1.tgz#fe7087d5a43715754f7ea9bf6e0b905176c9eebd"
@@ -8038,8 +8041,7 @@ domhandler@^5.0.2, domhandler@^5.0.3:
     domelementtype "^2.3.0"
 
 "domino@https://github.com/angular/domino.git#93e720f143d0296dd2726ffbcf4fc12283363a7b":
-  version "2.1.6+git"
-  uid "93e720f143d0296dd2726ffbcf4fc12283363a7b"
+  version "2.1.6"
   resolved "https://github.com/angular/domino.git#93e720f143d0296dd2726ffbcf4fc12283363a7b"
 
 dompurify@^3.2.5:
