title: Cypress Test Coverage (Create-react-app CRA Typescript)
body: <p>I've been trying to set up Cypress code covereage based on their documentation, but it doesnt cover CRA (Create-react-app) in 2022 with Typescript, so i've been having some trouble.</p>
  <p>My folder structure is:
  root/cypress/support
  root/cypress/plugins
  root/cypress/components
  root/cypress/e2e</p>
  <p>Contents of support/index.js:</p>
  <pre><code>import &quot;@cypress/code-coverage/support&quot;;
  </code></pre>
  <p>contents of plugins/index.js</p>
  <pre><code>    module.exports = (on, config) =&gt; {
    require(&quot;@cypress/code-coverage/task&quot;)(on, config);
    return config;
  };
  </code></pre>
  <p>Cypress.config.ts:</p>
  <pre><code>import { defineConfig } from &quot;cypress&quot;;
  export default defineConfig({
    e2e: {
      setupNodeEvents(on, config) {},
    },
    component: {
      supportFile: &quot;cypress/support/index.js&quot;,
      supportFolder: &quot;cypress/support&quot;,
      fixturesFolder: &quot;cypress/fixtures&quot;,
      devServer: {
        framework: &quot;create-react-app&quot;,
        bundler: &quot;webpack&quot;,
      },
    },
  });
  </code></pre>
  <p>Spec file:</p>
  <pre><code>import * as React from &quot;react&quot;;
  import App from &quot;../../src/app/App&quot;;
  import { mount } from &quot;cypress/react&quot;;
  
  describe(&quot;App&quot;, function () {
    it(&quot;Should create &lt;App&gt;&quot;, () =&gt; {
      mount(&lt;App /&gt;);
      cy.get(&quot;[data-testid=AppContainer]&quot;).should(&quot;exist&quot;);
    });
  });
  </code></pre>
  <p>Dev dependencies and scripts:</p>
  <pre><code>  &quot;devDependencies&quot;: {
      &quot;@cypress/code-coverage&quot;: &quot;^3.10.0&quot;,
      &quot;@cypress/instrument-cra&quot;: &quot;^1.4.0&quot;,
      &quot;@cypress/webpack-dev-server&quot;: &quot;^2.0.0&quot;,
      &quot;@svgr/webpack&quot;: &quot;^6.2.1&quot;,
      &quot;@types/eslint&quot;: &quot;^8.4.5&quot;,
      &quot;@types/eslint-config-prettier&quot;: &quot;^6.11.0&quot;,
      &quot;@types/eslint-plugin-prettier&quot;: &quot;^3.1.0&quot;,
      &quot;@types/prettier&quot;: &quot;^2.6.3&quot;,
      &quot;@typescript-eslint/eslint-plugin&quot;: &quot;^5.30.5&quot;,
      &quot;@typescript-eslint/parser&quot;: &quot;^5.30.5&quot;,
      &quot;cypress&quot;: &quot;^10.3.1&quot;,
      &quot;eslint&quot;: &quot;^8.19.0&quot;,
      &quot;eslint-config-prettier&quot;: &quot;^8.5.0&quot;,
      &quot;eslint-plugin-prettier&quot;: &quot;^4.2.1&quot;,
      &quot;gh-pages&quot;: &quot;^4.0.0&quot;,
      &quot;istanbul-lib-coverage&quot;: &quot;^3.2.0&quot;,
      &quot;nyc&quot;: &quot;^15.1.0&quot;,
      &quot;prettier&quot;: &quot;^2.7.1&quot;,
      &quot;react-scripts&quot;: &quot;^5.0.1&quot;,
      &quot;start-server-and-test&quot;: &quot;^1.14.0&quot;,
      &quot;vite&quot;: &quot;^2.7.0&quot;
    },
    &quot;scripts&quot;: {
      &quot;start&quot;: &quot;react-scripts -r @cypress/instrument-cra start&quot;,
      &quot;build&quot;: &quot;react-scripts build&quot;,
      &quot;e2e&quot;: &quot;cypress open&quot;,
      &quot;cypress:start:app&quot;: &quot;SET BROWSER=NONE&amp;&amp; react-scripts -r @cypress/instrument-cra start&quot;,
      &quot;cypress:start:wait&quot;: &quot;start-server-and-test cypress:start:app http://localhost:3000/mcswf&quot;,
      &quot;cypress:open&quot;: &quot;npm run cypress:start:wait -- \&quot;cypress open\&quot;&quot;,
      &quot;cypress:run&quot;: &quot;npm run cypress:start:wait -- \&quot;cypress run\&quot;&quot;,
      &quot;eject&quot;: &quot;react-scripts eject&quot;,
      &quot;predeploy&quot;: &quot;npm run build&quot;,
      &quot;deploy&quot;: &quot;gh-pages -b GitHubPage -d build&quot;
    },
  </code></pre>
  <p>Error crom cypress:</p>
  <p><a href="https://i.stack.imgur.com/1qU9l.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/1qU9l.png" alt="enter image description here" /></a></p>
  <pre><code>log⚠️ Code coverage tasks were not registered by the plugins file. See support issue for possible workarounds. [@cypress/code-coverage]
  </code></pre>
  <p>Please let me know if I'm doing anything incorrectly! thank you so much.</p>