From 45ea6e48272abf9f0a13321e1f81470f127d6af0 Mon Sep 17 00:00:00 2001
From: Stanislav Jamrich <sjamrich@cisco.com>
Date: Tue, 11 Oct 2016 15:39:41 +0200
Subject: [PATCH] Yangman - make elements accessible via ids - part1

- add id attributes to dom elements to be simply accessible for automatic
  testing

Change-Id: I8ee7ccd65067fae3e682456983982575a3fe45fc
Signed-off-by: Stanislav Jamrich <sjamrich@cisco.com>
---
 .../controllers/yang-form.controller.js       | 16 +++++++---
 .../yangman/directives/abn-tree.directive.js  |  1 +
 .../yangman/services/parameters.services.js   |  4 ++-
 .../views/directives/abn-tree.tpl.html        |  5 ++--
 .../resources/yangman/views/index.tpl.html    |  7 +++--
 .../views/leftpanel/collections-tab.tpl.html  | 29 ++++++++++++++-----
 .../views/leftpanel/history-tab.tpl.html      | 16 ++++++++--
 .../views/leftpanel/module-detail.tpl.html    |  5 ++--
 .../views/leftpanel/modules-tab.tpl.html      |  8 +++--
 .../views/leftpanel/request-item.tpl.html     | 15 ++++++----
 .../yangman/views/rightpanel/detail.tpl.html  | 11 +------
 .../views/rightpanel/request-data.tpl.html    |  1 +
 .../views/rightpanel/request-header.tpl.html  | 25 ++++++++++------
 13 files changed, 94 insertions(+), 49 deletions(-)

diff --git a/modules/yangman-resources/src/main/resources/yangman/controllers/yang-form.controller.js b/modules/yangman-resources/src/main/resources/yangman/controllers/yang-form.controller.js
index f312608f..7a82ef85 100644
--- a/modules/yangman-resources/src/main/resources/yangman/controllers/yang-form.controller.js
+++ b/modules/yangman-resources/src/main/resources/yangman/controllers/yang-form.controller.js
@@ -28,15 +28,23 @@ define([
 
         yangForm.viewPath = $scope.globalViewPath + 'rightpanel/form';
         yangForm.errorMsg = '';
+        yangForm.inputIndex = 0;
         $scope.constants = constants;
 
-        // methods
+
         yangForm.getNodeName = getNodeName;
 
-        // watchers
-        $scope.$on(constants.YANGMAN_SET_ERROR_DATA, setRcvdErrorData);
+        init();
+
+
+
+
+        function init() {
+            $scope.$on(constants.YANGMAN_SET_ERROR_DATA, setRcvdErrorData);
+            $scope.$on(constants.YANGMAN_SET_ERROR_MESSAGE, setErrorMessage);
+        }
+
 
-        $scope.$on(constants.YANGMAN_SET_ERROR_MESSAGE, setErrorMessage);
 
         /**
          * Method for set error message in form
diff --git a/modules/yangman-resources/src/main/resources/yangman/directives/abn-tree.directive.js b/modules/yangman-resources/src/main/resources/yangman/directives/abn-tree.directive.js
index 06358536..810ab18b 100644
--- a/modules/yangman-resources/src/main/resources/yangman/directives/abn-tree.directive.js
+++ b/modules/yangman-resources/src/main/resources/yangman/directives/abn-tree.directive.js
@@ -288,6 +288,7 @@ define(['angular'], function (angular) {
                                 }
                             }
                             scope.tree_rows.push({
+                                index: scope.tree_rows.length, // in template tracking by branch.uid, integer needed
                                 level: level,
                                 branch: branch,
                                 label: branch.label,
diff --git a/modules/yangman-resources/src/main/resources/yangman/services/parameters.services.js b/modules/yangman-resources/src/main/resources/yangman/services/parameters.services.js
index 7c7d3fd0..55bd0ce9 100644
--- a/modules/yangman-resources/src/main/resources/yangman/services/parameters.services.js
+++ b/modules/yangman-resources/src/main/resources/yangman/services/parameters.services.js
@@ -17,6 +17,9 @@ define([
             service.createParameter = createParameter;
             service.validateFile = validateFile;
 
+            return service;
+
+
             /**
              * Validating collection import file
              * @param data
@@ -62,7 +65,6 @@ define([
             }
 
 
-            return service;
 
         }
 
diff --git a/modules/yangman-resources/src/main/resources/yangman/views/directives/abn-tree.tpl.html b/modules/yangman-resources/src/main/resources/yangman/views/directives/abn-tree.tpl.html
index 257206f2..1b5aa5c8 100644
--- a/modules/yangman-resources/src/main/resources/yangman/views/directives/abn-tree.tpl.html
+++ b/modules/yangman-resources/src/main/resources/yangman/views/directives/abn-tree.tpl.html
@@ -2,9 +2,10 @@
         <md-list-item ng-repeat="row in tree_rows | filter:{visible:true} track by row.branch.uid"
                       ng-class="'level-' + {{ row.level }} + (row.branch.selected ? ' active':'')"
                       ng-click="user_clicks_branch(row.branch)"
-                      ng-init="(_dataCollection = []).length = row.level;">
+                      id="branch-{{row.index}}"
+                      ng-init="(_dataCollection = []).length = row.level; idIndex = idIndex + 1;">
             <span ng-repeat="i in _dataCollection track by $index" ng-class="{'empty-box' : $index !== 0}"></span>
-            <md-icon md-font-set="material-icons" class="pointer" ng-click="row.branch.expanded = !row.branch.expanded">{{row.tree_icon}}</md-icon>
+            <md-icon md-font-set="material-icons" class="pointer" id="toggle-branch-{{row.index}}" ng-click="row.branch.expanded = !row.branch.expanded">{{row.tree_icon}}</md-icon>
             <span flex class="indented tree-label">{{ row.label }} {{ row.branch.identifier }}</span>
         </md-list-item>
 </md-list>
diff --git a/modules/yangman-resources/src/main/resources/yangman/views/index.tpl.html b/modules/yangman-resources/src/main/resources/yangman/views/index.tpl.html
index ab6be169..8fea0ff6 100644
--- a/modules/yangman-resources/src/main/resources/yangman/views/index.tpl.html
+++ b/modules/yangman-resources/src/main/resources/yangman/views/index.tpl.html
@@ -5,6 +5,7 @@
         <!-- module arrow button -->
         <md-icon md-font-set="material-icons "
                  class="arrow-switcher"
+                 id="toggle-module-detail"
                  ng-click="main.toggleLeftPanel(); main.initModuleDetailHeight();"
                  ng-class="{'arrow-switcher__left' : main.leftPanelTab === 0}"
                  ng-show="selectedDatastore"> play_arrow </md-icon>
@@ -17,15 +18,15 @@
                     <!-- MODULES HISTORY COLLECTION TABS -->
                     <md-tabs class="yangmanModule__mhc-tabs inline-tabs" md-no-pagination md-dynamic-height md-stretch-tabs="always">
                         <!-- Modules tab -->
-                        <md-tab label="{{'YANGMAN_MODULES' | translate}}" md-on-select="main.switchedTab(0)">
+                        <md-tab label="{{'YANGMAN_MODULES' | translate}}" md-on-select="main.switchedTab(0)" id="tab-modules">
                             <div ng-include src="globalViewPath + 'leftpanel/modules-tab.tpl.html'" class="h100"></div>
                         </md-tab>
                         <!-- History tab -->
-                        <md-tab label="{{'YANGMAN_HISTORY' | translate}}" md-on-select="main.switchedTab(1)">
+                        <md-tab label="{{'YANGMAN_HISTORY' | translate}}" md-on-select="main.switchedTab(1)" id="tab-history">
                             <div ng-include src="globalViewPath + 'leftpanel/history-tab.tpl.html'" class="historyTab"></div>
                         </md-tab>
                         <!-- Collection tab -->
-                        <md-tab label="{{'YANGMAN_COLLECTIONS' | translate}}" md-on-select="main.switchedTab(2)">
+                        <md-tab label="{{'YANGMAN_COLLECTIONS' | translate}}" md-on-select="main.switchedTab(2)" id="tab-collections">
                             <div ng-include src="globalViewPath + 'leftpanel/collections-tab.tpl.html'" class="collectionsTab"></div>
                         </md-tab>
                     </md-tabs>
diff --git a/modules/yangman-resources/src/main/resources/yangman/views/leftpanel/collections-tab.tpl.html b/modules/yangman-resources/src/main/resources/yangman/views/leftpanel/collections-tab.tpl.html
index b8d7a9e9..870f43d3 100644
--- a/modules/yangman-resources/src/main/resources/yangman/views/leftpanel/collections-tab.tpl.html
+++ b/modules/yangman-resources/src/main/resources/yangman/views/leftpanel/collections-tab.tpl.html
@@ -11,12 +11,14 @@
             <md-icon class="material-icons">search</md-icon>
             <input class="ng-pristine ng-valid ng-touched"
                    type="text"
+                   id="search-collections"
                    flex
                    placeholder="{{'YANGMAN_SEARCH' | translate}}"
                    ng-model="reqList.search"
                    aria-invalid="false" />
             <md-button aria-label="{{'YANGMAN_CLEAR_SEARCH'| translate}}" flex="none"
                        ng-click="reqList.clearFilter()"
+                       id="search-collections-clear"
                        ng-if="reqList.search">
                 <md-icon class="material-icons clickable">
                     close
@@ -29,6 +31,7 @@
         <!-- sorting -->
         <span class="collection-button-container">
             <md-button  ng-click="reqList.toggleCollectionsSort()"
+                        id="sort-collections"
                         ng-disabled="reqList.collectionList.collections.length <= 1">
                 <md-icon class="material-icons clickable" > sort</md-icon>
             </md-button>
@@ -41,6 +44,7 @@
         <!-- save -->
         <span class="collection-button-container">
             <md-button  ng-click="reqList.showDgSaveReq($event)"
+                        id="collections-save-selected"
                         ng-disabled="reqList.mainList.getSelectedItems(reqList.filterCollReq).length === 0">
                 <md-icon class="material-icons clickable">
                     save
@@ -53,7 +57,7 @@
         <!-- importing -->
         <span class="collection-button-container">
             <input type="file" accept=".json" id="importCollection" on-read-file="reqList.readCollectionFromFile($fileContent)">
-            <md-button>
+            <md-button id="import-collection-button">
                 <label for="importCollection">
                     <md-icon class="material-icons clickable" >
                         file_upload
@@ -65,7 +69,7 @@
         <!-- /importing -->
 
         <md-menu layout-align="center start">
-            <md-button ng-disabled="!reqList.mainList.list.length" aria-label="menu"  ng-click="$mdOpenMenu()">
+            <md-button ng-disabled="!reqList.mainList.list.length" aria-label="menu" id="collections-delete-menu" ng-click="$mdOpenMenu()">
                 <md-icon class="material-icons clickable"> delete</md-icon>
                 <md-tooltip md-direction="bottom">{{'YANGMAN_DELETE_OPTIONS' | translate}}</md-tooltip>
             </md-button>
@@ -73,6 +77,7 @@
                 <!-- delete selected -->
                 <md-menu-item>
                     <md-button aria-label="{{'YANGMAN_REQS_DELETE'| translate}}"
+                               id="collections-delete-selected"
                                ng-click="reqList.showDgDeleteRequests($event)"
                                ng-disabled="reqList.mainList.getSelectedItems(reqList.filterCollReq).length === 0">
                         <md-icon class="material-icons clickable">
@@ -85,6 +90,7 @@
                 <!-- clear collections -->
                 <md-menu-item>
                     <md-button aria-label="{{'YANGMAN_DELETE_COLLECTIONS' | translate}}"
+                               id="collections-delete-all"
                                ng-click="reqList.clearCollectionList($event)">
                         <md-icon class="material-icons clickable">
                             delete_forever
@@ -99,7 +105,7 @@
 
         <!-- menu for selecting and deselecting-->
         <md-menu layout-align="center start">
-            <md-button ng-disabled="( !reqList.mainList.list.length)" aria-label="menu"  ng-click="$mdOpenMenu()">
+            <md-button ng-disabled="( !reqList.mainList.list.length)" aria-label="menu" id="collections-select-menu" ng-click="$mdOpenMenu()">
                 <md-icon class="material-icons clickable">
                     playlist_add_check
                 </md-icon>
@@ -109,6 +115,7 @@
                 <!-- select all -->
                 <md-menu-item>
                     <md-button aria-label="{{'YANGMAN_SELECT_ALL' | translate}}"
+                               id="collections-select-all"
                                ng-click="reqList.selectAllFilteredRequests()">
                         <md-icon class="material-icons clickable">
                             done
@@ -121,6 +128,7 @@
                 <md-menu-item>
                     <md-button aria-label="{{'YANGMAN_DESELECT_ALL' | translate}}"
                                ng-click="reqList.deselectAllFilteredRequests()"
+                               id="collections-deselect-all"
                                ng-disabled="reqList.mainList.getSelectedItems(reqList.filterCollReq).length === 0">
                         <md-icon class="material-icons clickable">
                             close
@@ -139,12 +147,13 @@
     <!-- collection list -->
     <md-content class="scrollableY">
 
-        <div ng-repeat="collection in reqList.mainList.collections | filter: reqList.filterCol | orderBy: (reqList.collectionsSortAsc ? '' : '-')+'name'">
+        <div ng-repeat="collection in reqList.mainList.collections | filter: reqList.filterCol | orderBy: (reqList.collectionsSortAsc ? '' : '-')+'name' track by $index" ng-init="collectionIndex = $index">
 
             <div layout="row">
 
                 <md-list-item class="yangmanModule__requests-list__collection"
                               flex
+                              id="collection-{{$index}}"
                               ng-class="{'expanded' : collection.expanded, 'selected': collection.expanded}"
                               ng-click="collection.toggleExpanded()">
 
@@ -155,7 +164,7 @@
                         <div layout="column">
 
                             <p flex>
-                            <span md-highlight-text="reqList.search" md-highlight-flags="i">
+                            <span md-highlight-text="reqList.search" id="collection-{{$index}}-name" md-highlight-flags="i">
                                 {{collection.name}}
                             </span><br />
                             <span class="desc">
@@ -168,6 +177,7 @@
 
                 </md-list-item>
                 <md-menu class="yangmanModule__requests-list__group__collectionMenu"
+                         id="collection-menu-{{$index}}"
                          md-offset="35 15"
                          layout-align="center start">
                     <md-button aria-label="menu" class="md-primary" ng-click="$mdOpenMenu()">
@@ -175,7 +185,8 @@
                     </md-button>
                     <md-menu-content class="reqMenu">
                         <md-menu-item>
-                            <md-button aria-label="Duplicate collection"
+                            <md-button aria-label="Edit collection"
+                                       id="collection-menu-{{$index}}-edit"
                                        ng-click="reqList.showDgEditCollection($event, collection, false)">
                                 <i class="material-icons">mode_edit</i>
                                 {{'YANGMAN_COLLECTION_EDIT'| translate}}
@@ -183,6 +194,7 @@
                         </md-menu-item>
                         <md-menu-item>
                             <md-button aria-label="{{'YANGMAN_COLLECTION_DUPLICATE'| translate}}"
+                                       id="collection-menu-{{$index}}-duplicate"
                                        ng-click="reqList.showDgEditCollection($event, collection, true)">
                                 <i class="material-icons">control_point_duplicate</i>
                                 {{'YANGMAN_COLLECTION_DUPLICATE'| translate}}
@@ -190,6 +202,7 @@
                         </md-menu-item>
                         <md-menu-item>
                             <md-button aria-label="{{'YANGMAN_COLLECTION_DOWNLOAD'| translate}}"
+                                       id="collection-menu-{{$index}}-download"
                                        ng-click="reqList.downloadCollection(collection)">
                                 <i class="material-icons">file_download</i>
                                 {{'YANGMAN_COLLECTION_DOWNLOAD'| translate}}
@@ -197,6 +210,7 @@
                         </md-menu-item>
                         <md-menu-item>
                             <md-button aria-label="{{'YANGMAN_COLLECTION_DELETE'| translate}}"
+                                       id="collection-menu-{{$index}}-delete"
                                        ng-click="reqList.showDgDeleteCollection($event, collection)">
                                 <i class="material-icons">delete</i>
                                 {{'YANGMAN_COLLECTION_DELETE'| translate}}
@@ -208,8 +222,9 @@
 
 
             <md-list ng-show="collection.expanded" class="yangmanModule__requests-list__collection__requests">
-                <div ng-repeat="request in collection.data | filter: reqList.filterReq"
+                <div ng-repeat="request in collection.data | filter: reqList.filterReq track by $index"
                      layout="row"
+                     ng-init="itemId='collection-request-'+collectionIndex+'-'+$index"
                      class="yangmanModule__requests-list__item-container"
                      ng-include src="globalViewPath + 'leftpanel/request-item.tpl.html'">
                 </div>
diff --git a/modules/yangman-resources/src/main/resources/yangman/views/leftpanel/history-tab.tpl.html b/modules/yangman-resources/src/main/resources/yangman/views/leftpanel/history-tab.tpl.html
index f6560d01..2d8c1ed2 100644
--- a/modules/yangman-resources/src/main/resources/yangman/views/leftpanel/history-tab.tpl.html
+++ b/modules/yangman-resources/src/main/resources/yangman/views/leftpanel/history-tab.tpl.html
@@ -13,9 +13,11 @@
                    type="text"
                    flex
                    placeholder="{{'YANGMAN_SEARCH' | translate}}"
+                   id="search-history"
                    ng-model="reqList.search"
                    aria-invalid="false" />
             <md-button aria-label="{{'YANGMAN_CLEAR_SEARCH'| translate}}" flex="none"
+                       id="search-history-clear"
                        ng-click="reqList.clearFilter()"
                        ng-if="reqList.search">
                 <md-icon class="material-icons clickable">
@@ -28,6 +30,7 @@
 
         <!-- save -->
         <md-button  ng-click="reqList.showDgSaveReq($event)"
+                    id="history-save-requests"
                     ng-disabled="!reqList.mainList.getSelectedItems(reqList.filterReq).length">
             <md-icon class="material-icons clickable">
                 save
@@ -38,7 +41,7 @@
 
         <!-- menu for deleting and clearing-->
         <md-menu layout-align="center start">
-            <md-button ng-disabled="!reqList.mainList.list.length" aria-label="menu"  ng-click="$mdOpenMenu()">
+            <md-button ng-disabled="!reqList.mainList.list.length" aria-label="menu" id="history-delete-menu" ng-click="$mdOpenMenu()">
                 <md-icon class="material-icons clickable"> delete</md-icon>
                 <md-tooltip md-direction="bottom">{{'YANGMAN_DELETE_OPTIONS' | translate}}</md-tooltip>
             </md-button>
@@ -47,6 +50,7 @@
                 <md-menu-item>
                     <md-button aria-label="{{'YANGMAN_REQS_DELETE'| translate}}"
                                ng-click="reqList.showDgDeleteRequests($event)"
+                               id="history-delete-selected"
                                ng-disabled="!reqList.mainList.getSelectedItems(reqList.filterReq).length">
                         <md-icon class="material-icons clickable"> delete</md-icon>
                         {{'YANGMAN_REQS_DELETE'| translate}}
@@ -57,6 +61,7 @@
                 <md-menu-item>
                     <md-button aria-label="{{'YANGMAN_DELETE_HISTORY' | translate}}"
                                ng-click="reqList.clearHistoryList($event)"
+                               id="history-delete-all"
                                ng-disabled="!reqList.mainList.list.length">
                         <md-icon class="material-icons clickable"> delete_forever</md-icon>
                         {{'YANGMAN_DELETE_HISTORY' | translate}}
@@ -69,7 +74,7 @@
 
         <!-- menu for selecting and deselecting-->
         <md-menu layout-align="center start">
-            <md-button ng-disabled="!reqList.mainList.list.length" aria-label="menu"  ng-click="$mdOpenMenu()">
+            <md-button ng-disabled="!reqList.mainList.list.length" aria-label="menu" id="history-select-menu"  ng-click="$mdOpenMenu()">
                 <md-icon class="material-icons clickable">
                     playlist_add_check
                 </md-icon>
@@ -79,6 +84,7 @@
                 <!-- select all -->
                 <md-menu-item>
                     <md-button aria-label="{{'YANGMAN_SELECT_ALL' | translate}}"
+                               id="history-select-all"
                                ng-click="reqList.selectAllFilteredRequests()">
                         <md-icon class="material-icons clickable">
                             done
@@ -90,6 +96,7 @@
                 <!-- deselect all -->
                 <md-menu-item>
                     <md-button aria-label="{{'YANGMAN_DESELECT_ALL' | translate}}"
+                               id="history-deselect-all"
                                ng-click="reqList.deselectAllFilteredRequests()" ng-disabled="reqList.mainList.getSelectedItems(reqList.filterReq).length === 0">
                         <md-icon class="material-icons clickable">
                             close
@@ -108,7 +115,9 @@
 
     <!-- list of items grouped by date -->
     <md-content class="scrollableY">
-        <md-list-item ng-repeat="group in reqList.mainList.dateGroups | orderBy: 'name': true"
+        <md-list-item ng-repeat="group in reqList.mainList.dateGroups | orderBy: 'name': true track by $index"
+                      id="history-requests-group-{{$index}}"
+                      ng-init="groupIndex=$index"
                       class="yangmanModule__requests-list__group"
                       ng-if="(group.requests | filter:reqList.filterReq).length">
 
@@ -124,6 +133,7 @@
                 <md-list>
                     <div ng-repeat="request in group.requests | filter: reqList.filterReq  | orderBy: '-timestamp' track by $index"
                          layout="row"
+                         ng-init="itemId = 'history-request-'+groupIndex+'-'+$index"
                          class="yangmanModule__requests-list__item-container"
                          ng-include src="globalViewPath + 'leftpanel/request-item.tpl.html'">
                     </div>
diff --git a/modules/yangman-resources/src/main/resources/yangman/views/leftpanel/module-detail.tpl.html b/modules/yangman-resources/src/main/resources/yangman/views/leftpanel/module-detail.tpl.html
index 62bce5d9..7db2a81c 100644
--- a/modules/yangman-resources/src/main/resources/yangman/views/leftpanel/module-detail.tpl.html
+++ b/modules/yangman-resources/src/main/resources/yangman/views/leftpanel/module-detail.tpl.html
@@ -1,15 +1,16 @@
 <md-content ng-controller="ModuleDetailCtrl as moduleDetail">
     <!-- Module title -->
     <h4 class="text-center"><small>module</small> {{selectedModule.label}}</h4>
+
     <!-- DATA STORE || RPC TABS -->
     <md-tabs md-no-pagination md-dynamic-height
              md-stretch-tabs="always"
              md-selected="moduleDetail.selectedDataStoreIndex"
              class="tabs inline-tabs">
-        <md-tab ng-repeat="item in selectedModule.children">
+        <md-tab ng-repeat="item in selectedModule.children track by $index">
             <md-tab-label>
                 <div layout="row">
-                    <span flex="grow" ng-click="moduleDetail.setDataDetailStore(item)">{{item.label}}</span>
+                    <span flex="grow" ng-click="moduleDetail.setDataDetailStore(item)"  id="selected-module-portion-{{$index}}">{{item.label}}</span>
                 </div>
             </md-tab-label>
 
diff --git a/modules/yangman-resources/src/main/resources/yangman/views/leftpanel/modules-tab.tpl.html b/modules/yangman-resources/src/main/resources/yangman/views/leftpanel/modules-tab.tpl.html
index 399f233a..a8273776 100644
--- a/modules/yangman-resources/src/main/resources/yangman/views/leftpanel/modules-tab.tpl.html
+++ b/modules/yangman-resources/src/main/resources/yangman/views/leftpanel/modules-tab.tpl.html
@@ -6,12 +6,14 @@
             <input class="ng-pristine ng-valid ng-touched"
                    type="text"
                    flex
+                   id="search-modules"
                    placeholder="{{'YANGMAN_SEARCH' | translate}}"
                    ng-model="modulesList.search"
                    aria-invalid="false" />
 
             <!-- search clear button -->
             <md-button aria-label="{{'YANGMAN_CLEAR_SEARCH'| translate}}" flex="none"
+                       id="search-modules-clear"
                        ng-click="modulesList.clearFilter()"
                        ng-if="modulesList.search">
                 <md-icon class="material-icons clickable">
@@ -40,9 +42,11 @@
         </section>
 
         <!-- Modules list -->
-        <md-list-item ng-repeat="module in modulesList.treeApis | filter: modulesList.customSearch | orderBy: 'label'"
+        <md-list-item ng-repeat="module in modulesList.treeApis | filter: modulesList.customSearch | orderBy: 'label' track by $index"
                       class="yangmanModule__modules-list__item"
                       ng-class="{'expanded' : module.expanded, 'selected' : modulesList.checkSelectedModule(module)}"
+                      id="module_{{$index}}"
+                      ng-init="parentIndex = $index"
                       ng-hide="modulesList.showLoadingBox"
                       ng-click="modulesList.setModule(module, $event)">
             <!-- Item content -->
@@ -57,7 +61,7 @@
 
                 <!-- Datastore && rpc -->
                 <md-list flex class="yangmanModule__datastore-list" ng-show="module.expanded">
-                    <md-list-item ng-repeat="item in module.children">
+                    <md-list-item ng-repeat="item in module.children track by $index" id="module-{{parentIndex}}-portion-{{$index}}">
                         <div flex
                              layout="row"
                              layout-align="center center"
diff --git a/modules/yangman-resources/src/main/resources/yangman/views/leftpanel/request-item.tpl.html b/modules/yangman-resources/src/main/resources/yangman/views/leftpanel/request-item.tpl.html
index 79054235..1357c385 100644
--- a/modules/yangman-resources/src/main/resources/yangman/views/leftpanel/request-item.tpl.html
+++ b/modules/yangman-resources/src/main/resources/yangman/views/leftpanel/request-item.tpl.html
@@ -1,17 +1,18 @@
 <!-- request row -->
 <md-list-item class="yangmanModule__requests-list__group__item"
               ng-class="{selected: request.selected}"
+              id="{{itemId}}"
               layout="row"
               flex="100"
               ng-click="reqList.selectRequest($event, request);">
 
     <div flex="15" class="yangmanModule__requests-list__group__item__method" layout-align="center center">
-        <p class="{{request.status === 'success' || !request.status ? request.method : 'error'}}"> {{request.method === vm.constants.OPERATION_DELETE ? 'DEL' : request.method }} </p>
+        <p id="{{itemId}}-operation" class="{{request.status === 'success' || !request.status ? request.method : 'error'}}"> {{request.method === vm.constants.OPERATION_DELETE ? 'DEL' : request.method }} </p>
         <md-tooltip md-direction="bottom" ng-show="request.status">{{request.status | uppercase }}</md-tooltip>
     </div>
 
     <div flex class="yangmanModule__requests-list__group__item__path" layout="column">
-        <p md-highlight-text="reqList.search" md-highlight-flags="i">
+        <p id="{{itemId}}-url" md-highlight-text="reqList.search" md-highlight-flags="i">
             {{ request.path }}
         </p>
     </div>
@@ -25,25 +26,26 @@
          layout-align="center start"
          ng-class="{selected: request.selected}">
 
-    <md-button aria-label="menu" class="md-primary" ng-click="reqList.selectOnlyThisRequest(request); $mdOpenMenu()">
+    <md-button aria-label="menu" class="md-primary" id="{{itemId}}-submenu" ng-click="reqList.selectOnlyThisRequest(request); $mdOpenMenu()">
         <i class="material-icons">menu</i>
     </md-button>
 
     <md-menu-content class="reqMenu">
         <md-menu-item>
-            <md-button aria-label="{{'YANGMAN_REQ_RUN'| translate}}" class="" ng-click="reqList.executeRequest(request)">
+            <md-button aria-label="{{'YANGMAN_REQ_RUN'| translate}}" id="{{itemId}}-execute" class="" ng-click="reqList.executeRequest(request)">
                 <i class="material-icons">play_arrow</i>
                 {{'YANGMAN_REQ_RUN'| translate}}
             </md-button>
         </md-menu-item>
         <md-menu-item>
-            <md-button aria-label="{{'YANGMAN_REQ_SHOW_FORM'| translate}}" ng-click="reqList.showForm(request)">
+            <md-button aria-label="{{'YANGMAN_REQ_SHOW_FORM'| translate}}" id="{{itemId}}-show-form" ng-click="reqList.showForm(request)">
                 <i class="material-icons">exit_to_app</i>
                 {{'YANGMAN_REQ_SHOW_FORM'| translate}}
             </md-button>
         </md-menu-item>
         <md-menu-item>
             <md-button aria-label="{{'YANGMAN_REQ_SHOW_SENT_DATA'| translate}}"
+                       id="{{itemId}}-show-sent-data"
                        ng-click="reqList.showData(request)">
                 <i class="material-icons">call_made</i>
                 {{'YANGMAN_REQ_SHOW_JSON_DATA'| translate}}
@@ -51,13 +53,14 @@
         </md-menu-item>
         <md-menu-item ng-if="request.collection.length">
             <md-button aria-label="{{'YANGMAN_REQ_DUPLICATE'| translate}}"
+                       id="{{itemId}}-duplicate"
                        ng-click="reqList.showDgSaveReq($event, request, true)">
                 <i class="material-icons">control_point_duplicate</i>
                 {{'YANGMAN_REQ_DUPLICATE'| translate}}
             </md-button>
         </md-menu-item>
         <md-menu-item>
-            <md-button aria-label="{{'YANGMAN_REQ_DELETE'| translate}}" ng-click="reqList.showDgDeleteRequests($event, request)">
+            <md-button aria-label="{{'YANGMAN_REQ_DELETE'| translate}}" id="{{itemId}}-delete" ng-click="reqList.showDgDeleteRequests($event, request)">
                 <i class="material-icons">delete</i>
                 {{'YANGMAN_REQ_DELETE'| translate}}
             </md-button>
diff --git a/modules/yangman-resources/src/main/resources/yangman/views/rightpanel/detail.tpl.html b/modules/yangman-resources/src/main/resources/yangman/views/rightpanel/detail.tpl.html
index 519cd5e1..9cdbd731 100644
--- a/modules/yangman-resources/src/main/resources/yangman/views/rightpanel/detail.tpl.html
+++ b/modules/yangman-resources/src/main/resources/yangman/views/rightpanel/detail.tpl.html
@@ -6,21 +6,12 @@
 </section>
 <!-- /Header -->
 
-<!--<section class="yangmanModule__right-panel__request-progress">-->
-    <!--<div class="yangmanModule__right-panel__request-progress__loading-container">-->
-        <!--<md-progress-linear md-mode="query"></md-progress-linear>-->
-        <!--<div class="bottom-block">-->
-            <!--<span>{{ 'YANGMAN_EXECUTING_REQUEST' | translate }}...</span>-->
-        <!--</div>-->
-    <!--</div>-->
-<!--</section>-->
-
 <!-- Form section -->
 <section class="yangmanModule__right-panel__form bottom-content"
          ng-show="rightPanelSection === main.constants.DISPLAY_TYPE_FORM"
          ng-if="node"
          ng-controller="YangFormCtrl as yangForm">
-    <div ng-show="yangForm.errorMsg"><p class="error">{{ yangForm.errorMsg }}</p></div>
+    <div ng-show="yangForm.errorMsg"><p class="error" id="form-error-message">{{ yangForm.errorMsg }}</p></div>
     <div ng-include src="yangForm.viewPath + '/' + selectedDatastore.label + '/' + node.type+'.tpl.html'"></div>
 </section>
 <!-- /Form section -->
diff --git a/modules/yangman-resources/src/main/resources/yangman/views/rightpanel/request-data.tpl.html b/modules/yangman-resources/src/main/resources/yangman/views/rightpanel/request-data.tpl.html
index 79261d93..7532780a 100644
--- a/modules/yangman-resources/src/main/resources/yangman/views/rightpanel/request-data.tpl.html
+++ b/modules/yangman-resources/src/main/resources/yangman/views/rightpanel/request-data.tpl.html
@@ -1,5 +1,6 @@
 <textarea ng-model="requestData.data"
           ui-codemirror
+          id="request-data-{{requestData.type | lowercase}}"
           ui-codemirror-opts="requestData.dataEditorOptions"
           class="codemirror-container">
 </textarea>
diff --git a/modules/yangman-resources/src/main/resources/yangman/views/rightpanel/request-header.tpl.html b/modules/yangman-resources/src/main/resources/yangman/views/rightpanel/request-header.tpl.html
index 3857496d..5fa4ffef 100644
--- a/modules/yangman-resources/src/main/resources/yangman/views/rightpanel/request-header.tpl.html
+++ b/modules/yangman-resources/src/main/resources/yangman/views/rightpanel/request-header.tpl.html
@@ -4,6 +4,7 @@
         <md-input-container flex="initial">
             <md-select ng-model="requestHeader.selectedOperation"
                        md-on-close="requestHeader.setJsonView()"
+                       id="request-selected-operation"
                        placeholder="{{'YANGMAN_SEL_METHOD' | translate}}">
 
                 <md-option ng-value="operation" ng-repeat="operation in requestHeader.selectedOperationsList">
@@ -17,13 +18,16 @@
             <md-input-container flex md-no-float ng-if="rightPanelSection === requestHeader.constants.DISPLAY_TYPE_REQ_DATA">
                 <input type="text"
                        ng-model="requestHeader.requestUrl"
+                       id="request-url"
                        placeholder="{{'YANGMAN_REQ_URL' | translate}}"
                        spellcheck="false">
             </md-input-container>
 
-            <div ng-repeat="pathElem in selectedSubApi.pathArray"
+            <div ng-repeat="pathElem in selectedSubApi.pathArray track by $index"
                  flex="nogrow"
+                 id="path-elem-{{$index}}"
                  layout="row"
+                 ng-init="parentIndex = $index"
                  ng-if="rightPanelSection === requestHeader.constants.DISPLAY_TYPE_FORM">
 
                 <md-input-container flex="nogrow" md-no-float class="input-span nrp" >
@@ -44,6 +48,7 @@
                            class="input-identifier"
                            ng-change="requestHeader.fillNodeData(pathElem, identifier)"
                            ng-model="identifier.value"
+                           id="path-elem-{{parentIndex}}-value"
                            aria-label="{{identifier.value}}"
                            ng-class="{'md-has-error': !identifier.value.length}"
                            spellcheck="false">
@@ -68,6 +73,7 @@
         <md-input-container flex="nogrow" layout="row" layout-align="start start" class="action-buttons">
             <!-- Execute action button -->
             <md-button class="md-raised md-primary has-progress"
+                       id="send-request"
                        ng-click="requestHeader.prepareDataAndExecute(
                             main.modulesTreeDisplayed() ? main.leftPanelShowModule : null
                        )">
@@ -75,16 +81,17 @@
             </md-button>
 
             <!-- Save request -->
-            <md-button class="md-raised md-warn" ng-click="requestHeader.saveRequestToCollection($event)">
+            <md-button class="md-raised md-warn" id="save-request" ng-click="requestHeader.saveRequestToCollection($event)">
                 {{'YANGMAN_SAVE' | translate}}
             </md-button>
 
             <!-- Parameters button -->
-            <md-button class="md-raised" ng-click="requestHeader.showParamsAdmin($event)">
+            <md-button class="md-raised" id="show-parameters" ng-click="requestHeader.showParamsAdmin($event)">
                 {{'YANGMAN_PARAMETERS' | translate}}
             </md-button>
 
             <!-- sub api custom functionality menu -->
+            <!-- todo: add ids for testing -->
             <md-menu ng-show="selectedSubApi.custFunct.length || requestHeader.selectedPluginsButtons.length">
                 <md-button aria-label="Open demo menu" class="md-icon-button" ng-click="$mdOpenMenu($event)">
                     <md-icon md-font-set="material-icons">more_vert</md-icon>
@@ -121,11 +128,11 @@
                         layout="row"
                         layout-align="start center"
                         ng-change="requestHeader.changeDataType()">
-            <md-radio-button value="form" aria-label="{{'YANGMAN_FORM' | translate}}">
+            <md-radio-button id="shown-data-type-form" value="form" aria-label="{{'YANGMAN_FORM' | translate}}">
                 {{'YANGMAN_FORM' | translate}}
             </md-radio-button>
 
-            <md-radio-button value="req-data" aria-label="{{'YANGMAN_JSON' | translate}}">
+            <md-radio-button id="shown-data-type-json" value="req-data" aria-label="{{'YANGMAN_JSON' | translate}}">
                 {{'YANGMAN_JSON' | translate}}
             </md-radio-button>
         </md-radio-group>
@@ -139,10 +146,10 @@
             <!-- Status -->
             <span flex="30">
                 {{'YANGMAN_STATUS' | translate}}:
-                <span ng-if="requestHeader.statusObj && requestHeader.statusObj.statusText">
+                <span id="info-request-status" ng-if="requestHeader.statusObj && requestHeader.statusObj.statusText">
                     {{requestHeader.statusObj.status}} {{requestHeader.statusObj.statusText}}
                 </span>
-                <span ng-if="!(requestHeader.statusObj && requestHeader.statusObj.statusText)">
+                <span id="info-request-status" ng-if="!(requestHeader.statusObj && requestHeader.statusObj.statusText)">
                     ...
                 </span>
             </span>
@@ -150,10 +157,10 @@
             <!-- Request time -->
             <span flex="30">
                 {{'YANGMAN_TIME' | translate}}:
-                <span ng-if="requestHeader.statusObj && requestHeader.statusObj.time">
+                <span id="info-request-execution-time" ng-if="requestHeader.statusObj && requestHeader.statusObj.time">
                     {{requestHeader.statusObj.time}} ms
                 </span>
-                <span ng-if="!(requestHeader.statusObj && requestHeader.statusObj.time)">
+                <span id="info-request-execution-time" ng-if="!(requestHeader.statusObj && requestHeader.statusObj.time)">
                     ...
                 </span>
             </span>
-- 
2.36.6