Map, Set, Date support. Closure integration

Author: Anatoly Ostrovsky

Makefile

@@ -1,4 +1,4 @@
-.PHONY: build build-ts check test test-types types docs-examples-check coverage coverage-check coverage-update-baseline coverage-open setup ensure-deps lint lint-check lint-fix
+.PHONY: build build-ts check test test-integrations test-types types public-namespace-api update-public-namespace-api docs-examples-check coverage coverage-check coverage-update-baseline coverage-open setup ensure-deps lint lint-check lint-fix
 
 BUILD_DIR 	= ./dist	
 TS_BUILD_DIR = ./.build
@@ -87,6 +87,11 @@ types: ensure-deps
 	@./node_modules/.bin/tsc --project tsconfig.types.json
 	@npx prettier ./@types --write --cache --log-level=silent
 
+public-namespace-api: types
+	@$(MAKE) -f integrations/closure/Makefile closure-generate
+
+update-public-namespace-api: public-namespace-api
+
 TYPEDOC_DIR = docs/static/typedoc
 doc: ensure-deps
 	@rm -rf $(TYPEDOC_DIR)
@@ -106,6 +111,11 @@ PLAYWRIGHT_TEST := npx playwright test
 test: ensure-deps
 	@echo $(INFO) "Playwright test JS"
 	@$(PLAYWRIGHT_TEST) 
+	@$(MAKE) test-integrations
+
+test-integrations: ensure-deps
+	@echo $(INFO) "Playwright integration tests"
+	@$(MAKE) -f integrations/closure/Makefile closure-test
 
 test-ui: ensure-deps
 	@echo $(INFO) "Playwright test JS with ui"

integrations/closure/.gitignore

@@ -0,0 +1,5 @@
+/dist/
+/clojurescript/.shadow-cljs/
+/clojurescript/demo/dist/
+/clojurescript/node_modules/
+/clojurescript/target/

integrations/closure/Makefile

@@ -0,0 +1,75 @@
+.PHONY: closure-generate closure-externs closure-validate closure-build closure-test closure-demo clojurescript-generate clojurescript-validate clojurescript-build clojurescript-test clojurescript-package clojurescript-deploy java-generate java-check
+
+CLOSURE_INTEGRATION_DIR := $(abspath $(dir $(lastword $(MAKEFILE_LIST))))
+CLOSURE_REPO_ROOT := $(abspath $(CLOSURE_INTEGRATION_DIR)/../..)
+CLOSURE_NODE ?= $(shell command -v node)
+SHADOW_CLJS_VERSION ?= 3.4.10
+CLOJURESCRIPT_JAVA_HOME ?= $(firstword $(wildcard $(HOME)/.sdkman/candidates/java/21*))
+CLOSURE_JAVA_21_HOME ?= $(firstword $(wildcard $(HOME)/.sdkman/candidates/java/21*))
+JSINTEROP_GENERATOR_JAVA ?= $(if $(CLOSURE_JAVA_21_HOME),$(CLOSURE_JAVA_21_HOME)/bin/java,java)
+CLOJARS_REPOSITORY_ID ?= clojars
+CLOJARS_URL ?= https://repo.clojars.org/
+CLOJURESCRIPT_GROUP_ID ?= org.angular.ts
+CLOJURESCRIPT_ARTIFACT_ID ?= angular-ts-cljs
+CLOJURESCRIPT_PACKAGE_VERSION ?= $(shell cd $(CLOSURE_REPO_ROOT) && node -p "JSON.parse(require('fs').readFileSync('package.json', 'utf8')).version")
+
+closure-generate: closure-externs clojurescript-generate java-generate
+
+closure-externs:
+	@"$(CLOSURE_NODE)" $(CLOSURE_INTEGRATION_DIR)/scripts/generate-externs.mjs
+
+closure-validate:
+	@"$(CLOSURE_NODE)" $(CLOSURE_INTEGRATION_DIR)/scripts/validate-externs.mjs
+
+closure-build: closure-validate
+	@$(MAKE) -C $(CLOSURE_REPO_ROOT) build
+	@"$(CLOSURE_NODE)" $(CLOSURE_INTEGRATION_DIR)/scripts/build.mjs
+
+closure-test: closure-build clojurescript-build
+	@cd $(CLOSURE_REPO_ROOT) && npx playwright test --config integrations/closure/playwright.config.ts
+
+closure-demo: closure-build
+	@echo "Open http://localhost:4000/integrations/closure/demo/index.html after running make serve"
+
+clojurescript-generate: closure-externs
+	@"$(CLOSURE_NODE)" $(CLOSURE_INTEGRATION_DIR)/clojurescript/scripts/generate-cljs-types.mjs
+
+clojurescript-validate: closure-validate
+	@"$(CLOSURE_NODE)" $(CLOSURE_INTEGRATION_DIR)/clojurescript/scripts/generate-cljs-types.mjs --check
+
+clojurescript-build: clojurescript-validate
+	@cd $(CLOSURE_INTEGRATION_DIR)/clojurescript && \
+		if [ -n "$(CLOJURESCRIPT_JAVA_HOME)" ]; then \
+			PATH="$(CLOJURESCRIPT_JAVA_HOME)/bin:$$PATH" npx --yes shadow-cljs@$(SHADOW_CLJS_VERSION) release todo; \
+		else \
+			npx --yes shadow-cljs@$(SHADOW_CLJS_VERSION) release todo; \
+		fi
+
+clojurescript-test: clojurescript-build
+	@cd $(CLOSURE_REPO_ROOT) && npx playwright test --config integrations/closure/playwright.config.ts integrations/closure/clojurescript/clojurescript.test.ts
+
+clojurescript-package: clojurescript-generate
+	@CLOJURESCRIPT_GROUP_ID="$(CLOJURESCRIPT_GROUP_ID)" \
+		CLOJURESCRIPT_ARTIFACT_ID="$(CLOJURESCRIPT_ARTIFACT_ID)" \
+		CLOJURESCRIPT_PACKAGE_VERSION="$(CLOJURESCRIPT_PACKAGE_VERSION)" \
+		"$(CLOSURE_NODE)" $(CLOSURE_INTEGRATION_DIR)/clojurescript/scripts/package-cljs.mjs
+
+clojurescript-deploy: clojurescript-package
+	@cd $(CLOSURE_REPO_ROOT) && \
+		mvn deploy:deploy-file \
+			-Dfile=integrations/closure/clojurescript/target/$(CLOJURESCRIPT_ARTIFACT_ID)-$(CLOJURESCRIPT_PACKAGE_VERSION).jar \
+			-DpomFile=integrations/closure/clojurescript/target/$(CLOJURESCRIPT_ARTIFACT_ID)-$(CLOJURESCRIPT_PACKAGE_VERSION).pom \
+			-DrepositoryId=$(CLOJARS_REPOSITORY_ID) \
+			-Durl=$(CLOJARS_URL)
+
+java-generate: closure-externs
+	@cd $(CLOSURE_REPO_ROOT) && \
+		JSINTEROP_GENERATOR_JAVA="$(JSINTEROP_GENERATOR_JAVA)" \
+		mvn -f integrations/closure/java/pom.xml process-sources
+
+java-check:
+	@cd $(CLOSURE_REPO_ROOT) && \
+		JSINTEROP_GENERATOR_JAVA="$(JSINTEROP_GENERATOR_JAVA)" \
+		mvn -f integrations/closure/java/pom.xml clean verify
+	@cd $(CLOSURE_REPO_ROOT) && \
+		mvn -f integrations/closure/java/demo/pom.xml clean j2cl:clean verify

integrations/closure/README.md

@@ -0,0 +1,53 @@
+# AngularTS Closure Compiler Integration
+
+This integration treats AngularTS as an external browser runtime and compiles
+application code with Google Closure Compiler in `ADVANCED` mode with verbose
+warnings promoted to errors.
+
+The integration is intentionally isolated from the core build:
+
+- `externs/angular-ts.externs.js` describes the public AngularTS API and mirrors
+  the public `ng` namespace with documented structural Closure externs.
+- `demo/app.js` registers the Closure-compiled todo app with AngularTS.
+- `demo/todo.js` and `demo/todo-controller.js` are separate `goog.module`
+  files for the todo model and controller.
+- `demo/goog-base.js` is a compiler-only Closure primitive shim so the demo can
+  use `goog.module` / `goog.require` without shipping Closure Library runtime code.
+- `demo/index.html` loads the Vite-served AngularTS source runtime and the
+  checked-in Closure-compiled todo app output at `demo/compiled.js`.
+- `scripts/build.mjs` runs Closure Compiler.
+- `scripts/generate-externs.mjs` regenerates documented structural externs from
+  the public `ng` namespace and reuses Closure browser externs for DOM/browser
+  aliases such as `WindowService`, `DocumentService`, and `RootElementService`.
+- `scripts/validate-externs.mjs` fails when a public `ng` namespace type is
+  missing from the externs file, lacks a JSDoc extern declaration, lacks a
+  structural contract, or the generated externs are out of date.
+- `clojurescript/` contains a Shadow CLJS todo demo that generates a typed
+  ClojureScript facade from the AngularTS Closure externs and compiles with
+  Closure `ADVANCED` optimizations.
+- `Makefile` can be included from the repo root later.
+
+Supported direction:
+
+- Closure compiles user application code.
+- AngularTS is loaded as a prebuilt external global.
+
+## Commands
+
+From the repository root:
+
+```bash
+node integrations/closure/scripts/generate-externs.mjs
+make -f integrations/closure/Makefile closure-validate
+make -f integrations/closure/Makefile closure-build
+make -f integrations/closure/Makefile clojurescript-build
+make -f integrations/closure/Makefile closure-test
+node integrations/closure/scripts/validate-externs.mjs
+```
+
+The demo page is available at:
+
+```text
+http://localhost:4000/integrations/closure/demo/index.html
+http://localhost:4000/integrations/closure/clojurescript/demo/index.html
+```

integrations/closure/clojurescript/README.md

@@ -0,0 +1,83 @@
+# AngularTS ClojureScript Closure Integration
+
+This folder contains the publishable ClojureScript facade for the Closure
+integration plus a Shadow CLJS todo demo. The demo compiles with Closure
+`ADVANCED` optimizations while treating AngularTS as an external browser
+runtime.
+
+The generated facade in `src/angular_ts/generated.cljs` is produced from
+`../externs/angular-ts.externs.js`. It gives ClojureScript code concrete
+AngularTS type hints such as `^js/ng.NgModule` and `^js/ng.Scope`, and
+fails generation if the required AngularTS extern contracts disappear. Extern
+JSDoc is preserved where ClojureScript can use it: public type descriptions are
+kept in a source-only `public-type-docs` comment block, and generated strict
+wrapper docstrings use the original extern descriptions, parameter docs, and
+return docs. Generation fails if a public extern type is missing documentation.
+
+The facade is deliberately strict:
+
+- `*warn-on-infer*` is enabled.
+- AngularTS dependency annotations and module requirements use JavaScript
+  arrays at the boundary.
+- Generated method wrappers are emitted only when every receiver, parameter, and
+  non-void return type has a concrete Closure extern tag that ClojureScript can
+  represent. Wildcards, unions, function-typed parameters, and variadic externs
+  are skipped unless there is a hand-written strict wrapper.
+- The generator pins the reviewed public type-tag count and strict wrapper set,
+  so extern-surface changes require an intentional update.
+- The build runs Shadow CLJS with Closure `ADVANCED` optimizations and treats
+  compiler inference warnings as warnings.
+
+## Commands
+
+From the repository root:
+
+```bash
+make -f integrations/closure/Makefile clojurescript-generate
+make -f integrations/closure/Makefile clojurescript-build
+make -f integrations/closure/Makefile clojurescript-test
+make -f integrations/closure/Makefile clojurescript-package
+```
+
+The package target writes a Maven/Clojars-ready jar and POM to:
+
+```text
+integrations/closure/clojurescript/target/angular-ts-cljs-<version>.jar
+integrations/closure/clojurescript/target/angular-ts-cljs-<version>.pom
+```
+
+The jar contains `angular-ts.generated` plus
+`angular_ts/externs/angular-ts.externs.js`; it does not include the todo demo.
+The version defaults to the root `package.json` version. Override it with
+`CLOJURESCRIPT_PACKAGE_VERSION=...` when needed.
+
+To publish to Clojars after verifying the release:
+
+```bash
+make public-namespace-api
+make test-integrations
+make -f integrations/closure/Makefile clojurescript-deploy
+```
+
+Consumers can depend on the published artifact:
+
+```clojure
+{:deps {org.angular.ts/angular-ts-cljs {:mvn/version "0.27.0"}}}
+```
+
+And pass the packaged extern resource to Shadow CLJS:
+
+```clojure
+{:compiler-options
+ {:externs ["angular_ts/externs/angular-ts.externs.js"]}}
+```
+
+Shadow CLJS 3.x uses a Closure Compiler build that requires Java 21. The
+Makefile automatically uses an SDKMAN Java 21 installation when present. Set
+`CLOJURESCRIPT_JAVA_HOME=/path/to/jdk-21` if your default `java` is older.
+
+The demo page is available at:
+
+```text
+http://localhost:4000/integrations/closure/clojurescript/demo/index.html
+```

integrations/closure/clojurescript/clojurescript.test.ts

@@ -0,0 +1,57 @@
+import { expect, test } from "@playwright/test";
+
+test("ClojureScript todo demo runs against generated AngularTS Closure types", async ({
+  page,
+}) => {
+  await page.goto("/integrations/closure/clojurescript/demo/index.html");
+
+  await expect(
+    page.getByRole("heading", { name: "ClojureScript Todo App" }),
+  ).toBeVisible();
+  await expect(
+    page.getByText(
+      "ClojureScript compiled with Closure ADVANCED using generated AngularTS type hints",
+    ),
+  ).toBeVisible();
+  await expect(page.locator(".todo-row")).toHaveCount(2);
+  await expect(page.locator("#cljs-remaining")).toContainText(
+    "2 of 2 remaining",
+  );
+
+  await page
+    .getByLabel("New ClojureScript todo")
+    .fill("Ship ClojureScript integration");
+  await page.getByLabel("New ClojureScript todo").press("Enter");
+  await expect(page.locator(".todo-row")).toHaveCount(3);
+  await expect(page.getByText("Ship ClojureScript integration")).toBeVisible();
+  await expect(page.locator("#cljs-remaining")).toContainText(
+    "3 of 3 remaining",
+  );
+
+  const newTodo = page
+    .locator(".todo-row")
+    .filter({ hasText: "Ship ClojureScript integration" });
+
+  await newTodo.getByRole("checkbox").click();
+  await expect(newTodo.getByRole("checkbox")).toBeChecked();
+  await expect(newTodo).toHaveClass(/is-done/);
+  await expect(page.locator("#cljs-remaining")).toContainText(
+    "2 of 3 remaining",
+  );
+  await expect(
+    page.evaluate(() => {
+      const scope = (window as any).angular.getScope(
+        document.querySelector("main"),
+      );
+
+      return scope.$ctrl.tasks.find(
+        (todo: Record<string, unknown>) =>
+          todo.task === "Ship ClojureScript integration",
+      )?.done;
+    }),
+  ).resolves.toBe(true);
+
+  await page.getByRole("button", { name: "Archive completed" }).click();
+  await expect(page.locator(".todo-row")).toHaveCount(2);
+  await expect(page.getByText("Ship ClojureScript integration")).toHaveCount(0);
+});

integrations/closure/clojurescript/demo/index.html

@@ -0,0 +1,78 @@
+<!doctype html>
+<html>
+  <head>
+    <meta charset="utf-8" />
+    <title>AngularTS ClojureScript Todo Demo</title>
+    <link rel="stylesheet" href="/src/directive/http/demo.css" />
+    <style>
+      .todo-row {
+        align-items: center;
+        display: flex;
+        gap: 10px;
+        justify-content: space-between;
+      }
+
+      .todo-row.is-done strong {
+        color: var(--muted);
+        text-decoration: line-through;
+      }
+    </style>
+    <script type="module" src="/src/index.ts"></script>
+    <script
+      type="module"
+      src="/integrations/closure/clojurescript/demo/dist/compiled.js?v=todo-submit-done-archive"
+    ></script>
+  </head>
+  <body ng-app="cljsTodo">
+    <main class="demo-shell" ng-controller="TodoCtrl as $ctrl">
+      <section class="demo-hero">
+        <h1>{{ $ctrl.greeting }}</h1>
+        <p cljs-badge></p>
+      </section>
+
+      <section class="demo-content">
+        <form ng-submit="$ctrl.submit($event)">
+          <input
+            aria-label="New ClojureScript todo"
+            id="cljs-new-todo"
+            name="todo"
+            type="text"
+            ng-input="$ctrl.setNewTodo($event.target.value)"
+            ng-required="true"
+            placeholder="What needs doing?"
+          />
+          <button type="submit">Add</button>
+        </form>
+
+        <p id="cljs-remaining" class="demo-note">
+          {{ $ctrl.remainingCount }} of {{ $ctrl.tasks.length }} remaining
+        </p>
+
+        <div class="demo-actions">
+          <button type="button" ng-click="$ctrl.archive()">
+            Archive completed
+          </button>
+        </div>
+
+        <div class="demo-stack">
+          <article
+            class="event-card todo-row"
+            ng-class="{ 'is-done': todo.done }"
+            ng-repeat="todo in $ctrl.tasks"
+            data-index="id"
+          >
+            <strong>{{ todo.task }}</strong>
+            <label>
+              Done
+              <input
+                type="checkbox"
+                ng-checked="todo.done"
+                ng-change="$ctrl.setDone(todo, $event.target.checked)"
+              />
+            </label>
+          </article>
+        </div>
+      </section>
+    </main>
+  </body>
+</html>