Merge "Add toast message support for testcases page"

4 files changed, 68 insertions, 43 deletions

diff --git a/testapi/3rd_party/static/testapi-ui/assets/css/style.css b/testapi/3rd_party/static/testapi-ui/assets/css/style.css
index 222911c..2b20d6b 100644
--- a/testapi/3rd_party/static/testapi-ui/assets/css/style.css
+++ b/testapi/3rd_party/static/testapi-ui/assets/css/style.css
@@ -303,7 +303,7 @@ json-tree .leaf-value{
   border-radius: 10px;
   padding: 16px;
   position: fixed;
-  z-index: 1;
+  z-index: 9999;
   left: 50%;
   bottom: 30px;
 }
diff --git a/testapi/opnfv_testapi/tests/UI/e2e/testCasesControllerSpec.js b/testapi/opnfv_testapi/tests/UI/e2e/testCasesControllerSpec.js
index 53e7bdf..38e0f24 100644
--- a/testapi/opnfv_testapi/tests/UI/e2e/testCasesControllerSpec.js
+++ b/testapi/opnfv_testapi/tests/UI/e2e/testCasesControllerSpec.js
@@ -550,8 +550,11 @@ describe('testing the test cases page for user who is in submitter group', funct
         name.sendKeys('test');
         var buttonOK = element(by.buttonText('Ok'));
         buttonOK.click();
-        expect(element(by.cssContainingText(".alert","Testcase is successfully created."))
+        browser.ignoreSynchronization = true;
+        expect(element(by.cssContainingText(".success.show","Testcase is successfully created."))
         .isDisplayed()).toBe(true);
+        browser.sleep(500);
+        browser.ignoreSynchronization = false;
     });
 
     it('Showing error when creating with a empty name ', function () {
@@ -565,8 +568,11 @@ describe('testing the test cases page for user who is in submitter group', funct
         browser.wait(EC.visibilityOf(name), 5000);
         var buttonOK = element(by.buttonText('Ok'));
         buttonOK.click();
-        expect(element(by.cssContainingText(".alert","Name is missing."))
+        browser.ignoreSynchronization = true;
+        expect(element(by.cssContainingText(".error.show","Name is missing."))
         .isDisplayed()).toBe(true);
+        browser.sleep(500);
+        browser.ignoreSynchronization = false;
     });
 
     it('cancel the delete confimation modal of the test case ', function () {
@@ -590,8 +596,11 @@ describe('testing the test cases page for user who is in submitter group', funct
         deleteOperation.click();
         var buttonOK = element(by.buttonText('Ok'));
         buttonOK.click();
-        expect(element(by.cssContainingText(".alert","Test case is successfully deleted"))
+        browser.ignoreSynchronization = true;
+        expect(element(by.cssContainingText(".success.show","Test case is successfully deleted"))
         .isDisplayed()).toBe(true);
+        browser.sleep(500);
+        browser.ignoreSynchronization = false;
     });
 
     it('cancel the Edit modal of the test case ', function () {
@@ -621,8 +630,11 @@ describe('testing the test cases page for user who is in submitter group', funct
         name.sendKeys('test1');
         var buttonOK = element(by.buttonText('Ok'));
         buttonOK.click();
-        expect(element(by.cssContainingText(".alert","Test case is successfully updated"))
+        browser.ignoreSynchronization = true;
+        expect(element(by.cssContainingText(".success.show","Test case is successfully updated"))
         .isDisplayed()).toBe(true);
+        browser.sleep(500);
+        browser.ignoreSynchronization = false;
     });
 
     it('view the test case ', function () {
@@ -646,7 +658,10 @@ describe('testing the test cases page for user who is in submitter group', funct
         buttonDelete.click();
         var buttonOK = element(by.buttonText('Ok'));
         buttonOK.click();
-        expect(element(by.cssContainingText(".alert","Test case is successfully deleted"))
+        browser.ignoreSynchronization = true;
+        expect(element(by.cssContainingText(".success.show","Test case is successfully deleted"))
         .isDisplayed()).toBe(true);
+        browser.sleep(500);
+        browser.ignoreSynchronization = false;
     });
 })
diff --git a/testapi/opnfv_testapi/ui/components/projects/project/testCases/testCases.html b/testapi/opnfv_testapi/ui/components/projects/project/testCases/testCases.html
index 395db03..04baa9c 100644
--- a/testapi/opnfv_testapi/ui/components/projects/project/testCases/testCases.html
+++ b/testapi/opnfv_testapi/ui/components/projects/project/testCases/testCases.html
@@ -11,16 +11,12 @@
                   <i class="fa fa-plus"></i> Create</button>
             </div>
         </div>
-        <div class='clo-md-12'>
-            <div ng-show="testCasesCtrl.showError" class="alert alert-danger" role="alert">
-                <span class="pull-right">&nbsp;{{testCasesCtrl.error}}</span>
-                <span class="glyphicon glyphicon-exclamation-sign pull-right" aria-hidden="true" >Error:</span>
-            </div>
-            <div ng-show="testCasesCtrl.showSuccess" class="alert alert-success" role="alert">
-                <span class="pull-right">&nbsp;{{testCasesCtrl.successMessage}}</span>
-                <span class="glyphicon glyphicon-ok pull-right" aria-hidden="true"></span>
-            </div>
-        </div>
+        <div ng-class="{'show': testCasesCtrl.showError}" id="toast" class="error">
+            <span class="glyphicon glyphicon-exclamation-sign" aria-hidden="true" ></span>
+            {{testCasesCtrl.error}}</div>
+        <div ng-class="{'show': testCasesCtrl.showSuccess}" id="toast" class="success">
+                <span class="glyphicon glyphicon-ok" aria-hidden="true"></span>
+                {{testCasesCtrl.success}}</div>
         <div class='clo-md-12' style="padding-right:0px">
             <div class="table-responsive">
                 <table class="table table-bordered table-hover"  ng-data="testCasesCtrl.data.testcases">
diff --git a/testapi/opnfv_testapi/ui/components/projects/project/testCases/testCasesController.js b/testapi/opnfv_testapi/ui/components/projects/project/testCases/testCasesController.js
index 4d6153e..ea0498a 100644
--- a/testapi/opnfv_testapi/ui/components/projects/project/testCases/testCasesController.js
+++ b/testapi/opnfv_testapi/ui/components/projects/project/testCases/testCasesController.js
@@ -21,7 +21,7 @@
 
         TestCasesController.$inject = [
         '$scope', '$http', '$filter', '$state', '$window', '$uibModal', 'testapiApiUrl','raiseAlert',
-        'confirmModal', 'authenticate'
+        'confirmModal', 'authenticate', '$timeout'
     ];
 
     /**
@@ -31,7 +31,7 @@
      * in them.
      */
     function TestCasesController($scope, $http, $filter, $state, $window, $uibModal, testapiApiUrl,
-        raiseAlert, confirmModal, authenticate) {
+        raiseAlert, confirmModal, authenticate, $timeout) {
         var ctrl = this;
         ctrl.loadDetails = loadDetails;
         ctrl.name = $state.params['name'];
@@ -49,29 +49,40 @@
 
         ctrl.checkBox = [];
         ctrl.checkBoxList = [];
+        ctrl.toastError = toastError
+        ctrl.toastSuccess = toastSuccess
+
+        function toastError() {
+            ctrl.showError = true
+            $timeout(function(){ ctrl.showError = false;}, 3000);
+        }
+
+        function toastSuccess() {
+            ctrl.showSuccess = true
+            $timeout(function(){ ctrl.showSuccess = false;}, 3000);
+        }
 
         /**
          * This will contact the TestAPI to create a new test case.
          */
         function createTestCase(name, testcase) {
-            ctrl.showError = false;
-            ctrl.showSuccess = false;
             if(testcase.name != "" && testcase.name!=null){
                 var testCase_url = ctrl.requestUrl;
-                ctrl.testCasesRequest =
-                    $http.post(testCase_url, testcase).success(function (data){
-                        ctrl.showSuccess = true ;
-                        ctrl.successMessage = "Testcase is successfully created."
+                ctrl.testCasesRequest = $http.post(testCase_url, testcase)
+                ctrl.testCasesRequest.success(function (data){
+                        ctrl.success = "Testcase is successfully created."
                         loadDetails();
+                        ctrl.toastSuccess()
                     })
                     .catch(function (data) {
-                        ctrl.showError = true;
                         ctrl.error = data.statusText;
+                        ctrl.toastError();
                     });
+                return ctrl.testCasesRequest;
             }
             else{
-                ctrl.showError = true;
                 ctrl.error = 'Name is missing.'
+                ctrl.toastError();
             }
         }
 
@@ -114,24 +125,23 @@
          * This will contact the TestAPI to update an existing test case.
          */
         function updateTestCase(name, testCase) {
-            ctrl.showError = false;
-            ctrl.showSuccess = false;
             if(testCase.name != ""){
                 var testCase_url = ctrl.requestUrl + '/' + name;
-                ctrl.testCasesRequest =
-                    $http.put(testCase_url, testCase).success(function (data){
-                        ctrl.showSuccess = true ;
-                        ctrl.successMessage = "Test case is successfully updated"
+                ctrl.testCasesRequest = $http.put(testCase_url, testCase)
+                ctrl.testCasesRequest.success(function (data){
+                        ctrl.success = "Test case is successfully updated"
                         loadDetails();
+                        ctrl.toastSuccess();
                     })
                     .catch(function (data) {
-                        ctrl.showError = true;
                         ctrl.error = data.statusText;
+                        ctrl.toastError()
                     });
+                return ctrl.testCasesRequest;
             }
             else{
-                ctrl.showError = true;
                 ctrl.error = 'Name is missing.'
+                ctrl.toastError()
             }
         }
 
@@ -139,16 +149,14 @@
          * This will contact the TestAPI to delete an existing test case.
         */
         function deleteTestCase(name) {
-            ctrl.showError = false;
-            ctrl.showSuccess = false;
             ctrl.testCasesRequest =
             $http.delete(ctrl.requestUrl+"/"+name).success(function (data) {
                 loadDetails();
-                ctrl.showSuccess = true ;
-                ctrl.successMessage = "Test case is successfully deleted"
+                ctrl.success = "Test case is successfully deleted";
+                ctrl.toastSuccess();
             }).catch(function (error) {
-                ctrl.showError = true;
-                ctrl.error = data.statusText;
+                ctrl.error = error.statusText;
+                ctrl.toastError();
             });
         }
 
@@ -218,8 +226,8 @@
                     ctrl.data = data;
                 }).catch(function (error) {
                     ctrl.data = null;
-                    ctrl.showError = true;
                     ctrl.error = error.statusText;
+                    ctrl.toastError()
                 });
         }
         ctrl.loadDetails();
@@ -271,9 +279,15 @@
          * inputs.
          */
         function confirm() {
-            $uibModalInstance.close();
             if (angular.isDefined(ctrl.data.successHandler)) {
-                ctrl.data.successHandler(ctrl.name, ctrl.testcase);
+                if(ctrl.testcase.name){
+                    ctrl.data.successHandler(ctrl.name, ctrl.testcase).success( function(){
+                        $uibModalInstance.close();
+                    })
+                }
+                else{
+                    ctrl.data.successHandler(ctrl.name, ctrl.testcase)
+                }
             }
         }