Typescript: typescript playground

[dannymarsland]

This is not an issue with the Typescript project, however I am personally adding extensions to the typescript library and services and would like to test this out in an editor. However as my extensions are custom the editors I use do not respect this.

Is the source code for the Typescript playground editor available so I can simply replace the typescript parser and services files with my custom files? I have found various other editors that i can replace the typescript files, however they are all out of date.

If this is the wrong place to ask such a question then please point me to the correct place.

Thanks

[DanielRosenwasser]

Unfortunately the playground editor (Monaco) is not open sourced; when you mention extensions, do you mean script-side specific changes to the existing APIs, or a new function added to the existing services?

[dannymarsland]

I have added the ability to add runtime accessible annotations to classes, class methods and class properties, and I would like to have an editor that supports my changes - code complete syntax highlighting etc. I have changed some of the services to enable this, however I need to be able to add the new typescript services and compiler to an editor. I had a look at https://github.com/hi104/typescript-playground-on-ace however it uses an older version of typescript services and they don't appear to be compatible.

Any advice / suggestions? I basically need an editor that I can simply replace tsc.js and typescriptServices.js

Thanks

[DanielRosenwasser]

If you're using Visual Studio, you can replace your language service & debug your changes using the steps from this page on our wiki. It's pretty easy to set up, you can point your language service file anywhere that you need, and the debug experience is great. Feel free to ask any questions if you do go down this route.

You can use eclipse-typescript, and @derekcicerone would probably be the most helpful.

You can use atom-typescript, and @basarat would be most helpful here.

[basarat]

For atom typescript you can just replace this folder with your version : https://github.com/TypeStrong/atom-typescript/tree/master/node_modules/typescript

The plan is to make an atomTS specific subkey of tsconfig : https://github.com/TypeStrong/atom-typescript/issues/57 to drive which typescript is required.

[dannymarsland]

Thanks @DanielRosenwasser and @basarat . I am working on a mac so I don't currently have Visual Studio, however I installed atom and it is working well.

@basarat what is the easiest way to debug my tsc.js and typescriptServices.js ? Is there a way I can view the console output?

Thanks

[basarat]

what is the easiest way to debug my tsc.js and typescriptServices.js ?

These are the version that get used (any file placed here would do) : https://github.com/TypeStrong/atom-typescript/tree/master/node_modules/typescript/bin

Is there a way I can view the console output?

console.error in this file : https://github.com/TypeStrong/atom-typescript/blob/master/lib/main/lang/projectService.ts gets logged to the atom console (ctrl+alt+i) which is just a chrome dev tools console.

[dannymarsland]

Thanks both, I can work with this.

[basarat]

@dannymarsland we've started work on 1.5 as well https://github.com/TypeStrong/atom-typescript/pull/179

[DanielRosenwasser]

Keep us in the loop, it's interesting to see the kinds of things people would like out of the official LS.

[carloslfu]

Monaco is now opensource https://github.com/Microsoft/monaco-editor

[prashaantt]

@DanielRosenwasser Now that Monaco is out in the open, is there any chance the Playground will also be open sourced?

[mhegazy]

@DanielRosenwasser Now that Monaco is out in the open, is there any chance the Playground will also be open sourced?

the playground is just two instances of monaco. This uses the latest drop from monaco-editor, you can find the page source available at view-source:http://www.typescriptlang.org/play/index.html

[prashaantt]

I was actually looking for a repo to send a PR to allow setting compiler options (esp. noImplicitAny and strictNullChecks) for the Playground. I like playing around a lot here but sometimes really miss stronger ~adult supervision~ type-checking :)

[RyanCavanaugh]

Bad news: The website currently isn't OSS. Good news: We're working on adding compiler options to the Playground UI already

[mhegazy]

@DanielRosenwasser added the options over the holidays already:

[prashaantt]

Awesome, can't believe I missed that new button!

[fabiandev]

As I needed a playground for another project, I've created typescript-playground, which is very similar to TypeScript's existing playground, but with some enhancements, e.g. to setting compiler options and to the run code functionality.

A live demo is also hosted on GitHub Pages: https://fabiandev.github.io/typescript-playground