Wavesurfer.js: Use TypeScript?

Created on 15 Sep 2017  ·  9Comments  ·  Source: katspaugh/wavesurfer.js

Since WaveSurfer already has thorough type annotations, perhaps it would make sense to use TypeScript?

The ES6 and ES5 versions can be generated by the TypeScript compiler and checked in.

There is a tool to convert existing annotated JavaScript to TypeScript here called Gents:
https://github.com/angular/clutz#gents---closure-to-typescript-converter

Documentation generator here:
https://github.com/TypeStrong/typedoc

enhancement typescript

Most helpful comment

@mspae if you want to open a PR – I'm sure the result should be good.

An alternative would be to use something like https://github.com/Microsoft/dts-gen to generate a separate typings file and maintain it in parallel with the ES6 codebase. But I'm not against TypeScript proper. 👍

All 9 comments

The TypeScript compiler works perfectly with regular JavaScript and the type inference, especially with JSDoc annotations. What we might add is a good jsconfig.js similar to this.

I know VSCode and Emacs have good support of TypeScript-for-JS.

JSDoc type system is rather limited (or at least its subset that's supported by TypeScript), some common JavaScript patterns can't be expressed in it.

For example, event handler arguments that differ depending on the event:

export declare class WaveSurfer {
  on(event: 'region-created', listener: (region: WaveSurfer.Region) => any): void;
  on(event: 'region-click', listener: (region: WaveSurfer.Region, event: MouseEvent) => any): void;
  on(event: 'region-dblclick', listener: (region: WaveSurfer.Region, event: MouseEvent) => any): void;
  on(event: 'contextmenu', listener: (event: MouseEvent) => any): void;
  ...
}

The above is from my type declarations for WaveSurfer v1.

Would it be possible to generate inferred typings, add missing stuff manually and publish in the definitely-typed repository?

It seems possible (using the tool I linked above) but then you'd have to keep them in sync! Why not just write the code in TypeScript? You have type annotations everywhere already anyway, so it's not like it's more effort. Learning TypeScript is on the same level of difficulty as learning the JSDoc syntax (or easier because of better documentation and compiler error messages).

I'm all for it, but I think even with automatic conversion it will still require quite a large amount of additional tweaking & annotating. That said, if someone is willing to do it I think it would be awesome.

It might also make it easier to enforce type annotations in PRs because they are more "part of the code" than JSDoc comments.

@katspaugh Just to clarify, because it wasn't clear to me from your post: Did you mean it isn't strictly necessary (for an IDE-like experience in an editor) or that you wouldn't want a PR to migrate to typescript?

I'm asking because I'm considering migrating the code and opening a PR and wouldn't start if you don't want it.

I agree that IDE-like experience has gotten much better with better jsdoc comments but I still think migrating to typescript proper would make sense because:

  • It enforces people to properly type the code in their PRs (instead of adding JSdoc comments, which are not part of the language itself) and allows our CI build process to statically check types
  • As @glebm mentioned, typescript does allow more advanced type annotations than jsdoc style comments.

@mspae if you want to open a PR – I'm sure the result should be good.

An alternative would be to use something like https://github.com/Microsoft/dts-gen to generate a separate typings file and maintain it in parallel with the ES6 codebase. But I'm not against TypeScript proper. 👍

Any progress on this?

It looks like this issue can be closed, because typings can be installed using npm install @types/wavesurfer.js

Was this page helpful?
0 / 5 - 0 ratings

Related issues

frumbert picture frumbert  ·  4Comments

itamaker picture itamaker  ·  4Comments

SGDAT picture SGDAT  ·  3Comments

CramericaIndustries picture CramericaIndustries  ·  4Comments

pyros-endgame picture pyros-endgame  ·  4Comments