Restore JS tests

.eslintignore

@@ -2,4 +2,4 @@ node_modules
 dist
 coverage
 **/*.d.ts
-tests
+lib

.eslintrc.js

@@ -8,7 +8,7 @@ module.exports = {
   ],
   parser: '@typescript-eslint/parser',
   parserOptions: {
-    project: 'tsconfig.json',
+    project: 'tsconfig.eslint.json',
     sourceType: 'module'
   },
   plugins: ['@typescript-eslint'],

.github/workflows/build.yml

@@ -167,8 +167,8 @@ jobs:
         set -eux
         python -m pytest --pyargs jupyterlab_pullrequests --cov jupyterlab_pullrequests --cov-report term-missing:skip-covered --no-cov-on-fail
 
-    - name: Unit Test JS (known to be broken)
-      run: jlpm test || echo "TODO"
+    - name: Unit Test JS
+      run: jlpm test
 
     - name: Upload Coverage
       run: codecov

.gitignore

@@ -116,3 +116,4 @@ dmypy.json
 .pytest_cache/
 
 .DS_Store
+coverage/

jest.config.js

@@ -14,17 +14,20 @@ const {
 } = jlabConfig;
 
 module.exports = {
-  coverageDirectory,
   moduleFileExtensions,
-  moduleNameMapper: {...moduleNameMapper, "monaco-editor": "<rootDir>/node_modules/react-monaco-editor"},
+  moduleNameMapper,
   preset,
   setupFilesAfterEnv,
   setupFiles,
   testPathIgnorePatterns,
   transform,
   automock: false,
+  collectCoverageFrom: ['src/**/*.{ts,tsx}', '!src/*.d.ts'],
+  coverageDirectory: 'coverage',
+  coverageReporters: ['lcov', 'text'],
+  reporters: ['default'],
   testRegex: 'src/tests/.*.spec.ts[x]?$',
-  transformIgnorePatterns: ['/node_modules/(?!(@?jupyterlab.*)/)'],
+  transformIgnorePatterns: ['/node_modules/(?!(@?jupyterlab.*|react-spinners)/)'],
   setupFiles: ['<rootDir>/setupJest.js'],
   globals: {
     'ts-jest': {

package.json

@@ -39,7 +39,7 @@
     "clean:labextension": "rimraf jupyterlab_pullrequests/labextension",
     "eslint": "eslint . --ext .ts,.tsx --fix",
     "eslint:check": "eslint . --ext .ts,.tsx",
-    "test": "jest",
+    "test": "jest --coverage",
     "watch": "tsc -w"
   },
   "dependencies": {

src/components/browser/PullRequestItem.tsx

@@ -6,7 +6,7 @@ import {
   linkIcon
 } from '@jupyterlab/ui-components';
 import { CommandRegistry } from '@lumino/commands';
-import React, { useEffect, useState } from 'react';
+import React from 'react';
 import { BeatLoader } from 'react-spinners';
 import { CommandIDs, IFile, IPullRequest } from '../../tokens';
 import { requestAPI } from '../../utils';
@@ -49,21 +49,21 @@ export function PullRequestItem(props: IPullRequestItemProps): JSX.Element {
   /**
    * Pull request modified files
    */
-  const [files, setFiles] = useState<IFile[] | null>(null);
+  const [files, setFiles] = React.useState<IFile[] | null>(null);
   /**
    * Is the file list expanded?
    */
-  const [isExpanded, setIsExpanded] = useState<boolean>(false);
+  const [isExpanded, setIsExpanded] = React.useState<boolean>(false);
   /**
    * Is the file list being loaded?
    */
-  const [isLoading, setIsLoading] = useState<boolean>(false);
+  const [isLoading, setIsLoading] = React.useState<boolean>(false);
   /**
    * Error message
    */
-  const [error, setError] = useState<string | null>(null);
+  const [error, setError] = React.useState<string | null>(null);
 
-  useEffect(() => {
+  React.useEffect(() => {
     setFiles(null);
     setIsExpanded(false);
     setIsLoading(false);

src/components/discussion/Discussion.ts

@@ -94,9 +94,11 @@ export class Discussion extends Panel {
       latestWidget.parent = null;
       latestWidget.dispose();
 
-      this.addWidget(
-        this._inputShown ? this.createCommentInput() : this.createReplyButton()
-      );
+      if (this._inputShown) {
+        this.addWidget(this.createCommentInput());
+      } else if (this._thread.singleton !== true) {
+        this.addWidget(this.createReplyButton());
+      }
     }
   }
 
@@ -141,7 +143,9 @@ export class Discussion extends Panel {
     if (this._inputShown) {
       this.addWidget(this.createCommentInput());
     } else {
-      this.addWidget(this.createReplyButton());
+      if (this._thread.singleton !== true) {
+        this.addWidget(this.createReplyButton());
+      }
     }
   }
 

src/tests/Browser.spec.tsx

@@ -0,0 +1,32 @@
+import { shallow } from 'enzyme';
+import 'jest';
+import * as React from 'react';
+import * as samplePRs from './sample-responses/samplepr.json';
+import { IBrowserProps, Browser } from '../components/browser/Browser';
+
+// Unit tests for PullRequestTab
+describe('Browser', () => {
+  const DEFAULT_PROPS: IBrowserProps = {
+    commands: {} as any,
+    docRegistry: {} as any,
+    prGroups: [
+      { name: 'group1', pullRequests: (samplePRs as any).default },
+      { name: 'group2', pullRequests: (samplePRs as any).default }
+    ]
+  };
+
+  // Test render
+  describe('#render()', () => {
+    const component = shallow(<Browser {...DEFAULT_PROPS} />);
+    it('should be a div', () => {
+      expect(component.find('div')).toHaveLength(1);
+      expect(component.find('.jp-PullRequestBrowser')).toHaveLength(1);
+    });
+    it('should have a list', () => {
+      expect(component.find('ul')).toHaveLength(1);
+    });
+    it('should have two BrowserGroup', () => {
+      expect(component.find('BrowserGroup')).toHaveLength(2);
+    });
+  });
+});

src/tests/BrowserGroup.spec.tsx

@@ -0,0 +1,84 @@
+import { shallow } from 'enzyme';
+import 'jest';
+import * as React from 'react';
+import {
+  BrowserGroup,
+  IBrowserGroupProps
+} from '../components/browser/BrowserGroup';
+import { PullRequestItem } from '../components/browser/PullRequestItem';
+import * as samplePRs from './sample-responses/samplepr.json';
+
+// Unit tests for BrowserGroup
+describe('BrowserGroup', () => {
+  const DEFAULT_PROPS: IBrowserGroupProps = {
+    commands: {} as any,
+    docRegistry: {} as any,
+    group: { name: 'group1', pullRequests: (samplePRs as any).default }
+  };
+
+  // Test render
+  describe('#render()', () => {
+    it('should be a list item', () => {
+      const component = shallow(<BrowserGroup {...DEFAULT_PROPS} />);
+      expect(component.find('li')).toHaveLength(1);
+      expect(component.find('.jp-PullRequestBrowserGroup')).toHaveLength(1);
+    });
+
+    it('should have a header with text props.header', () => {
+      const component = shallow(<BrowserGroup {...DEFAULT_PROPS} />);
+      expect(component.find('header h2')).toHaveLength(1);
+      expect(
+        component.contains([<h2 key={1}>{DEFAULT_PROPS.group.name}</h2>])
+      ).toEqual(true);
+    });
+
+    it('should load group', () => {
+      const component = shallow(<BrowserGroup {...DEFAULT_PROPS} />);
+
+      expect(component.find('.jp-PullRequestBrowserGroupError')).toHaveLength(
+        0
+      );
+      expect(component.find('ul')).toHaveLength(1);
+      expect(component.find('.jp-PullRequestBrowserGroupList')).toHaveLength(1);
+    });
+
+    it('should load list item prs', () => {
+      const component = shallow(<BrowserGroup {...DEFAULT_PROPS} />);
+      expect(component.find(PullRequestItem)).toHaveLength(1);
+    });
+
+    it('should not have a group if there is an error', () => {
+      const component = shallow(
+        <BrowserGroup
+          {...DEFAULT_PROPS}
+          group={{
+            name: 'error',
+            pullRequests: [],
+            error: 'There is an error'
+          }}
+        />
+      );
+      expect(component.find('ul')).toHaveLength(0);
+      expect(component.find('.jp-PullRequestBrowserGroupList')).toHaveLength(0);
+    });
+
+    it('should display error if one exists', () => {
+      const error = 'There is an error';
+      const component = shallow(
+        <BrowserGroup
+          {...DEFAULT_PROPS}
+          group={{
+            name: 'error',
+            pullRequests: [],
+            error
+          }}
+        />
+      );
+
+      expect(component.find('.jp-PullRequestBrowserGroupError')).toHaveLength(
+        1
+      );
+      expect(component.contains(error)).toEqual(true);
+    });
+  });
+});