refactor(ui): add IDs to sidebar menu and dash-groups on dash page
To ensure easier resolution of sidebar entries for automated testing, add HTML IDs to all links.
Fixes
MODIFY
manager/ui/war/plugins/api-manager/html/dash.html
manager/ui/war/plugins/api-manager/html/dash.html
<div class="row">
<div class="col-md-12" id="dash-container">
- <div class="dash-group">
+ <div class="dash-group" id="apiman-dash-orgs">
<div class="title">
<i class="fa fa-shield"></i>
<span apiman-i18n-key="organizations">Organizations</span>
</div>
<div class="actions">
<ul>
- <li ng-hide="noCreateOrg"><a id="org-new" href="{{ pluginName }}/new-org" apiman-i18n-key="actions.create-new-org" data-field="createOrg">Create a New Organization</a></li>
- <li><a id="org-my-orgs" href="{{ pluginName }}/users/{{ currentUser.username }}/orgs" apiman-i18n-key="actions.my-orgs" data-field="myOrgs">Go to My Organizations</a></li>
- <li><a id="org-browse" href="{{ pluginName }}/browse/orgs" apiman-i18n-key="actions.browse-orgs" data-field="browseOrgs">Browse/Find an Organization</a></li>
+ <li ng-hide="noCreateOrg"><a id="apiman-dash-orgs-new" href="{{ pluginName }}/new-org" apiman-i18n-key="actions.create-new-org" data-field="createOrg">Create a New Organization</a></li>
+ <li><a id="apiman-dash-orgs-my-orgs" href="{{ pluginName }}/users/{{ currentUser.username }}/orgs" apiman-i18n-key="actions.my-orgs" data-field="myOrgs">Go to My Organizations</a></li>
+ <li><a id="apiman-dash-orgs-browse" href="{{ pluginName }}/browse/orgs" apiman-i18n-key="actions.browse-orgs" data-field="browseOrgs">Browse/Find an Organization</a></li>
</ul>
</div>
</div>
- <div class="dash-group pull-right">
+ <div class="dash-group pull-right" id="apiman-dash-apis">
<div class="title">
<i class="fa fa-puzzle-piece"></i>
<span apiman-i18n-key="apis">APIs</span>
</div>
<div class="actions">
<ul>
- <li><a id="apis-manage" href="{{ pluginName }}/users/{{ currentUser.username }}/apis" apiman-i18n-key="actions.my-apis">Manage My APIs</a></li>
- <li><a id="api-new" href="{{ pluginName }}/new-api" apiman-i18n-key="actions.create-api">Create a New API</a></li>
- <li><a id="api-catalog" href="{{ pluginName }}/catalog/api-catalog" apiman-i18n-key="actions.browse-importable-apis">Browse available/importable APIs</a></li>
+ <li><a id="apiman-dash-apis-manage" href="{{ pluginName }}/users/{{ currentUser.username }}/apis" apiman-i18n-key="actions.my-apis">Manage My APIs</a></li>
+ <li><a id="apiman-dash-apis-new" href="{{ pluginName }}/new-api" apiman-i18n-key="actions.create-api">Create a New API</a></li>
+ <li><a id="apiman-dash-apis-catalog" href="{{ pluginName }}/catalog/api-catalog" apiman-i18n-key="actions.browse-importable-apis">Browse available/importable APIs</a></li>
</ul>
</div>
</div>
- <div class="dash-group">
+ <div class="dash-group" id="apiman-dash-clients">
<div class="title">
<i class="fa fa-gears"></i>
<span apiman-i18n-key="clients">Client Apps</span>
</div>
<div class="actions">
<ul>
- <li><a id="clients-manage" href="{{ pluginName }}/users/{{ currentUser.username }}/clients" apiman-i18n-key="actions.my-clients" data-field="myClients">Manage My Client Apps</a></li>
- <li><a id="clients-new" href="{{ pluginName }}/new-client" apiman-i18n-key="actions.new-client" data-field="createClient">Create a New Client App</a></li>
- <li><a id="apis-consume" href="{{ pluginName }}/browse/apis" apiman-i18n-key="actions.find-api">Find/Consume an API</a></li>
+ <li><a id="apiman-dash-clients-manage" href="{{ pluginName }}/users/{{ currentUser.username }}/clients" apiman-i18n-key="actions.my-clients" data-field="myClients">Manage My Client Apps</a></li>
+ <li><a id="apiman-dash-clients-new" href="{{ pluginName }}/new-client" apiman-i18n-key="actions.new-client" data-field="createClient">Create a New Client App</a></li>
+ <li><a id="apiman-dash-apis-consume" href="{{ pluginName }}/browse/apis" apiman-i18n-key="actions.find-api">Find/Consume an API</a></li>
</ul>
</div>
</div>
- <div class="dash-group dash-admin-group pull-right" data-field="adminDashPanel" ng-show="isAdmin">
+ <div class="dash-group dash-admin-group pull-right" id="apiman-dash-admin" data-field="adminDashPanel" ng-show="isAdmin">
<div class="title">
<i class="fa fa-gavel"></i>
<span apiman-i18n-key="system-administration">System Administration</span>
</div>
<div class="actions">
<ul>
- <li><a id="admin-roles" href="{{ pluginName }}/admin/roles" apiman-i18n-key="actions.manage-roles" data-field="manageRoles">Manage Roles/Permissions</a></li>
- <li><a id="admin-policyDefs" href="{{ pluginName }}/admin/policyDefs" apiman-i18n-key="actions.manage-policyDefs" data-field="managePolicyDefs">Manage Policy Definitions</a></li>
- <li><a id="admin-gateways" href="{{ pluginName }}/admin/gateways" apiman-i18n-key="actions.manage-gateways" data-field="manageGateways">Manage Gateways</a></li>
- <li><a id="admin-plugins" href="{{ pluginName }}/admin/plugins" apiman-i18n-key="actions.manage-plugins" data-field="managePlugins">Manage Plugins</a></li>
- <li><a id="admin-export" href="{{ pluginName }}/admin/export" apiman-i18n-key="export-import-data">Export/Import Data</a></li>
+ <li><a id="apiman-dash-admin-roles" href="{{ pluginName }}/admin/roles" apiman-i18n-key="actions.manage-roles" data-field="manageRoles">Manage Roles/Permissions</a></li>
+ <li><a id="apiman-dash-admin-policyDefs" href="{{ pluginName }}/admin/policyDefs" apiman-i18n-key="actions.manage-policyDefs" data-field="managePolicyDefs">Manage Policy Definitions</a></li>
+ <li><a id="apiman-dash-admin-gateways" href="{{ pluginName }}/admin/gateways" apiman-i18n-key="actions.manage-gateways" data-field="manageGateways">Manage Gateways</a></li>
+ <li><a id="apiman-dash-admin-plugins" href="{{ pluginName }}/admin/plugins" apiman-i18n-key="actions.manage-plugins" data-field="managePlugins">Manage Plugins</a></li>
+ <li><a id="apiman-dash-admin-export" href="{{ pluginName }}/admin/export" apiman-i18n-key="export-import-data">Export/Import Data</a></li>
</ul>
</div>
</div>

MODIFY
manager/ui/war/plugins/api-manager/html/headers/community.include
manager/ui/war/plugins/api-manager/html/headers/community.include
<ul class="list-group">
<!--APIs-->
- <li class="list-group-item secondary-nav-item-pf" data-target="#apis-secondary" ng-mouseover="onMouseEnter($event)" ng-mouseleave="onMouseLeave()">
+ <li class="list-group-item secondary-nav-item-pf" id="apiman-sidebar-apis" data-target="#apis-secondary" ng-mouseover="onMouseEnter($event)" ng-mouseleave="onMouseLeave()">
<a>
<span class="fa fa-puzzle-piece" data-toggle="tooltip" title="APIs"></span>
<span class="list-group-item-value" apiman-i18n-key="apis">APIs</span>
<span apiman-i18n-key="apis">APIs</span>
</div>
<ul class="list-group">
- <li class="list-group-item" data-target="#apis-my_apis-tertiary">
+ <li class="list-group-item" id="apiman-sidebar-apis-manage" data-target="#apis-my_apis-tertiary">
<a href="{{ pluginName }}/users/{{ username }}/apis">
<span class="list-group-item-value" apiman-i18n-key="actions.my-apis">My APIs</span>
</a>
</li>
- <li class="list-group-item" data-target="#apis-all_apis-tertiary">
+ <li class="list-group-item" id="apiman-sidebar-apis-consume" data-target="#apis-all_apis-tertiary">
<a href="{{ pluginName }}/browse/apis">
<span class="list-group-item-value" apiman-i18n-key="actions.find-api">All APIs</span>
</a>
</li>
- <li class="list-group-item" data-target="#apis-catalog-tertiary">
+ <li class="list-group-item" id="apiman-sidebar-apis-catalog" data-target="#apis-catalog-tertiary">
<a href="{{ pluginName }}/catalog/api-catalog">
<span class="list-group-item-value" apiman-i18n-key="actions.browse-importable-apis">API Catalog</span>
</a>
</li>
- <li class="list-group-item" data-target="#apis-new_api-tertiary">
+ <li class="list-group-item" id="apiman-sidebar-apis-new" data-target="#apis-new_api-tertiary">
<a href="{{ pluginName }}/new-api">
<span class="list-group-item-value" apiman-i18n-key="actions.create-api">New API</span>
</a>
</li>
<!--Clients-->
- <li class="list-group-item secondary-nav-item-pf" data-target="#clients-secondary" ng-mouseover="onMouseEnter($event)" ng-mouseleave="onMouseLeave()">
+ <li class="list-group-item secondary-nav-item-pf" id="apiman-sidebar-clients" data-target="#clients-secondary" ng-mouseover="onMouseEnter($event)" ng-mouseleave="onMouseLeave()">
<a>
<span class="fa fa-gears" data-toggle="tooltip" title="Clients"></span>
<span class="list-group-item-value" apiman-i18n-key="client-apps">Clients</span>
<span apiman-i18n-key="client-apps">Clients</span>
</div>
<ul class="list-group">
- <li class="list-group-item" data-target="#clients-my_clients-tertiary">
+ <li class="list-group-item" id="apiman-sidebar-clients-manage" data-target="#clients-my_clients-tertiary">
<a href="{{ pluginName }}/users/{{ username }}/clients">
<span class="list-group-item-value" apiman-i18n-key="actions.my-clients">My Clients</span>
</a>
</li>
- <li class="list-group-item" data-target="#apis-new_contract-tertiary">
+ <li class="list-group-item" id="apiman-sidebar-clients-new-contract" data-target="#apis-new_contract-tertiary">
<a href="{{ pluginName }}/new-contract">
<span class="list-group-item-value" apiman-i18n-key="actions.new-contract">New Contract</span>
</a>
</li>
- <li class="list-group-item" data-target="#apis-new_client-tertiary">
+ <li class="list-group-item" id="apiman-sidebar-clients-new" data-target="#apis-new_client-tertiary">
<a href="{{ pluginName }}/new-client">
<span class="list-group-item-value" apiman-i18n-key="actions.new-client">New Client</span>
</a>
</li>
<!--Organizations-->
- <li class="list-group-item secondary-nav-item-pf" data-target="#orgs-secondary" ng-mouseover="onMouseEnter($event)" ng-mouseleave="onMouseLeave()">
+ <li class="list-group-item secondary-nav-item-pf" id="apiman-sidebar-orgs" data-target="#orgs-secondary" ng-mouseover="onMouseEnter($event)" ng-mouseleave="onMouseLeave()">
<a>
<span class="fa fa-shield" data-toggle="tooltip" title="Organizations"></span>
<span class="list-group-item-value" apiman-i18n-key="organizations">Organizations</span>
<span apiman-i18n-key="organizations">Organizations</span>
</div>
<ul class="list-group">
- <li class="list-group-item" data-target="#clients-my_clients-tertiary">
+ <li class="list-group-item" id="apiman-sidebar-orgs-my-orgs" data-target="#clients-my_clients-tertiary">
<a href="{{ pluginName }}/users/{{ username }}/orgs">
<span class="list-group-item-value" apiman-i18n-key="actions.my-orgs">My Organizations</span>
</a>
</li>
- <li class="list-group-item" data-target="#apis-new_contract-tertiary">
+ <li class="list-group-item" id="apiman-sidebar-orgs-browse" data-target="#apis-new_contract-tertiary">
<a href="{{ pluginName }}/browse/orgs">
<span class="list-group-item-value" apiman-i18n-key="actions.browse-orgs">All Organizations</span>
</a>
</li>
- <li class="list-group-item" data-target="#apis-new_client-tertiary">
+ <li class="list-group-item" id="apiman-sidebar-orgs-new" data-target="#apis-new_client-tertiary">
<a href="{{ pluginName }}/new-org" ng-hide="noCreateOrg || !isAdmin">
<span class="list-group-item-value" apiman-i18n-key="actions.create-new-org">New Organization</span>
</a>
</li>
<!--Administration-->
- <li class="list-group-item secondary-nav-item-pf" data-target="#admin-secondary" ng-show="isAdmin" ng-mouseover="onMouseEnter($event)" ng-mouseleave="onMouseLeave()">
+ <li class="list-group-item secondary-nav-item-pf" id="apiman-sidebar-admin" data-target="#admin-secondary" ng-show="isAdmin" ng-mouseover="onMouseEnter($event)" ng-mouseleave="onMouseLeave()">
<a>
<span class="fa fa-gavel" data-toggle="tooltip" title="Administration"></span>
<span class="list-group-item-value" apiman-i18n-key="system-administration">Administration</span>
<span apiman-i18n-key="system-administration">Administration</span>
</div>
<ul class="list-group">
- <li class="list-group-item" data-target="#admin-manage_roles-tertiary">
+ <li class="list-group-item" id="apiman-sidebar-admin-roles" data-target="#admin-manage_roles-tertiary">
<a href="{{ pluginName }}/admin/roles">
<span class="list-group-item-value" apiman-i18n-key="actions.manage-roles">Manage Roles</span>
</a>
</li>
- <li class="list-group-item" data-target="#admin-manage_policies-tertiary">
+ <li class="list-group-item" id="apiman-sidebar-admin-policyDefs" data-target="#admin-manage_policies-tertiary">
<a href="{{ pluginName }}/admin/policyDefs">
<span class="list-group-item-value" apiman-i18n-key="actions.manage-policyDefs">Manage Policy Definitions</span>
</a>
</li>
- <li class="list-group-item" data-target="#admin-manage_gateway-tertiary">
+ <li class="list-group-item" id="apiman-sidebar-admin-gateways" data-target="#admin-manage_gateway-tertiary">
<a href="{{ pluginName }}/admin/gateways">
<span class="list-group-item-value" apiman-i18n-key="actions.manage-gateways">Manage Gateways</span>
</a>
</li>
- <li class="list-group-item" data-target="#admin-manage_plugins-tertiary">
+ <li class="list-group-item" id="apiman-sidebar-admin-plugins" data-target="#admin-manage_plugins-tertiary">
<a href="{{ pluginName }}/admin/plugins">
<span class="list-group-item-value" apiman-i18n-key="actions.manage-plugins">Manage Plugins</span>
</a>
</li>
- <li class="list-group-item" data-target="#admin-manage_export-tertiary">
+ <li class="list-group-item" id="apiman-sidebar-admin-export" data-target="#admin-manage_export-tertiary">
<a href="{{ pluginName }}/admin/export">
<span class="list-group-item-value" apiman-i18n-key="export-import-data">Export&sol;Import Data</span>
</a>

refactor(ui): add IDs to sidebar menu and dash-groups on dash page

To ensure easier resolution of sidebar entries for automated testing, add HTML IDs to all links.

Fixes #1559