test: Add support for Typescript tests in core

eslint.config.mjs

@@ -543,5 +543,9 @@ export default defineConfig(
       files: ['packages/blockly/tests/typescript/**/*.ts', 'packages/blockly/tests/typescript/**/*.tsx'],
       tsconfig: './tests/typescript/tsconfig.json',
     }),
+    buildTSOverride({
+      files: ['packages/blockly/tests/mocha/**/*.ts'],
+      tsconfig: './tests/mocha/tsconfig.json',
+    }),
   ),
 );

packages/blockly/package.json

@@ -20,9 +20,18 @@
     "jsdom": false
   },
   "imports": {
-    "#core/*": "./build/src/core/*",
-    "#blocks/*": "./build/src/blocks/*",
-    "#generators/*": "./build/src/generators/*"
+    "#core/*": {
+      "types": "./build/declarations/core/*",
+      "default": "./build/src/core/*"
+    },
+    "#blocks/*": {
+      "types": "./build/declarations/blocks/*",
+      "default": "./build/src/blocks/*"
+    },
+    "#generators/*": {
+      "types": "./build/declarations/generators/*",
+      "default": "./build/src/generators/*"
+    }
   },
   "publishConfig": {
     "directory": "dist"
@@ -79,9 +88,10 @@
     "tsc": "gulp tsc",
     "test": "gulp test",
     "test:browser": "npx mocha --config tests/browser/.mocharc.js",
-    "test:mocha:node": "npx mocha --config tests/mocha/.mocharc.node.cjs \"tests/mocha/**/*_test.js\"",
+    "test:mocha:node": "npm run test:mocha:typecheck && npx mocha --config tests/mocha/.mocharc.node.cjs \"tests/mocha/**/*_test.{js,ts}\"",
+    "test:mocha:typecheck": "tsc -p tests/mocha/tsconfig.json",
     "test:generators": "gulp testGenerators",
-    "test:mocha:interactive": "npm run build && node scripts/prepare_mocha_bundle.mjs && concurrently -n tsc,esbuild,python3 \"tsc --watch --preserveWatchOutput --outDir \"build/src\" --declarationDir \"build/declarations\"\" \"esbuild build/tests/bundle-entry.js --bundle --sourcemap --alias:blockly/core=./build/src/core/blockly.js --alias:blockly/blocks=./build/src/blocks/blocks.js --alias:blockly=./build/src/core/blockly.js --outfile=build/tests/mocha-bundle.js --servedir=. --serve=127.0.0.1:8080 --watch=forever --log-level=warning\" \"python3 -m webbrowser 'http://localhost:8080/tests/mocha/index.html'\"",
+    "test:mocha:interactive": "npm run build && node scripts/prepare_mocha_bundle.mjs && concurrently -n tsc,tsc:tests,esbuild,python3 \"tsc --watch --preserveWatchOutput --outDir \"build/src\" --declarationDir \"build/declarations\"\" \"npm run test:mocha:typecheck -- --watch --preserveWatchOutput\" \"esbuild build/tests/bundle-entry.js --bundle --sourcemap --alias:blockly/core=./build/src/core/blockly.js --alias:blockly/blocks=./build/src/blocks/blocks.js --alias:blockly=./build/src/core/blockly.js --outfile=build/tests/mocha-bundle.js --servedir=. --serve=127.0.0.1:8080 --watch=forever --log-level=warning\" \"python3 -m webbrowser 'http://localhost:8080/tests/mocha/index.html'\"",
     "test:compile:advanced": "gulp buildAdvancedCompilationTest --debug",
     "updateGithubPages": "npm ci && node scripts/update_github_pages.mjs --upstream",
     "updateGithubPages:staging": "npm ci && node scripts/update_github_pages.mjs --use-local"
@@ -142,6 +152,9 @@
     "@hyperjump/json-schema": "^1.17.6",
     "@microsoft/api-documenter": "7.30.13",
     "@microsoft/api-extractor": "^7.58.9",
+    "@types/chai": "^5.2.3",
+    "@types/mocha": "^10.0.10",
+    "@types/sinon": "^22.0.0",
     "async-done": "^2.0.0",
     "chai": "^6.2.2",
     "concurrently": "^10.0.4",

packages/blockly/tests/mocha/browser-setup.js

@@ -26,9 +26,21 @@ import '@blockly/block-test';
 
 chaiConfig.showDiff = false;
 
-globalThis.Blockly = Blockly;
-globalThis.javascriptGenerator = javascriptGenerator;
-globalThis.sinon = sinon;
+// Load globals used by the JS tests. This uses Object.defineProperty to avoid
+// Typescript inferring typings for these objects and allowing TS tests to
+// typecheck without explicitly importing them. When all tests are converted to
+// TS, this should be removed.
+for (const [name, value] of Object.entries({
+  Blockly,
+  javascriptGenerator,
+  sinon,
+})) {
+  Object.defineProperty(globalThis, name, {
+    value,
+    configurable: true,
+    writable: true,
+  });
+}
 
 // The focusable trees, toolbox definitions and #blocklyDiv the tests expect.
 // Shared with the Node harness so both run against identical markup.

packages/blockly/tests/mocha/comment_view_test.js

@@ -14,7 +14,7 @@ import {
 suite('Workspace comment', function () {
   setup(function () {
     sharedTestSetup.call(this);
-    this.workspace = new Blockly.inject('blocklyDiv', DEFAULT_INJECT_OPTIONS);
+    this.workspace = Blockly.inject('blocklyDiv', DEFAULT_INJECT_OPTIONS);
     this.commentView = new Blockly.comments.CommentView(this.workspace);
   });
 

packages/blockly/tests/mocha/event_block_change_test.js

@@ -118,7 +118,7 @@ suite('Block Change Event', function () {
       );
 
       const json = origEvent.toJson();
-      const newEvent = new Blockly.Events.fromJson(json, this.workspace);
+      const newEvent = Blockly.Events.fromJson(json, this.workspace);
 
       assert.deepEqual(newEvent, origEvent);
     });

packages/blockly/tests/mocha/event_block_create_test.js

@@ -96,7 +96,7 @@ suite('Block Create Event', function () {
       const origEvent = new Blockly.Events.BlockCreate(block);
 
       const json = origEvent.toJson();
-      const newEvent = new Blockly.Events.fromJson(json, this.workspace);
+      const newEvent = Blockly.Events.fromJson(json, this.workspace);
 
       assert.deepEqual(newEvent, origEvent);
     });

packages/blockly/tests/mocha/event_block_delete_test.js → packages/blockly/tests/mocha/event_block_delete_test.ts

@@ -4,50 +4,53 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
+import * as Blockly from '#core/blockly.js';
 import {assert} from 'chai';
+import sinon from 'sinon';
 import {defineRowBlock} from './test_helpers/block_definitions.js';
 import {
   sharedTestSetup,
   sharedTestTeardown,
 } from './test_helpers/setup_teardown.js';
 
 suite('Block Delete Event', function () {
-  setup(function () {
-    this.clock = sharedTestSetup.call(this, {fireEventsNow: false}).clock;
+  let clock: sinon.SinonFakeTimers;
+  let workspace: Blockly.Workspace;
+
+  setup(function (this: Mocha.Context) {
+    ({clock} = sharedTestSetup.call(this, {fireEventsNow: false}));
     defineRowBlock();
-    this.workspace = new Blockly.Workspace();
+    workspace = new Blockly.Workspace();
   });
 
-  teardown(function () {
-    sharedTestTeardown.call(this);
+  teardown(function (this: Mocha.Context) {
+    sharedTestTeardown.call(this, workspace);
   });
 
   suite('Receiving', function () {
     test('blocks do not receive their own delete events', function () {
       Blockly.Blocks['test'] = {
-        onchange: function (e) {},
+        onchange: function (_e: Blockly.Events.Abstract) {},
       };
       // Need to stub the definition, because the property on the definition is
       // what gets registered as an event listener.
       const spy = sinon.spy(Blockly.Blocks['test'], 'onchange');
-      const testBlock = this.workspace.newBlock('test');
+      const testBlock = workspace.newBlock('test');
 
       testBlock.dispose();
-      this.clock.runAll();
+      clock.runAll();
 
       assert.isFalse(spy.called);
     });
   });
 
   suite('Serialization', function () {
     test('events round-trip through JSON', function () {
-      const block = this.workspace.newBlock('row_block', 'block_id');
+      const block = workspace.newBlock('row_block', 'block_id');
       const origEvent = new Blockly.Events.BlockDelete(block);
 
       const json = origEvent.toJson();
-      const newEvent = new Blockly.Events.fromJson(json, this.workspace);
-      delete origEvent.oldXml; // xml fails deep equals for some reason.
-      delete newEvent.oldXml; // xml fails deep equals for some reason.
+      const newEvent = Blockly.Events.fromJson(json, workspace);
 
       assert.deepEqual(newEvent, origEvent);
     });

packages/blockly/tests/mocha/event_block_drag_test.js → packages/blockly/tests/mocha/event_block_drag_test.ts

@@ -4,6 +4,7 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
+import * as Blockly from '#core/blockly.js';
 import {assert} from 'chai';
 import {defineRowBlock} from './test_helpers/block_definitions.js';
 import {
@@ -12,23 +13,25 @@ import {
 } from './test_helpers/setup_teardown.js';
 
 suite('Block Drag Event', function () {
-  setup(function () {
+  let workspace: Blockly.Workspace;
+
+  setup(function (this: Mocha.Context) {
     sharedTestSetup.call(this);
     defineRowBlock();
-    this.workspace = new Blockly.Workspace();
+    workspace = new Blockly.Workspace();
   });
 
-  teardown(function () {
-    sharedTestTeardown.call(this);
+  teardown(function (this: Mocha.Context) {
+    sharedTestTeardown.call(this, workspace);
   });
 
   suite('Serialization', function () {
     test('events round-trip through JSON', function () {
-      const block = this.workspace.newBlock('row_block', 'block_id');
+      const block = workspace.newBlock('row_block', 'block_id');
       const origEvent = new Blockly.Events.BlockDrag(block, true, []);
 
       const json = origEvent.toJson();
-      const newEvent = new Blockly.Events.fromJson(json, this.workspace);
+      const newEvent = Blockly.Events.fromJson(json, workspace);
 
       assert.deepEqual(newEvent, origEvent);
     });

packages/blockly/tests/mocha/event_bubble_open_test.js

@@ -34,7 +34,7 @@ suite('Bubble Open Event', function () {
       );
 
       const json = origEvent.toJson();
-      const newEvent = new Blockly.Events.fromJson(json, this.workspace);
+      const newEvent = Blockly.Events.fromJson(json, this.workspace);
 
       assert.deepEqual(newEvent, origEvent);
     });

packages/blockly/tests/mocha/event_click_test.js → packages/blockly/tests/mocha/event_click_test.ts

@@ -4,6 +4,7 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
+import * as Blockly from '#core/blockly.js';
 import {assert} from 'chai';
 import {defineRowBlock} from './test_helpers/block_definitions.js';
 import {
@@ -12,27 +13,29 @@ import {
 } from './test_helpers/setup_teardown.js';
 
 suite('Click Event', function () {
-  setup(function () {
+  let workspace: Blockly.Workspace;
+
+  setup(function (this: Mocha.Context) {
     sharedTestSetup.call(this);
     defineRowBlock();
-    this.workspace = new Blockly.Workspace();
+    workspace = new Blockly.Workspace();
   });
 
-  teardown(function () {
-    sharedTestTeardown.call(this);
+  teardown(function (this: Mocha.Context) {
+    sharedTestTeardown.call(this, workspace);
   });
 
   suite('Serialization', function () {
     test('events round-trip through JSON', function () {
-      const block = this.workspace.newBlock('row_block', 'block_id');
+      const block = workspace.newBlock('row_block', 'block_id');
       const origEvent = new Blockly.Events.Click(
         block,
         undefined,
         Blockly.Events.ClickTarget.BLOCK,
       );
 
       const json = origEvent.toJson();
-      const newEvent = new Blockly.Events.fromJson(json, this.workspace);
+      const newEvent = Blockly.Events.fromJson(json, workspace);
 
       assert.deepEqual(newEvent, origEvent);
     });

packages/blockly/tests/mocha/event_comment_change_test.js → packages/blockly/tests/mocha/event_comment_change_test.ts

@@ -4,25 +4,28 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
+import * as Blockly from '#core/blockly.js';
 import {assert} from 'chai';
 import {
   sharedTestSetup,
   sharedTestTeardown,
 } from './test_helpers/setup_teardown.js';
 
 suite('Comment Change Event', function () {
-  setup(function () {
+  let workspace: Blockly.Workspace;
+
+  setup(function (this: Mocha.Context) {
     sharedTestSetup.call(this);
-    this.workspace = new Blockly.Workspace();
+    workspace = new Blockly.Workspace();
   });
 
-  teardown(function () {
-    sharedTestTeardown.call(this);
+  teardown(function (this: Mocha.Context) {
+    sharedTestTeardown.call(this, workspace);
   });
 
   suite('Serialization', function () {
     test('events round-trip through JSON', function () {
-      const comment = new Blockly.comments.WorkspaceComment(this.workspace);
+      const comment = new Blockly.comments.WorkspaceComment(workspace);
       comment.setText('old text');
       const origEvent = new Blockly.Events.CommentChange(
         comment,
@@ -31,7 +34,7 @@ suite('Comment Change Event', function () {
       );
 
       const json = origEvent.toJson();
-      const newEvent = new Blockly.Events.fromJson(json, this.workspace);
+      const newEvent = Blockly.Events.fromJson(json, workspace);
 
       assert.deepEqual(newEvent, origEvent);
     });