Typechecking with JavaScript (#972)

Using the world-famous `jsconfig.json`

Author: vixalien

.gitmodules

@@ -8,6 +8,6 @@
 	path = blueprint-compiler
 	url = https://gitlab.gnome.org/jwestman/blueprint-compiler.git
 [submodule "src/langs/typescript/template/gi-types"]
-	path = src/langs/typescript/gi-types
+	path = gi-types
 	url = https://gitlab.gnome.org/BrainBlasted/gi-typescript-definitions.git
 	branch = nightly

src/langs/typescript/gi-types gi-typessrc/langs/typescript/gi-types renamed to gi-types

@@ -4,6 +4,7 @@ import GObject from "gi://GObject";
 import { makeDropdownFlat, settings as global_settings } from "./util.js";
 import { setupRustProject } from "./langs/rust/rust.js";
 import { setupTypeScriptProject } from "./langs/typescript/typescript.js";
+import { setupJavascriptProject } from "./langs/javascript/javascript.js";
 
 export default function PanelCode({
   builder,
@@ -55,6 +56,12 @@ export default function PanelCode({
     stack_code.visible_child_name = panel.language;
     previewer.useInternal().catch(console.error);
 
+    if (panel.language.toLowerCase() === "javascript") {
+      setupJavascriptProject(file, langs.javascript.document).catch(
+        console.error,
+      );
+    }
+
     if (panel.language.toLowerCase() === "rust") {
       setupRustProject(file).catch(console.error);
     }

src/PanelCode.js

@@ -1,5 +1,3 @@
-import GLib from "gi://GLib";
-
 import LSPClient from "./lsp/LSPClient.js";
 
 const formatting_options = {
@@ -47,14 +45,7 @@ export const languages = [
     document: null,
     default_file: "main.js",
     index: 0,
-    language_server: [
-      "biome",
-      "lsp-proxy",
-      // src/meson.build installs biome.json there
-      GLib.getenv("FLATPAK_ID")
-        ? `--config-path=${pkg.pkgdatadir}`
-        : `--config-path=src/langs/javascript`,
-    ],
+    language_server: ["typescript-language-server", "--stdio"],
     formatting_options: {
       ...formatting_options,
       tabSize: 2,

src/common.js

@@ -1,5 +1,7 @@
+import Gio from "gi://Gio";
+
 import { createLSPClient } from "../../common.js";
-import { getLanguage } from "../../util.js";
+import { getLanguage, copy } from "../../util.js";
 
 export function setup({ document }) {
   const { file, buffer, code_view } = document;
@@ -30,3 +32,22 @@ export function setup({ document }) {
 
   return lspc;
 }
+
+const javascript_template_dir = Gio.File.new_for_path(
+  pkg.pkgdatadir,
+).resolve_relative_path("langs/javascript/template");
+
+export async function setupJavascriptProject(destination, document) {
+  const destination_file = await copy(
+    "jsconfig.json",
+    javascript_template_dir,
+    destination,
+    Gio.FileCopyFlags.NONE,
+  );
+
+  // Notify the language server that the jsconfig file was created
+  // to initialize diagnostics and type checkings
+  await document.lspc.notify("workspace/didCreateFile", {
+    files: [{ uri: destination_file.get_uri() }],
+  });
+}

src/langs/javascript/javascript.js

@@ -0,0 +1,6 @@
+configure_file(
+  input: 'template/jsconfig.json',
+  output: 'jsconfig.json',
+  install_dir: join_paths(pkgdatadir, 'langs/javascript/template/'),
+  configuration: bin_conf,
+)

src/langs/javascript/meson.build

@@ -0,0 +1,21 @@
+{
+  "compilerOptions": {
+    "checkJs": true,
+    "module": "ESNext",
+    "moduleResolution": "Bundler",
+    // TODO: should probably be fixed to ES2023, or whatever standard is
+    // currently supported by the latest GJS
+    "target": "ESNext",
+    "outDir": "compiled_javascript",
+    "baseUrl": ".",
+    "paths": {
+      "*": ["*", "@pkgdatadir@/langs/typescript/gi-types/*"]
+    },
+    "skipLibCheck": true
+  },
+  "include": [
+    "main.js",
+    "@pkgdatadir@/langs/typescript/types/ambient.d.ts",
+    "@pkgdatadir@/langs/typescript/gi-types/gi.d.ts"
+  ]
+}

src/langs/javascript/template/jsconfig.json

@@ -11,4 +11,7 @@ install_data(
   preserve_path: true,
 )
 
-install_subdir('gi-types', install_dir: join_paths(pkgdatadir, 'langs/typescript'))
+install_subdir(
+  meson.project_source_root() / 'gi-types',
+  install_dir: join_paths(pkgdatadir, 'langs/typescript'),
+)

src/langs/typescript/meson.build

@@ -15,6 +15,7 @@ blueprint_compiler = find_program(
 
 meson.add_install_script('../build-aux/library.js', pkgdatadir)
 
+subdir('langs/javascript')
 subdir('langs/rust/template')
 subdir('langs/typescript')
 

src/meson.build

@@ -73,7 +73,6 @@ class CodeView extends Gtk.Widget {
   }
 
   #onUpdate = () => {
-    this.clearDiagnostics();
     this.emit("changed");
   };