test: adds setup for mock-service-worker

package.json

@@ -167,6 +167,7 @@
     "memoize-one": "^5.0.0",
     "moment": "^2.18.1",
     "moment-timezone": "^0.5.28",
+    "msw": "^0.24.1",
     "object-hash": "^1.3.1",
     "prettier": "1.19.1",
     "protobufjs": "~6.8.0",

src/common/env.ts

@@ -1,14 +1,8 @@
 import { Env } from 'config';
+import { cloneDeep } from 'lodash';
 
-/** Safely check for server environment */
-export function isServer() {
-    try {
-        return __isServer;
-    } catch (e) {
-        return false;
-    }
-}
+const global = process != null ? process : window;
 
 /** equivalent to process.env in server and client */
 // tslint:disable-next-line:no-any
-export const env: Env = (isServer() ? process.env : window.env) as any;
+export const env: Env = cloneDeep(global.env) as any;

src/common/test/utils.spec.ts

@@ -13,7 +13,9 @@ import {
     timestampToDate
 } from '../utils';
 
-jest.mock('common/env');
+jest.mock('common/env', () => ({
+    env: jest.requireActual('common/env').env
+}));
 
 import { Protobuf } from 'flyteidl';
 

src/components/Executions/ExecutionDetails/test/ExecutionNodeViews.test.tsx

@@ -29,6 +29,8 @@ describe.skip('ExecutionNodeViews', () => {
         props = { execution: workflowExecution };
     });
 
+    it('is disabled', () => {});
+
     const renderViews = () =>
         render(
             <QueryClientProvider client={queryClient}>

src/components/Executions/Tables/test/NodeExecutionsTable.test.tsx

@@ -97,6 +97,8 @@ describe.skip('NodeExecutionsTable', () => {
         return render(<Table {...await getProps()} />);
     };
 
+    it('is disabled', () => {});
+
     // it('renders task name for task nodes', async () => {
     //     const { queryAllByText, getAllByRole } = await renderTable();
     //     await waitFor(() => getAllByRole('listitem').length > 0);

src/mocks/data/constants.ts

@@ -0,0 +1,6 @@
+// Arbitrary start date used as a basis for generating timestamps
+// to keep the mocked data consistent across runs
+export const mockStartDate = new Date('2020-11-15T02:32:19.610Z');
+
+// Workflow Execution duration in milliseconds
+export const defaultWorkflowExecutionDuration = 1000 * 60 * 60 * 1.251;

src/mocks/data/launchPlans.ts

@@ -0,0 +1,15 @@
+import { Core } from 'flyteidl';
+import { LaunchPlan } from 'models';
+
+// TODO:
+const basic: LaunchPlan = {
+    id: {
+        resourceType: Core.ResourceType.LAUNCH_PLAN,
+        project: 'flytetest',
+        domain: 'development',
+        name: 'Basic',
+        version: 'abc123'
+    }
+} as LaunchPlan;
+
+export const launchPlans = { basic };

src/mocks/data/projects.ts

@@ -0,0 +1,8 @@
+export function emptyProject(id: string, name?: string) {
+    return {
+        id,
+        name: name ?? id,
+        domains: [],
+        description: ''
+    };
+}

src/mocks/data/workflowExecutions.ts

@@ -0,0 +1,48 @@
+import { dateToTimestamp, millisecondsToDuration } from 'common/utils';
+import { Admin } from 'flyteidl';
+import { LiteralMap } from 'models/Common/types';
+import { WorkflowExecutionPhase } from 'models/Execution/enums';
+import { Execution, ExecutionMetadata } from 'models/Execution/types';
+import { defaultWorkflowExecutionDuration, mockStartDate } from './constants';
+import { launchPlans } from './launchPlans';
+import { workflows } from './workflows';
+
+export function defaultWorkflowExecutionMetadata(): ExecutionMetadata {
+    return {
+        mode: Admin.ExecutionMetadata.ExecutionMode.MANUAL,
+        principal: 'sdk',
+        nesting: 0
+    };
+}
+
+export function emptyLiteralMap(): LiteralMap {
+    return { literals: {} };
+}
+
+const basic: Execution = {
+    id: {
+        project: 'flytetest',
+        domain: 'development',
+        name: 'abc123'
+    },
+    spec: {
+        launchPlan: { ...launchPlans.basic.id },
+        inputs: emptyLiteralMap(),
+        metadata: defaultWorkflowExecutionMetadata(),
+        notifications: {
+            notifications: []
+        }
+    },
+    closure: {
+        computedInputs: emptyLiteralMap(),
+        createdAt: dateToTimestamp(mockStartDate),
+        duration: millisecondsToDuration(defaultWorkflowExecutionDuration),
+        phase: WorkflowExecutionPhase.SUCCEEDED,
+        startedAt: dateToTimestamp(mockStartDate),
+        workflowId: { ...workflows.basic.id }
+    }
+};
+
+export const workflowExecutions = {
+    basic
+};

src/mocks/data/workflows.ts

@@ -0,0 +1,15 @@
+import { Core } from 'flyteidl';
+import { Workflow } from 'models/Workflow/types';
+
+// TODO:
+const basic: Workflow = {
+    id: {
+        resourceType: Core.ResourceType.WORKFLOW,
+        project: 'flytetest',
+        domain: 'development',
+        name: 'Basic',
+        version: 'abc123'
+    }
+};
+
+export const workflows = { basic };

src/mocks/getDefaultData.ts

@@ -0,0 +1,10 @@
+import { RequestHandlersList } from 'msw/lib/types/setupWorker/glossary';
+import { workflowExecutions } from './data/workflowExecutions';
+import { workflowExecutionHandler } from './handlers';
+
+export function getDefaultData(): RequestHandlersList {
+    const workflowExecutionHandlers = Object.values(workflowExecutions).map(
+        workflowExecutionHandler
+    );
+    return [...workflowExecutionHandlers];
+}

src/mocks/handlers.ts

@@ -0,0 +1,102 @@
+import { Admin } from 'flyteidl';
+import {
+    EncodableType,
+    encodeProtoPayload,
+    Execution,
+    NameIdentifierScope,
+    NodeExecution,
+    Project,
+    Workflow
+} from 'models';
+import {
+    makeExecutionPath,
+    makeNodeExecutionListPath,
+    makeNodeExecutionPath
+} from 'models/Execution/utils';
+import { makeWorkflowPath } from 'models/Workflow/utils';
+import { ResponseResolver, rest } from 'msw';
+import { setupServer } from 'msw/lib/types/node';
+import { RestContext } from 'msw/lib/types/rest';
+import { apiPath } from './utils';
+
+export function adminEntityResponder(
+    data: any,
+    encodeType: EncodableType<any>
+): ResponseResolver<any, RestContext> {
+    const buffer = encodeProtoPayload(data, encodeType);
+    const contentLength = buffer.byteLength.toString();
+    return (_, res, ctx) =>
+        res(
+            ctx.set('Content-Type', 'application/octet-stream'),
+            ctx.set('Content-Length', contentLength),
+            ctx.body(buffer)
+        );
+}
+
+export function workflowExecutionHandler(data: Partial<Execution>) {
+    return rest.get(
+        apiPath(makeExecutionPath(data.id!)),
+        adminEntityResponder(data, Admin.Execution)
+    );
+}
+
+export function workflowHandler(data: Partial<Workflow>) {
+    return rest.get(
+        apiPath(makeWorkflowPath(data.id!)),
+        adminEntityResponder(data, Admin.Workflow)
+    );
+}
+
+export function nodeExecutionHandler(data: Partial<NodeExecution>) {
+    return rest.get(
+        apiPath(makeNodeExecutionPath(data.id!)),
+        adminEntityResponder(data, Admin.NodeExecution)
+    );
+}
+
+// TODO: pagination responder that respects limit/token?
+export function nodeExecutionListHandler(
+    scope: NameIdentifierScope,
+    data: Partial<NodeExecution>[]
+) {
+    return rest.get(
+        apiPath(makeNodeExecutionListPath(scope)),
+        adminEntityResponder(
+            {
+                nodeExecutions: data
+            },
+            Admin.NodeExecutionList
+        )
+    );
+}
+
+export function projectListHandler(data: Project[]) {
+    return rest.get(
+        apiPath('/projects'),
+        adminEntityResponder({ projects: data }, Admin.Projects)
+    );
+}
+
+export interface BoundAdminServer {
+    insertNodeExecution(data: Partial<NodeExecution>): void;
+    insertNodeExecutionList(
+        scope: NameIdentifierScope,
+        data: Partial<NodeExecution>[]
+    ): void;
+    insertProjects(data: Project[]): void;
+    insertWorkflow(data: Partial<Workflow>): void;
+    insertWorkflowExecution(data: Partial<Execution>): void;
+}
+
+export function bindHandlers({
+    use
+}: ReturnType<typeof setupServer>): BoundAdminServer {
+    return {
+        insertNodeExecution: data => use(nodeExecutionHandler(data)),
+        insertNodeExecutionList: (scope, data) =>
+            use(nodeExecutionListHandler(scope, data)),
+        insertProjects: data => use(projectListHandler(data)),
+        insertWorkflow: data => use(workflowHandler(data)),
+        insertWorkflowExecution: data => use(workflowExecutionHandler(data))
+    };
+}

src/mocks/server.ts

@@ -0,0 +1,7 @@
+import { setupServer } from 'msw/node';
+import { getDefaultData } from './getDefaultData';
+import { bindHandlers } from './handlers';
+
+const server = setupServer(...getDefaultData());
+const handlers = bindHandlers(server);
+export const mockServer = { ...server, ...handlers };

src/mocks/utils.ts

@@ -0,0 +1,5 @@
+import { apiPrefix } from 'models/AdminEntity/constants';
+
+export function apiPath(path: string) {
+    return `${apiPrefix}${path}`;
+}

src/models/AdminEntity/constants.ts

@@ -1,5 +1,7 @@
 import { RequestConfig } from './types';
 
+export const apiPrefix = '/api/v1';
+
 export const limits = {
     DEFAULT: 25,
     /** The admin API requires a limit value for all list endpoints, but does not

src/models/AdminEntity/index.ts

@@ -1,5 +1,4 @@
 export * from './AdminApiQuery';
-export * from './AdminEntity';
 export * from './constants';
 export * from './types';
 export * from './utils';