[NRRPLT-8094] import experiment added in experiment overview instead of experiment list

src/components/experiment-list/experiment-list.css

@@ -8,7 +8,6 @@ li.nostyle {
     grid-template-rows: auto;
     grid-template-columns: auto;
     grid-template-areas:
-        "import-experiments"
         "experiments";
 }
 
@@ -19,10 +18,6 @@ li.nostyle {
     background-color: white;
 }
 
-.import-experiments {
-  grid-area: import-experiments;
-}
-
 .no-items-notification {
     margin: 10px;
     font-size: 1.5em;

src/components/experiment-list/experiment-list.js

 import React from 'react';
 
-import ImportExperimentButtons from '../experiment-list/import-experiment-buttons.js';
 import ExperimentListElement from './experiment-list-element.js';
 
 import './experiment-list.css';
@@ -9,9 +8,6 @@ export default class ExperimentList extends React.Component {
   render() {
     return (
       <div className='experiment-list-wrapper'>
-        <div className='import-experiment'>
-          <ImportExperimentButtons />
-        </div>
         <div className='experiment-list'>
           {this.props.experiments.length === 0 ?
             <div className='no-items-notification'>List is currently empty ...</div> :

src/components/experiment-overview/experiment-overview.js

@@ -6,6 +6,7 @@ import ExperimentStorageService from '../../services/experiments/storage/experim
 import ExperimentServerService from '../../services/experiments/execution/server-resources-service.js';
 import ExperimentExecutionService from '../../services/experiments/execution/experiment-execution-service.js';
 
+import ImportExperimentButtons from '../experiment-list/import-experiment-buttons.js';
 import ExperimentList from '../experiment-list/experiment-list.js';
 import NrpHeader from '../nrp-header/nrp-header.js';
 
@@ -104,6 +105,7 @@ export default class ExperimentOverview extends React.Component {
           </TabList>
 
           <TabPanel>
+            <ImportExperimentButtons />
             <ExperimentList experiments={this.state.experiments}
               availableServers={this.state.availableServers}
               startingExperiment={this.state.startingExperiment} />

src/services/experiments/storage/__tests__/experiment-storage-service.test.js

@@ -13,13 +13,19 @@ jest.mock('../../../authentication-service');
 const proxyEndpoint = endpoints.proxy;
 const experimentsUrl = `${config.api.proxy.url}${proxyEndpoint.storage.experiments.url}`;
 
-test('fetches the list of experiments', async () => {
-  jest.spyOn(ExperimentStorageService.instance, 'performRequest');
-  const experiments = await ExperimentStorageService.instance.getExperiments();
-  expect(ExperimentStorageService.instance.performRequest)
-    .toHaveBeenCalledWith(experimentsUrl, ExperimentStorageService.instance.GETOptions);
-  expect(experiments[0].name).toBe('braitenberg_husky_holodeck_1_0_0');
-  expect(experiments[1].configuration.maturity).toBe('production');
+jest.setTimeout(3 * ExperimentStorageService.CONSTANTS.INTERVAL_POLL_EXPERIMENTS);
+
+let onWindowBeforeUnloadCb = undefined;
+beforeEach(() => {
+  jest.spyOn(window, 'addEventListener').mockImplementation((event, cb) => {
+    if (event === 'beforeunload') {
+      onWindowBeforeUnloadCb = cb;
+    }
+  });
+});
+
+afterEach(() => {
+  jest.restoreAllMocks();
 });
 
 test('makes sure that invoking the constructor fails with the right message', () => {
@@ -42,7 +48,7 @@ test('fetches the list of experiments', async () => {
 
   const experiments = await ExperimentStorageService.instance.getExperiments();
   expect(ExperimentStorageService.instance.performRequest)
-    .toHaveBeenCalledWith(experimentsUrl, ExperimentStorageService.instance.options);
+    .toHaveBeenCalledWith(experimentsUrl, ExperimentStorageService.instance.GETOptions);
   expect(experiments[0].name).toBe('braitenberg_husky_holodeck_1_0_0');
   expect(experiments[1].configuration.maturity).toBe('production');