Cypress code coverage plugin with TypeScript

Question

I'm trying to make the @cypress/code-coverage plugin work with TypeScript in my project, currently without success. Here are the detailed steps that I tried until now:

Done all the instructions from https://docs.cypress.io/guides/tooling/typescript-support
Added to root folder .eslintrc.json:

  "plugins": [
    "cypress"
  ],
  "env": {
    "cypress/globals": true
  },

Changed cypress\support\index.js to index.ts and added:

import '@cypress/code-coverage/support';

Changed cypress\plugins\index.js to index.ts and added:

/**
 * @type {Cypress.PluginConfig}
 */
module.exports = (on, config) => {
  // `on` is used to hook into various events Cypress emits
  // `config` is the resolved Cypress config

  require('@cypress/code-coverage/task')(on, config);

  // It's IMPORTANT to return the config object
  // with any changed environment variables
  return config;
};

Now for the errors I got from the above step:

module.exports = changed to export default

(on, config) changed to:

(
  on: Cypress.PluginEvents,
  config: Cypress.PluginConfigOptions
)

Changed require('@cypress/code-coverage/task')(on, config); to import('@cypress/code-coverage/task')(on, config);

This is the part where I'm stuck now and don't know how to handle this error:

Could not find a declaration file for module '@cypress/code-coverage/task'. 'c:/repo/test-app/frontend/node_modules/@cypress/code-coverage/task.js' implicitly has an 'any' type.
  Try `npm i --save-dev @types/cypress__code-coverage` if it exists or add a new declaration (.d.ts) file containing `declare module '@cypress/code-coverage/task';`ts(7016)

Please help me resolve the above issue.

Cypress code coverage plugin with TypeScript

0 Answers