From b54ee2257e77c15905048b47ef73676cfff34654 Mon Sep 17 00:00:00 2001
From: Victor Woeltjen <victor.woeltjen@nasa.gov>
Date: Wed, 20 Dec 2017 13:32:07 -0800
Subject: [PATCH] [Layout] Don't use class name to query by id

...since ids may be invalid class names. Instead, use a data attribute. Fixes #1846
---
 platform/features/layout/res/templates/layout.html    | 3 ++-
 platform/features/layout/src/LayoutController.js      | 2 +-
 platform/features/layout/test/LayoutControllerSpec.js | 4 ++--
 3 files changed, 5 insertions(+), 4 deletions(-)

diff --git a/platform/features/layout/res/templates/layout.html b/platform/features/layout/res/templates/layout.html
index 36d9431258..fa8cf59be2 100644
--- a/platform/features/layout/res/templates/layout.html
+++ b/platform/features/layout/res/templates/layout.html
@@ -36,7 +36,8 @@
              ng-style="{ 'background-size': '100% ' + controller.getGridSize() [1] + 'px' }"></div>
     </div>
 
-    <div class="abs frame t-frame-outer child-frame panel s-selectable s-moveable s-hover-border {{childObject.getId() + '-' + $id}} t-object-type-{{ childObject.getModel().type }}"
+    <div class="abs frame t-frame-outer child-frame panel s-selectable s-moveable s-hover-border t-object-type-{{ childObject.getModel().type }}"
+         data-layout-id="{{childObject.getId() + '-' + $id}}"
          ng-class="{ 'no-frame': !controller.hasFrame(childObject), 's-drilled-in': controller.isDrilledIn(childObject) }"
          ng-repeat="childObject in composition"
          ng-init="controller.selectIfNew(childObject.getId() + '-' + $id, childObject)"
diff --git a/platform/features/layout/src/LayoutController.js b/platform/features/layout/src/LayoutController.js
index aff192a6a3..e5b47b22d8 100644
--- a/platform/features/layout/src/LayoutController.js
+++ b/platform/features/layout/src/LayoutController.js
@@ -515,7 +515,7 @@ define(
         LayoutController.prototype.selectIfNew = function (selector, domainObject) {
             if (domainObject.getId() === this.droppedIdToSelectAfterRefresh) {
                 setTimeout(function () {
-                    $('.' + selector)[0].click();
+                    $('[data-layout-id="' + selector + '"]')[0].click();
                     delete this.droppedIdToSelectAfterRefresh;
                 }.bind(this), 0);
             }
diff --git a/platform/features/layout/test/LayoutControllerSpec.js b/platform/features/layout/test/LayoutControllerSpec.js
index f6b16c052f..f8b9d9bce5 100644
--- a/platform/features/layout/test/LayoutControllerSpec.js
+++ b/platform/features/layout/test/LayoutControllerSpec.js
@@ -475,11 +475,11 @@ define(
                 );
 
                 var childObj = mockDomainObject("d");
-                var testElement = $("<div class='some-class'></div>");
+                var testElement = $("<div data-layout-id='some-id'></div>");
                 $element.append(testElement);
                 spyOn(testElement[0], 'click');
 
-                controller.selectIfNew('some-class', childObj);
+                controller.selectIfNew('some-id', childObj);
                 jasmine.Clock.tick(0);
 
                 expect(testElement[0].click).toHaveBeenCalled();