Enable expression lsp integration

.circleci/config.yml

@@ -3,7 +3,7 @@ version: 2
 defaults: &defaults
   working_directory: ~/vscode-player
   docker:
-    - image: circleci/node:latest-browsers
+    - image: cimg/node:18.12.1-browsers
 
 jobs:
   install:
@@ -71,7 +71,7 @@ jobs:
           at: ~/vscode-player
       - run:
           name: Test
-          command: yarn test --ci --reporters=default --reporters=jest-junit
+          command: yarn test
           environment:
             JEST_JUNIT_OUTPUT_DIR: ./reports/junit/
       - run:
@@ -107,20 +107,21 @@ workflows:
           requires:
             - install
 
-      # - build:
-      #     requires:
-      #       - install
+      - build:
+          requires:
+            - install
 
-      # - lint:
-      #     requires:
-      #       - build
+      - lint:
+          requires:
+            - build
 
-      # - test:
-      #     requires:
-      #       - build
+      - test:
+          requires:
+            - build
 
       - release:
           context:
             - Publish
           requires:
-            - install
+            - lint
+            - test

.eslintignore

@@ -0,0 +1,2 @@
+e2e
+tests

.eslintrc

@@ -0,0 +1,9 @@
+{
+  "extends": "@design-systems",
+  "rules": {
+    "no-param-reassign": "off",
+    "@typescript-eslint/no-empty-function": "off",
+    "max-classes-per-file": "off",
+    "import/no-unresolved": "off"
+  }
+}

.gitignore

@@ -118,4 +118,5 @@ dist
 .pnp.*
 
 reports
-.DS_Store
+.DS_Store
+*.vsix

.vscodeignore

@@ -1,5 +1,9 @@
-.vscode/**
-.vscode-test/**
-.gitignore
-vsc-extension-quickstart.md
-node_modules
+.vscode/
+.vscode-test/
+
+**/*.map
+**/*.ts
+**/tsconfig.json
+**/tslint.json
+**/node_modules/**
+**/e2e/**

e2e/package.json

@@ -5,5 +5,10 @@
   "dependencies": {
     "@player-ui/dsl": "^0.3.0",
     "typescript": "^4.9.4"
+  },
+  "player": {
+    "include": [
+      "/Users/adierkens/dev/github/player-ui/tools/common/static_xlrs/expression/xlr/manifest.js"
+    ]
   }
 }

e2e/src/view.tsx

@@ -8,8 +8,12 @@ const pathA = b`foo.AA`;
 const pathB = b`foo.BB`;
 const pathC = b`foo['CC']`;
 
-const other = expr`foo()`;
+function foo() {}
 
-const testFn = e`test`;
+const x = foo();
+
+const other = expr`containsAny()`;
+
+const testFn = e`replace('foo') + concat() - ''`;
 
 const isTrue = e`${pathA} === ${pathB}`;

package.json

@@ -4,6 +4,7 @@
   "description": "Syntax highlighting and validation for the player dsl",
   "publisher": "player-oss",
   "icon": "media/icon-small.png",
+  "main": "./dist/index.js",
   "private": true,
   "version": "0.0.3",
   "license": "MIT",
@@ -15,6 +16,7 @@
     "url": "https://github.com/player-ui/vscode-player.git"
   },
   "files": [
+    "dist",
     "player-syntax.vsix",
     "syntaxes",
     "language-configuration.json"
@@ -29,16 +31,54 @@
   "scripts": {
     "release": "auto shipit",
     "labelCheck": "auto pr-check",
-    "prepare": "is-ci || husky install"
+    "prepare": "is-ci || husky install",
+    "lint": "eslint src --cache",
+    "test": "node ./tests/run.js",
+    "vscode:prepublish": "npm run build",
+    "esbuild-base": "esbuild ./src/index.ts --bundle --outfile=dist/index.js --external:vscode --format=cjs --platform=node",
+    "build": "npm run esbuild-base -- --sourcemap --minify",
+    "dev": "npm run esbuild-base -- --sourcemap --watch",
+    "test-compile": "tsc -p ./"
+  },
+  "dependencies": {
+    "@player-tools/typescript-expression-plugin": "0.2.2--canary.20.519",
+    "@player-tools/xlr": "0.2.2--canary.20.519",
+    "@player-tools/xlr-utils": "0.2.2--canary.20.519",
+    "@types/node": "^18.11.18"
   },
   "devDependencies": {
+    "@auto-it/vscode": "^10.37.6",
+    "@design-systems/eslint-config": "^2.17.8",
+    "@types/mocha": "^10.0.1",
+    "@vscode/test-electron": "^2.2.1",
     "auto": "^10.37.6",
+    "esbuild": "^0.16.14",
+    "expect": "^29.3.1",
+    "globby": "^11.1.0",
     "husky": "^7.0.0",
     "is-ci": "^3.0.0",
+    "jest-snapshot": "^29.3.1",
     "lint-staged": "^11.0.0",
-    "prettier": "^2.3.2"
+    "mocha": "^10.2.0",
+    "prettier": "^2.3.2",
+    "react": "^18.2.0",
+    "ts-node": "^10.9.1",
+    "typescript": "^4.9.4",
+    "vscode": "^1.1.37"
   },
+  "activationEvents": [
+    "onLanguage:javascript",
+    "onLanguage:javascriptreact",
+    "onLanguage:typescript",
+    "onLanguage:typescriptreact"
+  ],
   "contributes": {
+    "typescriptServerPlugins": [
+      {
+        "name": "@player-tools/typescript-expression-plugin",
+        "enableForWorkspaceTypeScriptVersions": true
+      }
+    ],
     "languages": [
       {
         "id": "source.player.binding",
@@ -92,9 +132,23 @@
           "meta.embedded.block.binding": "source.player.binding"
         }
       }
-    ]
+    ],
+    "configuration": {
+      "title": "Player",
+      "type": "object",
+      "properties": {
+        "player.plugins": {
+          "type": "array",
+          "description": "List of plugins to load",
+          "scope": "resource",
+          "items": {
+            "type": "string"
+          }
+        }
+      }
+    }
   },
-  "dependencies": {
-    "@auto-it/vscode": "^10.37.6"
+  "volta": {
+    "node": "18.13.0"
   }
 }

src/index.ts

@@ -0,0 +1,89 @@
+import { window, extensions, ExtensionContext, workspace } from "vscode";
+import type { TSManifest } from "@player-tools/xlr";
+
+const TYPESCRIPT_EXTENSION_NAME = "vscode.typescript-language-features";
+const TYPESCRIPT_EXPR_PLUGIN = "@player-tools/typescript-expression-plugin";
+const CONFIG_SECTION = "player";
+const log = window.createOutputChannel("Player");
+
+type TypescriptAPI = {
+  configurePlugin(pluginId: string, configuration: any): void;
+};
+
+/**
+ * get typescript api from build-in extension
+ * https://github.com/microsoft/vscode/blob/master/extensions/typescript-language-features/src/api.ts
+ */
+async function getTypescriptAPI(): Promise<TypescriptAPI> {
+  const extension = extensions.getExtension(TYPESCRIPT_EXTENSION_NAME);
+  const err = new Error(
+    "Cannot get typescript APIs. try restart Visual Studio Code."
+  );
+
+  if (!extension) {
+    throw err;
+  }
+
+  await extension.activate();
+
+  if (!extension.exports || !extension.exports.getAPI) {
+    throw err;
+  }
+
+  const api = extension.exports.getAPI(0);
+
+  if (!api) {
+    throw err;
+  }
+
+  return api;
+}
+
+/** Connect to the TS language plugin and forward the config over */
+async function updatePluginWithConfig(config: {
+  /** The manifest entries for the plugins */
+  plugins: Array<TSManifest>;
+}) {
+  const api = await getTypescriptAPI();
+  api.configurePlugin(TYPESCRIPT_EXPR_PLUGIN, config);
+  log.appendLine("Plugin config updated");
+}
+
+/** Dynamically fetch all of the plugins from the given locations */
+async function populatePlugins(plugins: string[]) {
+  const populatedPlugins = plugins.map(async (plugin) => {
+    const mod = await import(plugin);
+    return mod.default ?? mod;
+  });
+
+  return Promise.all(populatedPlugins);
+}
+
+/** Grab the latest config from vscode and send it to the ts-plugin */
+async function updateConfig() {
+  const config = workspace.getConfiguration(CONFIG_SECTION);
+  const plugins = config.get<string[]>("plugins") ?? [];
+
+  try {
+    await updatePluginWithConfig({
+      plugins: await populatePlugins(plugins),
+    });
+  } catch (e: any) {
+    log.appendLine(`Error: ${e.message}`);
+  }
+}
+
+/** entry point for vscode */
+export async function activate(context: ExtensionContext) {
+  log.appendLine("Activating...");
+  updateConfig();
+
+  context.subscriptions.push(
+    workspace.onDidChangeConfiguration((e) => {
+      if (e.affectsConfiguration(CONFIG_SECTION)) {
+        log.appendLine("Configuration changed");
+        updateConfig();
+      }
+    })
+  );
+}

syntaxes/player-binding-inline.json

@@ -18,6 +18,23 @@
         }
       },
       "patterns": [{ "include": "source.player.binding" }]
+    },
+    {
+      "name": "taggedTemplates",
+      "contentName": "meta.embedded.block.binding",
+      "begin": "binding(`)",
+      "beginCaptures": {
+        "1": {
+          "name": "punctuation.definition.string.template.begin.js"
+        }
+      },
+      "end": "`",
+      "endCaptures": {
+        "0": {
+          "name": "punctuation.definition.string.template.end.js"
+        }
+      },
+      "patterns": [{ "include": "source.player.binding" }]
     }
   ],
   "scopeName": "inline.player.binding"

syntaxes/player-expression-inline.json

@@ -18,6 +18,40 @@
         }
       },
       "patterns": [{ "include": "source.player.expression" }]
+    },
+    {
+      "name": "taggedTemplates",
+      "contentName": "meta.embedded.block.expression",
+      "begin": "expr(`)",
+      "beginCaptures": {
+        "1": {
+          "name": "punctuation.definition.string.template.begin.js"
+        }
+      },
+      "end": "`",
+      "endCaptures": {
+        "0": {
+          "name": "punctuation.definition.string.template.end.js"
+        }
+      },
+      "patterns": [{ "include": "source.player.expression" }]
+    },
+    {
+      "name": "taggedTemplates",
+      "contentName": "meta.embedded.block.expression",
+      "begin": "expression(`)",
+      "beginCaptures": {
+        "1": {
+          "name": "punctuation.definition.string.template.begin.js"
+        }
+      },
+      "end": "`",
+      "endCaptures": {
+        "0": {
+          "name": "punctuation.definition.string.template.end.js"
+        }
+      },
+      "patterns": [{ "include": "source.player.expression" }]
     }
   ],
   "scopeName": "inline.player.expression"

tests/run.js

@@ -0,0 +1,22 @@
+const path = require("path");
+const { runTests } = require("@vscode/test-electron");
+
+/** Entry point for all tests */
+async function main() {
+  try {
+    const extensionDevelopmentPath = path.resolve(__dirname, "../../");
+    const extensionTestsPath = path.resolve(__dirname, "./suite/index.js");
+
+    // Download VS Code, unzip it and run the integration test
+    await runTests({
+      extensionDevelopmentPath,
+      extensionTestsPath,
+      launchArgs: ["--disable-extensions"],
+    });
+  } catch (err) {
+    console.error("Failed to run tests", err);
+    process.exit(1);
+  }
+}
+
+main();