fix: Only enable TypeScript jsx compiling for .js, .jsx, and .tsx files (#45)

Author: sainthkh

lib/simple_tsify.js

@@ -1,4 +1,5 @@
-let through = require('through2')
+const through = require('through2')
+const path = require('path')
 
 const isJson = (code) => {
   try {
@@ -14,8 +15,9 @@ const isJson = (code) => {
 // It means it should check types whenever spec file is changed
 // and it slows down the test speed a lot.
 // We skip this slow type-checking process by using transpileModule() api.
-module.exports = function (b, opts) {
+module.exports = function (filePath, opts) {
   const chunks = []
+  const ext = path.extname(filePath)
 
   return through(
     (buf, enc, next) => {
@@ -32,7 +34,7 @@ module.exports = function (b, opts) {
         this.push(ts.transpileModule(text, {
           compilerOptions: {
             esModuleInterop: true,
-            jsx: 'react',
+            jsx: ext === '.tsx' || ext === '.jsx' || ext === '.js' ? 'react' : undefined,
             downlevelIteration: true,
           },
         }).outputText)

test/fixtures/typescript/math_spec.ts

@@ -5,6 +5,13 @@ const { add } = math
 
 const x: number = 3
 
+// ensures that generics can be properly compiled and not treated
+// as react components in `.ts` files.
+// https://github.com/cypress-io/cypress-browserify-preprocessor/issues/44
+const isKeyOf = <T>(obj: T, key: any): key is keyof T => {
+  return typeof key === 'string' && key in obj;
+}
+
 context('math.ts', function () {
   it('imports function', () => {
     expect(add, 'add').to.be.a('function')
@@ -20,4 +27,11 @@ context('math.ts', function () {
 
     expect(arr[0] + arr[1]).to.eq(1)
   })
+  it('Test generic', () => {
+    const x = {
+      key: 'value'
+    }
+
+    expect(isKeyOf(x, 'key')).to.eq(true)
+  })
 })