github: add CI for pull requests

and hacks to get tests working

.eslintrc.js

@@ -27,4 +27,7 @@ module.exports = {
     settings: {
         react: { version: 'detect' },
     },
+    ignorePatterns: [
+        "test-env.js"
+    ],
 };

.github/workflows/test-pull-request.yml

@@ -0,0 +1,35 @@
+# This workflow will do a clean install of node dependencies, build the source code and run tests across different versions of node
+# For more information see: https://help.github.com/actions/language-and-framework-guides/using-nodejs-with-github-actions
+
+name: CI Tests
+
+on:
+  pull_request:
+    branches: [ master ]
+
+jobs:
+  build:
+
+    runs-on: ubuntu-latest
+
+    steps:
+    - uses: actions/checkout@v2
+    - name: Get yarn cache directory path
+      id: yarn-cache-dir-path
+      run: echo "::set-output name=dir::$(yarn cache dir)"
+    - uses: actions/cache@v1
+      id: yarn-cache
+      with:
+        path: ${{ steps.yarn-cache-dir-path.outputs.dir }}
+        key: ${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }}
+        restore-keys: |
+          ${{ runner.os }}-yarn-
+    - name: Run yarn install
+      run: |
+        echo "//npm.pkg.github.com/:_authToken=$TOKEN" >> .npmrc
+        yarn install
+      env:
+        TOKEN: ${{ secrets.privateToken }}
+    - run: yarn test
+    - run: yarn build
+      if: ${{ success() }}

package.json

@@ -42,7 +42,7 @@
         "prepare": "mkdir -p public/static/js && cp node_modules/@pybricks/mpy-cross-4/build-wasm/mpy-cross.wasm public/static/js/",
         "start": "react-scripts start",
         "build": "react-scripts build",
-        "test": "react-scripts test",
+        "test": "react-scripts test --env=./test-env.js",
         "eject": "react-scripts eject",
         "lint": "tsc --noEmit && eslint '*/**/*.{js,ts,tsx}' --quiet --fix"
     },

src/components/App.test.tsx

@@ -1,9 +0,0 @@
-import { render } from '@testing-library/react';
-import React from 'react';
-import App from './App';
-
-test('renders learn react link', () => {
-    const { getByText } = render(<App />);
-    const linkElement = getByText(/learn react/i);
-    expect(linkElement).toBeInTheDocument();
-});

src/utils/math.test.ts

@@ -0,0 +1,9 @@
+import { fmod } from './math';
+
+test('fmod of positive numbers', () => {
+    expect(fmod(3, 4)).toBe(3 % 4);
+});
+
+test('fmod of negative and positive number', () => {
+    expect(fmod(-3, 4)).toBe(1);
+});

test-env.js

@@ -0,0 +1,15 @@
+const Environment = require('jest-environment-jsdom');
+
+/**
+ * A custom environment to set the TextEncoder
+ * Thanks https://stackoverflow.com/a/57713960/1976323
+ */
+module.exports = class CustomTestEnvironment extends Environment {
+    async setup() {
+        await super.setup();
+        if (typeof TextEncoder === 'undefined') {
+            const { TextEncoder } = require('util');
+            this.global.TextEncoder = TextEncoder;
+        }
+    }
+};