Fix for the broken header's dropdowns for both v0.11.2 and v0.13

The dropdownToggle directive from angular-ui/bootstrap v0.11.2
conflicts with the native Bootstrap data-toggle="dropdown" attribute
(see https:github.com/angular-ui/bootstrap/issues/2156). This is fixed
in 0.13, but before that it'd be valuable to ensure that the same html
markup works the same way with both versions of angular-ui/bootstrap
(0.11.2 and 0.13). The decorator code could be safely deleted once
Horizon migrates to angular-ui/bootstrap v0.13.

Also fix dropdowns in material theme templates.

Closes-Bug: #1466146
Change-Id: I8f01c1ce7b0a5dc29bf9d8aba23c9ea7e6e1ec35

horizon/static/framework/framework.module.js

@@ -10,13 +10,14 @@
     .config(config);
 
   config.$inject = [
+    '$injector',
     '$provide',
     '$interpolateProvider',
     '$httpProvider',
     '$windowProvider'
   ];
 
-  function config($provide, $interpolateProvider, $httpProvider, $windowProvider) {
+  function config($injector, $provide, $interpolateProvider, $httpProvider, $windowProvider) {
 
     var path = $windowProvider.$get().STATIC_URL + 'framework/';
     $provide.constant('horizon.framework.basePath', path);
@@ -32,6 +33,25 @@
     $httpProvider.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';
     $httpProvider.defaults.headers.common['Content-Type'] = 'application/json;charset=utf-8';
 
+    // NOTE(tsufiev): angular-ui/bootstrap v0.11.2 dropdownToggle directive
+    // conflicts with the native Bootstrap data-toggle="dropdown" attribute
+    // (see https://github.com/angular-ui/bootstrap/issues/2156).
+    // This is fixed in 0.13, but before that it'd be valuable to ensure that
+    // the same html markup works the same way with both versions of
+    // angular-ui/bootstrap (0.11.2 and 0.13). Could be safely deleted once
+    // Horizon migrates to angular-ui/bootstra v0.13
+    if ($injector.has('dropdownToggleDirective')) {
+      $provide.decorator('dropdownToggleDirective', patchDropdowns);
+    }
+
+    patchDropdowns.$inject = ['$delegate'];
+
+    function patchDropdowns($delegate) {
+      var directive = $delegate[0];
+      directive.restrict = 'A';
+      return $delegate;
+    }
+
     // Global http error handler
     // if user is not authorized, log user out
     // this can happen when session expires

horizon/templates/horizon/common/_region_selector.html

@@ -1,5 +1,5 @@
 {% if regions.support %}
-  <a href="#" class="dropdown-toggle" role="button" aria-expanded="false">
+  <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">
     {{ regions.current.name }}
     <span class="fa fa-caret-down"></span>
   </a>

openstack_dashboard/templates/_header.html

@@ -20,7 +20,7 @@
     <div class="collapse navbar-collapse" id="navbar-collapse">
       <ul class="nav navbar-nav">
         <li class="dropdown">
-          <a href="#" class="dropdown-toggle" role="button" aria-expanded="false">
+          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">
             {% show_overview %}
             <span class="fa fa-caret-down"></span>
           </a>
@@ -54,7 +54,7 @@
 
       <ul class="nav navbar-nav navbar-right">
         <li class="dropdown">
-          <a href="#" class="dropdown-toggle" role="button" aria-expanded="false">
+          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">
             <span class="fa fa-user"></span>
             {{ request.user.username }}
             <span class="fa fa-caret-down"></span>

openstack_dashboard/themes/material/templates/_header.html

@@ -29,7 +29,7 @@
     <div class="collapse navbar-collapse" id="navbar-collapse">
       <ul class="nav navbar-nav">
         <li class="dropdown">
-          <a href="#" class="dropdown-toggle" role="button" aria-expanded="false">
+          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">
             {% show_overview %}
             <span class="fa fa-caret-down"></span>
           </a>
@@ -63,7 +63,7 @@
 
       <ul class="nav navbar-nav navbar-right">
         <li class="dropdown">
-          <a href="#" class="dropdown-toggle" role="button" aria-expanded="false">
+          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">
             <span class="fa fa-user"></span>
             {{ request.user.username }}
             <span class="fa fa-caret-down"></span>