[5.x] [draggable] continue to work when debug info is disabled (elast…

…ic#9250)

Backports PR elastic#9167

**Commit 1:**
[draggable] continue to work when debug info is disabled

* Original sha: 7bed6e8
* Authored by spalger <[email protected]> on 2016-11-19T00:53:28Z

src/core_plugins/kibana/public/visualize/editor/draggable_container.js

@@ -7,19 +7,26 @@ uiModules
 .get('app/visualize')
 .directive('draggableContainer', function () {
 
+  const $scopes = new WeakMap();
+
   return {
     restrict: 'A',
     scope: true,
     controllerAs: 'draggableContainerCtrl',
-    controller($scope, $attrs, $parse) {
+    controller($scope, $attrs, $parse, $element) {
+      $scopes.set($element.get(0), $scope);
+      this.linkDraggableItem = (el, $scope) => {
+        $scopes.set(el, $scope);
+      };
+
       this.getList = () => $parse($attrs.draggableContainer)($scope);
     },
     link($scope, $el, attr) {
       const drake = dragula({
         containers: $el.toArray(),
         moves(el, source, handle) {
-          const itemScope = $(el).scope();
-          if (!('draggableItemCtrl' in itemScope)) {
+          const itemScope = $scopes.get(el);
+          if (!itemScope || !('draggableItemCtrl' in itemScope)) {
             return; // only [draggable-item] is draggable
           }
           return itemScope.draggableItemCtrl.moves(handle);
@@ -53,21 +60,24 @@ uiModules
 
       function markDragging(isDragging) {
         return el => {
-          const scope = $(el).scope();
+          const scope = $scopes.get(el);
+          if (!scope) return;
           scope.isDragging = isDragging;
           scope.$apply();
         };
       }
 
       function forwardEvent(type, el, ...args) {
         const name = `drag-${prettifiedDrakeEvents[type] || type}`;
-        const scope = $(el).scope();
+        const scope = $scopes.get(el);
+        if (!scope) return;
         scope.$broadcast(name, el, ...args);
       }
 
       function drop(el, target, source, sibling) {
         const list = $scope.draggableContainerCtrl.getList();
-        const itemScope = $(el).scope();
+        const itemScope = $scopes.get(el);
+        if (!itemScope) return;
         const item = itemScope.draggableItemCtrl.getItem();
         const fromIndex = list.indexOf(item);
         const siblingIndex = getItemIndexFromElement(list, sibling);
@@ -91,7 +101,8 @@ uiModules
       function getItemIndexFromElement(list, element) {
         if (!element) return -1;
 
-        const scope = $(element).scope();
+        const scope = $scopes.get(element);
+        if (!scope) return;
         const item = scope.draggableItemCtrl.getItem();
         const index = list.indexOf(item);
 

src/core_plugins/kibana/public/visualize/editor/draggable_item.js

@@ -23,7 +23,8 @@ uiModules
         return movable;
       };
     },
-    link($scope, $el, attr) {
+    link($scope, $el, attr, draggableController) {
+      draggableController.linkDraggableItem($el.get(0), $scope);
     }
   };
 });