WIP: Use child window tests

.circleci/config.yml

@@ -23,15 +23,18 @@ jobs:
       # check the licenses for production dependencies
       - run: npm run license-validation
       - run: cd demo && npm run license-validation
+      # install peer dependencies
+      - run: sudo npm i react react-dom typescript
       # compile and lint
       - run: npm install
       - save_cache:
           paths:
             - node_modules
           key: v1-dependencies-{{ checksum "package.json" }}
-      - run: sudo npm install -g typescript
       - run: npm run compile
       - run: npm run lint
+      # run tests
+      - run: npm test
       - restore_cache:
           keys:
             - v1-dependencies-{{ checksum "./demo/package.json" }}

demo/package.json

@@ -8,8 +8,6 @@
     "openfin-layouts": "^1.0.3",
     "openfin-react-hooks": "file:../",
     "prismjs": "^1.16.0",
-    "react": "^16.8.6",
-    "react-dom": "^16.8.6",
     "react-html-parser": "^2.0.2",
     "react-router-dom": "^5.0.0",
     "react-switch": "^5.0.0",
@@ -54,7 +52,10 @@
     "@types/uuid": "^3.4.4",
     "cross-env": "^5.2.0",
     "openfin-cli": "^2.0.8",
-    "react-scripts": "^3.3.0",
+    "react-scripts": "3.4.0",
     "typescript": "3.4.5"
+  },
+  "peerDependencies": {
+    "react": "^16.9.0"
   }
 }

package.json

@@ -6,7 +6,7 @@
   "scripts": {
     "compile": "tsc",
     "lint": "tslint src/{**,.}/*.ts{,x} demo/{**,.}/ts{,x}",
-    "test": "echo \"Error: no test specified\" && exit 1",
+    "test": "react-scripts test",
     "license-validation": "npm prune --production && npm install --production && npx node-license-validator . --allow-licenses MIT Apache-2.0"
   },
   "repository": {
@@ -30,20 +30,30 @@
   },
   "homepage": "https://github.com/finos/openfin-react-hooks#readme",
   "devDependencies": {
+    "@babel/cli": "7.8.4",
+    "@babel/core": "7.8.7",
+    "@babel/plugin-transform-typescript": "7.8.7",
+    "@babel/preset-env": "7.8.7",
+    "@babel/register": "7.9.0",
+    "@testing-library/react-hooks": "3.2.1",
+    "@types/jest": "25.1.4",
     "@types/openfin": "^41.0.0",
     "@types/react": "^16.8.17",
     "@types/react-dom": "^16.9.1",
+    "babel-core": "7.0.0-bridge.0",
     "dtslint": "^2.0.5",
     "husky": "^2.3.0",
     "node-license-validator": "^1.3.0",
+    "react-scripts": "3.4.0",
+    "react-test-renderer": "16.13.0",
     "tslint": "^5.16.0",
     "typescript": "^3.4.5"
   },
   "peerDependencies": {
-    "react": "^16.8.0"
+    "react": "^16.9.0",
+    "react-dom": "^16.10.1"
   },
   "dependencies": {
-    "openfin-layouts": "^1.0.3",
-    "react-dom": "^16.10.1"
+    "openfin-layouts": "^1.0.3"
   }
 }

src/__tests__/useChildWindow.test.ts

@@ -0,0 +1,114 @@
+import { _Window } from "openfin/_v2/api/window/window";
+import { IUseChildWindowOptions } from "../../index";
+import { renderHook, act } from '@testing-library/react-hooks'
+import useChildWindow from "../../src/useChildWindow";
+
+const defaultOptions: IUseChildWindowOptions = {
+  name: 'name',
+  windowOptions: {},
+  parentDocument: {},
+  cssUrl: undefined,
+  jsx: undefined,
+  shouldClosePreviousOnLaunch: true,
+  shouldInheritCss: true,
+  shoulInheritScripts: true
+};
+
+
+const createMockWindow = (windowName: string, closeFunction: (name: string) => () => Promise<void>) => {
+  const mockWindow = <jest.Mock<typeof _Window>><unknown>{
+    getWebWindow: () => ({
+      document: null
+    }),
+    addListener: jest.fn(),
+    removeListener: jest.fn(),
+    close: closeFunction(windowName),
+    identity: {
+      name: windowName
+    }
+  };
+  return mockWindow;
+}
+
+const mockCloseFunction = jest.fn();
+
+describe('useChildWindow v2', () => {
+  describe('shouldClosePreviousOnLaunch', () => {
+    beforeEach(() => {
+      // Mocking this function rather that the inner `() => Promise.resolve()` allows tests to spy on the name of the child window that 'close' is called on
+      mockCloseFunction.mockImplementation((name) => {
+        return () => Promise.resolve()
+      });
+      // Mock out fin object:
+      window.fin = {
+        mockChildWindows: [], // To store the child windows created by the mock 'create' that are then referenced by the mock 'close'
+        Window: {
+          getCurrentSync: () => ({
+            getWebWindow: () => Promise.resolve({})
+          }),
+          create: (createOptions) => {
+            return new Promise((resolve) => {
+              const mockWindow = createMockWindow(createOptions.name, mockCloseFunction);
+              window.fin.mockChildWindows.push(mockWindow);
+              resolve(mockWindow);
+            })
+          }
+        },
+        Application: {
+          getCurrent: () => Promise.resolve({
+            getChildWindows: () => window.fin.mockChildWindows
+          })
+        }
+      };
+    });
+
+    it('does not close existing window when false', async () => {
+      const options = { ...defaultOptions, name: 'child', shouldClosePreviousOnLaunch: false };
+      const { result } = renderHook(() => useChildWindow(options));
+      const mockCloseChildWindow = jest.fn();
+      mockCloseFunction.mockImplementation((name) => mockCloseChildWindow);
+      await act(async () => {
+        await result.current.launch();
+        await result.current.launch();
+      });
+      expect(mockCloseChildWindow).not.toHaveBeenCalled();
+    });
+
+    it('closes existing window when true', async () => {
+      const options = { ...defaultOptions, name: 'child', shouldClosePreviousOnLaunch: true };
+      const { result } = renderHook(() => useChildWindow(options));
+      const mockCloseChildWindow = jest.fn();
+      mockCloseFunction.mockImplementation((name) => mockCloseChildWindow);
+      await act(async () => {
+        await result.current.launch(options);
+        await result.current.launch(options);
+      });
+      expect(mockCloseChildWindow).toHaveBeenCalledTimes(1);
+    });
+
+    it('does not close windows with a different name when true', async () => {
+      const mockChild0CloseFunc = jest.fn(() => Promise.resolve());
+      const mockChild1CloseFunc = jest.fn(() => Promise.resolve());
+      mockCloseFunction.mockImplementation((name) => {
+        if (name === 'child0') {
+          return mockChild0CloseFunc
+        } else if (name === 'child1') {
+          return mockChild1CloseFunc
+        } else {
+          throw "Child Window name not found"
+        }
+      });
+      const child0Options = { ...defaultOptions, name: 'child0', shouldClosePreviousOnLaunch: true };
+      const child1Options = { ...defaultOptions, name: 'child1', shouldClosePreviousOnLaunch: true };
+      const childHook0 = renderHook(() => useChildWindow(child0Options)).result;
+      const childHook1 = renderHook(() => useChildWindow(child1Options)).result;
+
+      await act(async () => {
+        await childHook0.current.launch(child0Options);
+        await childHook1.current.launch(child1Options);
+      });
+      expect(mockChild0CloseFunc).not.toHaveBeenCalled();
+      expect(mockChild1CloseFunc).not.toHaveBeenCalled();  
+    });
+  });
+});

src/__tests__/useDocked.test.ts

@@ -0,0 +1,40 @@
+import { renderHook, act } from '@testing-library/react-hooks'
+import useDocked from "../../src/useDocked";
+import {Fin} from "openfin/_v2/main";
+import {snapAndDock} from "openfin-layouts";
+
+jest.mock('openfin-layouts');
+
+interface Window {
+    fin: Fin;
+}
+
+describe('useDocked', () => {
+  beforeEach(() => {
+    window.fin = {}; // Mock out fin object
+  });
+
+  it('default is not docked', () => {
+    const { result } = renderHook(() => useDocked());
+    const isDocked = result.current[0];
+    expect(isDocked).toBe(false);
+  });
+
+  it('undock function causes undock of window', () => {
+    const { result } = renderHook(() => useDocked());
+    act(() => {
+      result.current[0] = true; // Simulating dock by user
+    });
+
+    snapAndDock.undockWindow.mockImplementation(() => {
+      act(() => {
+        result.current[0] = false;
+      });
+    })
+
+    const undock = result.current[1];
+    undock();
+    const isDocked = result.current[0];
+    expect(isDocked).toBe(false);
+  });
+});

src/useChildWindow.ts

@@ -7,6 +7,7 @@ import createWindow from "./utils/helpers/createWindow";
 import { injectNode, injectNodes } from "./utils/helpers/inject";
 import { isWindowV1, isWindowV2 } from "./utils/helpers/isWindow";
 import reducer, { INITIAL_WINDOW_STATE } from "./utils/reducers/WindowReducer";
+import OpenFinJavaScriptAPIVersion from "./utils/types/enums/OpenFinJavaScriptAPIVersion";
 import WINDOW_ACTION from "./utils/types/enums/WindowAction";
 import WINDOW_STATE from "./utils/types/enums/WindowState";
 

src/utils/helpers/createWindow.ts

@@ -1,5 +1,6 @@
 import { _Window } from "openfin/_v2/api/window/window";
 import { WindowOption } from "openfin/_v2/api/window/windowOption";
+import OpenFinJavaScriptAPIVersion from "../types/enums/OpenFinJavaScriptAPIVersion";
 
 const createWindowV1 = (options: WindowOption): Promise<fin.OpenFinWindow> =>
     new Promise((resolve, reject) => {

src/utils/types/enums/OpenFinJavaScriptAPIVersion.ts

@@ -1,4 +1,6 @@
-const enum OpenFinJavaScriptAPIVersion {
+enum OpenFinJavaScriptAPIVersion {
     ONE,
     TWO,
 }
+
+export default OpenFinJavaScriptAPIVersion;

tsconfig.json

@@ -29,6 +29,7 @@
     "src/**/*"
   ],
   "exclude": [
-    "node_modules"
+    "node_modules",
+    "**/*.test.ts"
   ]
 }

tslint.json

@@ -9,7 +9,8 @@
     "linterOptions": {
         "exclude": [
             "node_modules/**/*",
-            "demo/node_modules/**/*"
+            "demo/node_modules/**/*",
+            "src/__tests__/**/*"
         ]
     }
 }