testing client functions/code

[huss]

Is your feature request related to a problem? Please describe.

We currently do lots of tests of server code that is in JavaScript. We want to test client code such as the new functions in src/client/app/utils/determineCompatibleUnits.ts that are in TypeScript. You cannot trivially do this because of the different language. We need to come up with a scheme to test the client code. Note this does not include UI testing that would be seeing if the correct action happens when a menu or button is clicked.

Describe the solution you'd like

We need to see how we might do this in the current way or if a new way is desired. The solution would allow for easy, automated tests of client code.

Describe alternatives you've considered

We don't test :-(

Additional context

I have not looked at this much. It appears Chai/Mocha do not have a TypeScript version. We may be able to use ts-node that transforms the TS to JS within node. I have not looked at other packages because using Chai/Mocha would be preferred.

[MikeLimpus]

Using mocha and ts-node, or using the ts-mocha package, tests in typescript fail to compile with the following error:

TSError: ⨯ Unable to compile TypeScript:
src/client/app/tests/determineCompatibleUnits.test.ts:21:10 - error TS2695: Left side of comma operator is unused and has no side effects.

21         (0, chai_1.expect)((0, determineCompatibleUnits_1.setIntersect)(set1, set2)).to.equal(intersect);
            ~

This seems to be an issue with the way OED's JavaScript modules are configured.

Using

• the ts-jest testing library
• any other typescript code for testing, whether compiled through tsc and run as JavaScript or run through ts-node
• tests written in JavaScript, which import the compiled TypeScript as Javascript

the following node error is produced:

/workspace/node_modules/bootstrap/dist/css/bootstrap.css:7
    :root {
    ^

    SyntaxError: Unexpected token ':'

       8 | import { createStore, applyMiddleware } from 'redux';
       9 | import { Provider } from 'react-redux';
    > 10 | import 'bootstrap/dist/css/bootstrap.css';
         | ^
      11 | import RouteContainer from './containers/RouteContainer';
      12 | import reducers from './reducers';
      13 | import './styles/index.css';

      at Runtime.createScriptFromCode (node_modules/jest-runtime/build/index.js:1449:14)
      at Object.<anonymous> (src/client/app/index.tsx:10:1)
      at Object.<anonymous> (src/client/app/utils/determineCompatibleUnits.ts:5:1)
      at Object.<anonymous> (tests/determineCompatibleUnits.test.ts:7:1)*

This type of error typically occurs when running a .ts file as if it were as .js file in node, but this isn't the case. Running the same code outside of the OED environment does not reproduce this error.

Further investigation is required in this issue, possibly related to settings in tsconfig.json.