hmm, could not TS work example (#385)

Author: bahmutov

README.md

@@ -404,6 +404,7 @@ Full examples we use for testing in this repository:
 - [examples/ts-example](examples/ts-example) uses Babel + Parcel to instrument and serve TypeScript file
 - [examples/use-webpack](examples/use-webpack) shows Webpack build with source maps and Babel
 - [examples/unit-tests-js](examples/unit-tests-js) runs just the unit tests and reports code coverage (JavaScript source code)
+- [examples/unit-tests-ts](examples/unit-tests-ts) **NOT WORKING** runs just the unit tests and reports code coverage (TypeScript source code)
 
 ### External examples
 

examples/unit-tests-ts/.babelrc

@@ -0,0 +1,6 @@
+{
+  "plugins": ["istanbul"],
+  "presets": [
+    "@babel/preset-typescript"
+  ]
+}

examples/unit-tests-ts/README.md

@@ -0,0 +1,5 @@
+# example: unit-tests-ts
+
+Examples that only run unit tests to test code written in TypeScript
+
+**NOT WORKING** seems the TS code goes through `tsify` plugin, and does not pass via Istanbul plugin no matter what I try. See [issue #361](https://github.com/cypress-io/code-coverage/issues/361).

examples/unit-tests-ts/cypress.json

@@ -0,0 +1,3 @@
+{
+  "fixturesFolder": false
+}

examples/unit-tests-ts/cypress/integration/spec.ts

@@ -0,0 +1,13 @@
+/// <reference types="cypress" />
+import { isObject, add } from '../../src/utils/misc'
+
+describe('unit tests', () => {
+  it('adds two numbers', () => {
+    expect(add(2, 3)).to.equal(5)
+  })
+
+  it('checks for object', () => {
+    expect(isObject({}), '{}').to.be.true
+    expect(isObject([]), '[]').to.be.true
+  })
+})

examples/unit-tests-ts/cypress/plugins/index.js

@@ -0,0 +1,41 @@
+// using browserify
+const browserify = require('@cypress/browserify-preprocessor')
+
+module.exports = (on, config) => {
+  require('../../../../task')(on, config)
+
+  const options = browserify.defaultOptions
+  // options.browserifyOptions.transform[1][1].babelrc = true
+  options.browserifyOptions.extensions.push('.ts')
+  // options.browserifyOptions.transform.push([
+  //   require.resolve('browserify-istanbul'),
+  //   {}
+  // ])
+  options.typescript = require.resolve('typescript')
+  // on('file:preprocessor', require('../../../../use-babelrc'))
+  console.log('browserify options')
+  console.log(JSON.stringify(options, null, 2))
+
+  on('file:preprocessor', browserify(options))
+  return config
+}
+
+// using webpack
+/// <reference types="cypress" />
+// const webpack = require('@cypress/webpack-preprocessor')
+
+// /**
+//  * @type {Cypress.PluginConfig}
+//  */
+// module.exports = (on, config) => {
+//   const options = {
+//     // use the same Webpack options to bundle spec files as your app does "normally"
+//     // which should instrument the spec files in this project
+//     webpackOptions: require('../../webpack.config'),
+//     watchOptions: {}
+//   }
+//   on('file:preprocessor', webpack(options))
+
+//   require('../../../../task')(on, config)
+//   return config
+// }

examples/unit-tests-ts/cypress/support/index.js

@@ -0,0 +1 @@
+import '../../../../support'

examples/unit-tests-ts/package.json

@@ -0,0 +1,7 @@
+{
+  "name": "example-unit-tests-ts",
+  "description": "Run unit tests written using TypeScript",
+  "scripts": {
+    "cy:open": "../../node_modules/.bin/cypress open"
+  }
+}

examples/unit-tests-ts/src/utils/misc.ts

@@ -0,0 +1,11 @@
+/**
+ * Very simple check, returns true for arrays as well
+ */
+export function isObject(object: any) {
+  return object != null && typeof object === 'object'
+}
+
+/**
+ * Adds two numbers together
+ */
+export const add = (a: number, b: number) => a + b

examples/unit-tests-ts/tsconfig.json

@@ -0,0 +1,8 @@
+{
+  "compilerOptions": {
+    "target": "es5",
+    "module": "commonjs",
+    "moduleResolution": "node"
+  },
+  "files": ["./src/**/*.ts"]
+}