services/workbench2/src/views/process-panel/process-io-card.test.tsx

   1 // Copyright (C) The Arvados Authors. All rights reserved.
   2 //
   3 // SPDX-License-Identifier: AGPL-3.0
   4
   5 import React from 'react';
   6 import { mount, configure } from 'enzyme';
   7 import { combineReducers, createStore } from "redux";
   8 import { CircularProgress, MuiThemeProvider, Tab, TableBody } from "@material-ui/core";
   9 import { CustomTheme } from 'common/custom-theme';
  10 import Adapter from "enzyme-adapter-react-16";
  11 import { Provider } from 'react-redux';
  12 import { ProcessIOCard, ProcessIOCardType } from './process-io-card';
  13 import { DefaultView } from "components/default-view/default-view";
  14 import { DefaultVirtualCodeSnippet } from "components/default-code-snippet/default-virtual-code-snippet";
  15 import { ProcessOutputCollectionFiles } from './process-output-collection-files';
  16 import { MemoryRouter } from 'react-router-dom';
  17 import { CopyIcon } from 'components/icon/icon';
  18 import copy from 'copy-to-clipboard';
  19
  20 // Mock collection files component since it just needs to exist
  21 jest.mock('views/process-panel/process-output-collection-files');
  22 // Mock autosizer for the io panel virtual list
  23 jest.mock('react-virtualized-auto-sizer', () => ({ children }: any) => children({ height: 600, width: 600 }));
  24 // Mock copy to clipboard
  25 jest.mock('copy-to-clipboard');
  26
  27 configure({ adapter: new Adapter() });
  28
  29 describe('renderers', () => {
  30     let store;
  31
  32     describe('ProcessStatus', () => {
  33
  34         beforeEach(() => {
  35             store = createStore(combineReducers({
  36                 auth: (state: any = {}, action: any) => state,
  37             }));
  38         });
  39
  40         it('shows main process input loading when raw or params null', () => {
  41             // when
  42             let panel = mount(
  43                 <Provider store={store}>
  44                     <MuiThemeProvider theme={CustomTheme}>
  45                         <ProcessIOCard
  46                             label={ProcessIOCardType.INPUT}
  47                             process={false} // Treat as a main process, no requestingContainerUuid
  48                             params={null}
  49                             raw={{}}
  50                         />
  51                     </MuiThemeProvider>
  52                 </Provider>
  53                 );
  54
  55             // then
  56             expect(panel.find(Tab).exists()).toBeFalsy();
  57             expect(panel.find(CircularProgress));
  58
  59             // when
  60             panel = mount(
  61                 <Provider store={store}>
  62                     <MuiThemeProvider theme={CustomTheme}>
  63                         <ProcessIOCard
  64                             label={ProcessIOCardType.INPUT}
  65                             process={false} // Treat as a main process, no requestingContainerUuid
  66                             params={[]}
  67                             raw={null}
  68                         />
  69                     </MuiThemeProvider>
  70                 </Provider>
  71                 );
  72
  73             // then
  74             expect(panel.find(Tab).exists()).toBeFalsy();
  75             expect(panel.find(CircularProgress));
  76         });
  77
  78         it('shows main process empty params and raw', () => {
  79             // when
  80             let panel = mount(
  81                 <Provider store={store}>
  82                     <MuiThemeProvider theme={CustomTheme}>
  83                         <ProcessIOCard
  84                             label={ProcessIOCardType.INPUT}
  85                             process={false} // Treat as a main process, no requestingContainerUuid
  86                             params={[]}
  87                             raw={{}}
  88                         />
  89                     </MuiThemeProvider>
  90                 </Provider>
  91                 );
  92
  93             // then
  94             expect(panel.find(CircularProgress).exists()).toBeFalsy();
  95             expect(panel.find(Tab).exists()).toBeFalsy();
  96             expect(panel.find(DefaultView).text()).toEqual('No parameters found');
  97         });
  98
  99         it('shows main process with raw and allows copying json', () => {
 100             // when
 101             const raw = {some: 'data'};
 102             let panel = mount(
 103                 <Provider store={store}>
 104                     <MuiThemeProvider theme={CustomTheme}>
 105                         <ProcessIOCard
 106                             label={ProcessIOCardType.INPUT}
 107                             process={false} // Treat as a main process, no requestingContainerUuid
 108                             params={[]}
 109                             raw={raw}
 110                         />
 111                     </MuiThemeProvider>
 112                 </Provider>
 113                 );
 114
 115             // then
 116             expect(panel.find(CircularProgress).exists()).toBeFalsy();
 117             expect(panel.find(Tab).length).toBe(1);
 118             expect(panel.find(DefaultVirtualCodeSnippet).text()).toContain(JSON.stringify(raw, null, 2).replace(/\n/g, ''));
 119
 120             // when
 121             panel.find(CopyIcon).simulate('click');
 122             expect(copy).toHaveBeenCalledWith(JSON.stringify(raw, null, 2), undefined);
 123         });
 124
 125         it('shows main process with params', () => {
 126             // when
 127             const parameters = [{id: 'someId', label: 'someLabel', value: {display: 'someValue'}}];
 128             let panel = mount(
 129                 <Provider store={store}>
 130                     <MuiThemeProvider theme={CustomTheme}>
 131                         <ProcessIOCard
 132                             label={ProcessIOCardType.INPUT}
 133                             process={false} // Treat as a main process, no requestingContainerUuid
 134                             params={parameters}
 135                             raw={{}}
 136                         />
 137                     </MuiThemeProvider>
 138                 </Provider>
 139                 );
 140
 141             // then
 142             expect(panel.find(CircularProgress).exists()).toBeFalsy();
 143             expect(panel.find(Tab).length).toBe(2); // Empty raw is shown if parameters are present
 144             expect(panel.find(TableBody).text()).toContain('someId');
 145             expect(panel.find(TableBody).text()).toContain('someLabel');
 146             expect(panel.find(TableBody).text()).toContain('someValue');
 147         });
 148
 149         it('shows main process with output collection', () => {
 150             // when
 151             const outputCollection = '987654321';
 152             const parameters = [{id: 'someId', label: 'someLabel', value: {display: 'someValue'}}];
 153             let panel = mount(
 154                 <Provider store={store}>
 155                     <MuiThemeProvider theme={CustomTheme}>
 156                         <ProcessIOCard
 157                             label={ProcessIOCardType.OUTPUT}
 158                             process={false} // Treat as a main process, no requestingContainerUuid
 159                             outputUuid={outputCollection}
 160                             params={parameters}
 161                             raw={{}}
 162                         />
 163                     </MuiThemeProvider>
 164                 </Provider>
 165                 );
 166
 167             // then
 168             expect(panel.find(CircularProgress).exists()).toBeFalsy();
 169             expect(panel.find(Tab).length).toBe(3); // Empty raw is shown if parameters are present
 170             expect(panel.find(TableBody).text()).toContain('someId');
 171             expect(panel.find(TableBody).text()).toContain('someLabel');
 172             expect(panel.find(TableBody).text()).toContain('someValue');
 173
 174             // Visit output tab
 175             panel.find(Tab).at(2).simulate('click');
 176             expect(panel.find(ProcessOutputCollectionFiles).prop('currentItemUuid')).toBe(outputCollection);
 177         });
 178
 179         // Subprocess
 180
 181         it('shows subprocess loading', () => {
 182             // when
 183             const subprocess = {containerRequest: {requestingContainerUuid: 'xyz'}};
 184             let panel = mount(
 185                 <Provider store={store}>
 186                     <MuiThemeProvider theme={CustomTheme}>
 187                         <ProcessIOCard
 188                             label={ProcessIOCardType.INPUT}
 189                             process={subprocess} // Treat as a subprocess without outputUuid
 190                             params={null}
 191                             raw={null}
 192                         />
 193                     </MuiThemeProvider>
 194                 </Provider>
 195                 );
 196
 197             // then
 198             expect(panel.find(Tab).exists()).toBeFalsy();
 199             expect(panel.find(CircularProgress));
 200         });
 201
 202         it('shows subprocess mounts', () => {
 203             // when
 204             const subprocess = {containerRequest: {requestingContainerUuid: 'xyz'}};
 205             const sampleMount = {path: '/', pdh: 'abcdef12abcdef12abcdef12abcdef12+0'};
 206             let panel = mount(
 207                 <Provider store={store}>
 208                     <MemoryRouter>
 209                         <MuiThemeProvider theme={CustomTheme}>
 210                             <ProcessIOCard
 211                                 label={ProcessIOCardType.INPUT}
 212                                 process={subprocess} // Treat as a subprocess without outputUuid
 213                                 params={null}
 214                                 raw={null}
 215                                 mounts={[sampleMount]}
 216                             />
 217                         </MuiThemeProvider>
 218                     </MemoryRouter>
 219                 </Provider>
 220                 );
 221
 222             // then
 223             expect(panel.find(CircularProgress).exists()).toBeFalsy();
 224             expect(panel.find(Tab).length).toBe(1); // Empty raw is hidden in subprocesses
 225             expect(panel.find(TableBody).text()).toContain(sampleMount.pdh);
 226
 227         });
 228
 229         it('shows subprocess output collection', () => {
 230             // when
 231             const subprocess = {containerRequest: {requestingContainerUuid: 'xyz'}};
 232             const outputCollection = '123456789';
 233             let panel = mount(
 234                 <Provider store={store}>
 235                     <MuiThemeProvider theme={CustomTheme}>
 236                         <ProcessIOCard
 237                             label={ProcessIOCardType.OUTPUT}
 238                             process={subprocess} // Treat as a subprocess with outputUuid
 239                             outputUuid={outputCollection}
 240                             params={null}
 241                             raw={null}
 242                         />
 243                     </MuiThemeProvider>
 244                 </Provider>
 245                 );
 246
 247             // then
 248             expect(panel.find(CircularProgress).exists()).toBeFalsy();
 249             expect(panel.find(Tab).length).toBe(1); // Unloaded raw is hidden in subprocesses
 250             expect(panel.find(ProcessOutputCollectionFiles).prop('currentItemUuid')).toBe(outputCollection);
 251         });
 252
 253         it('shows empty subprocess raw', () => {
 254             // when
 255             const subprocess = {containerRequest: {requestingContainerUuid: 'xyz'}};
 256             const outputCollection = '123456789';
 257             let panel = mount(
 258                 <Provider store={store}>
 259                     <MuiThemeProvider theme={CustomTheme}>
 260                         <ProcessIOCard
 261                             label={ProcessIOCardType.OUTPUT}
 262                             process={subprocess} // Treat as a subprocess with outputUuid
 263                             outputUuid={outputCollection}
 264                             params={null}
 265                             raw={{}}
 266                         />
 267                     </MuiThemeProvider>
 268                 </Provider>
 269                 );
 270
 271             // then
 272             expect(panel.find(CircularProgress).exists()).toBeFalsy();
 273             expect(panel.find(Tab).length).toBe(2); // Empty raw is visible in subprocesses
 274             expect(panel.find(Tab).first().text()).toBe('Collection');
 275             expect(panel.find(ProcessOutputCollectionFiles).prop('currentItemUuid')).toBe(outputCollection);
 276         });
 277
 278     });
 279 });