Writing Cypress Tasks in Typescript

Question

Is there a method that works with the Cypress Typescript `preprocessor pattern for writing tasks in Typescript?

The example here uses a JavaScript plugin file:

https://github.com/cypress-io/cypress-example-recipes/tree/master/examples/preprocessors__typescript-webpack

Specifically

https://github.com/cypress-io/cypress-example-recipes/blob/master/examples/preprocessors__typescript-webpack/cypress/plugins/index.js

This does seem to be a bit of a chicken and egg problem though.

After much testing I can't find a way to write and include a Typescript plugin into the JavaScript plugin file. Without compiling the file first via tsc then opening cypress.

Mentioned in Gitter is using ts-node/register to do it but I can't figure it out.

https://gitter.im/cypress-io/cypress/archives/2019/04/08

Answer 1

You should start by installing the Node type definitions:

npm install --save-dev @types/node

From there, you can continue by replacing all require statements with imports, all export.module with typescript exports, etc. Since this is all Node, you should be able to migrate your Cypress task files like you would any plain NodeJS file.

The best way to go is just starting with some directory and working your way up from there, fixing build errors as you go along.