Update Blockly codebase to Typescript

[rachel-fenichel]

Steps for this update. These are not necessarily in order, and some will be broken out as separate bugs.

Old Tracking List:

• Add a tsconfig.json. (Set up typescript compilation #5892)
• Wire the typescript compiler to output into the build directory such that the closure compiler picks up the correct files. (Set up typescript compilation #5892)
• Add gulp tasks and scripts in package.json to run the ts compiler and then the closure compiler. (Set up typescript compilation #5892)
• Add gulp tasks and scripts in package.json to clean up generated files when needed. (Set up typescript compilation #5892)
• Convert to ES Modules #5904
• Set up tsickle or similar to re-inject annotations for the closure compiler. #5960

Must happen pre merge:

• Check all @enums for formatting issues. [beka]
  • Fix KeyCodes in core/utils/keycodes.ts. [christopher]
• Check all @typedefs for lost JSDocs. [beka]
• Export @typedefs that were static properties on classes [beka]
• Move comments that migrants put in the wrong place [beka]
• Remove remaining declareLegacyNamespace calls [christopher]
• Migrate blockly.js to blockly.ts [christopher]
• Get Blockly to pass CI. [TBD]

Can happen post merge:

• Fix any @protected properties that have been changed to parameter properties [beka]
• Check that public parameter properties are correct [beka]
• Investigate why compose is commented out in BlockSvg [beka]
• Export interface types that were exported from blockly.js [beka]
• Redefine properties that were defined using Object.defineProperties [christopher]
  • Check that we've properly deprecated all of the above properties, including any in blocks or generators. [beka]
• Find new places to put the properties that were defined using Object.defineProperties [beka]
• Implement piping sourcemaps from tsc to closure compiler [christopher]
• Get generating type defs working [beka]
  • Rename instances of AnyDuringMigration in defs to any[beka]
• Fix packaging sources (.ts instead of .js) [beka]
• Get API Extractor Working
  • Get Maribeth set up with a branch that builds [beka]
  • Enable API Extractor. [maribeth]
  • Migrate JSDoc to TSDoc. [TBD]
    • Move any docs attached to property assignments to property definitions [TBD]
  • Figure out how to pipe the results of API Extractor to devsite [maribeth]
• Update the Blockly style guide to document where we differ from the Google TS (or JS) styleguide
  • E.g., using TSDoc, requiring blank line before @params, listing all @params even when annotation adds no information, etc.
• Update the renamings script to handle the new import structure for blocks and generators [beka]
• Fix BlocklyOptions (which stopped actually defining anything during the goog.module migration) [beka]
• Make block.workspace not nullable [aaron]
• Add type information to interfaces [aaron]

Optional niceties:

• Deal with IRegistrableField trying to include a static property in an interface We were actually doing this correctly.
• Remove unused JSDoc attributes
• Get ESLint to work with Typescript [maribeth]
• Fix CSS formatting. E.g. common/constants [beka]
• Look into DynamicShape in common/constants [beka]
• Update everything to conform to the ts styleguide
• Remove all instances of AnyDuringMigration [beka/aaron]
• Revert changes to the BlockDefinition type (in /blocks) Update BlockDefinition type import in block definition files #6248

Additional portions of the Blockly codebase (outside of core/ to migrate:

• blocks/ and generators/: Convert blocks/ and generators/ to TypeScript #6828
• tests/ or portions thereof?
• scripts/ or portions thereof?

[daniel-brenot]

I've been experimenting with this in my fork. I've deleted a large portion of the project structure for the moment and renamed all of the js files to ts. If you would like to work with me on this i am more than happy to accept help.

Most of the work i've been doing is using tools i'm making myself to do some simple find and replaces, although some syntax tree parsing seems to now be in order to handle things such converting the prototypes to classes, so that's my current focus. The branch i am currently on is mostly to see how far i can get with this and then once it is done i will create a new branch that i will squash the changes that are needed onto without having the messy history involved in the experimentation.

Feel free to contact me and check out my branch

[rachel-fenichel]

@daniel-brenot sure, can you send me a link to the relevant branch on your fork?

I've been working through the ES6 classes part: #5860 and associated pull requests. I've been using a tool to do the class conversions, then touching it up as needed. Some classes can't be converted yet, often because we're not calling super at the beginning of the constructor.

After class conversions the most critical thing is to get the build process working.

[daniel-brenot]

I'm looking into lebab for the automatic conversion. I'm experementing with multiple ways of doing most of the work automatically since the repository is so large.

My branch can be found here: https://github.com/daniel-brenot/blockly

[daniel-brenot]

Part of this is that it may be prudent to separate some of the work for blockly into separate repositories for things such as generators for different languages.

[rachel-fenichel]

Separate repositories, or just separate issues for tracking each piece of work?

The swap to Typescript tooling will not involve making separate repositories, because that expands the scope of the work well past a quarter.

In the future we want to move generators, block definitions, and some other files out of core and into plugins, but we need to have clear migration paths for developers and generally minimize disruption where possible.

[daniel-brenot]

Makes sense. In my local version i'm going to try to make typescript compile each one of the separate parts into a separate file with separate definitions to keep it compatible with how it seems to currently be done.

[BeksOmega]

I'm moving the task tracking here. [Edit: Moved into the top level comment]

[tolst0v]

coolconsole.log('cool')

[BeksOmega]

I'm going to close this because it looks like we haven't been using it for task tracking in over a year.

[itsezc]

I'm going to close this because it looks like we haven't been using it for task tracking in over a year.

Where is the tracking happening currently? Would love to stay up to date with the progress.

[BeksOmega]

I'm going to close this because it looks like we haven't been using it for task tracking in over a year.

Where is the tracking happening currently? Would love to stay up to date with the progress.

I don't think any work is currently being done to convert more things to typescript. All of the external-facing code (I.e. everything but tests) has already been converted. Although we do have a few issues open for improving what we've got:

• Improve implementation and type safety of generators #7600
• Improve implementation and type safety of library blocks #6920