picking up new wrc version and refactoring searchModel event code

Author: robertpatrick

webui/package-lock.json

@@ -106,6 +106,22 @@ define(['ojs/ojcontext'],
         const busyContext = ojContext.getContext(component).getBusyContext();
         return busyContext.whenReady();
       };
+
+      this.getEventRootElement = () => {
+        return document.getElementById('pageContent');
+      };
+
+      this.dispatchEventFromRootElement = (customEvent) => {
+        this.getEventRootElement().dispatchEvent(customEvent);
+      };
+
+      this.addEventListenerToRootElement = (eventType, listener, options) => {
+        this.getEventRootElement().addEventListener(eventType, listener, options);
+      };
+
+      this.removeEventListenerFromRootElement = (eventType, listener, options) => {
+        this.getEventRootElement().removeEventListener(eventType, listener, options);
+      };
     }
 
     return new ViewHelper();

webui/src/js/utils/view-helper.js

@@ -16,7 +16,6 @@ function(accUtils, i18n, ko, project, urlCatalog, viewHelper, wktLogger, jsYaml,
     this.dataProvider = {};
     this.disableStartButton = ko.observable(false);
     this.wrcBackendTriggerChange = false;
-    this.searchModelElement = undefined;
 
     this.connected = () => {
       accUtils.announce('Model design view loaded.', 'assertive');
@@ -52,14 +51,7 @@ function(accUtils, i18n, ko, project, urlCatalog, viewHelper, wktLogger, jsYaml,
         }
       }
 
-      const element = document.getElementById('modelDesignSearchInput');
-      if (element) {
-        wktLogger.debug('Found modelDesignSearchInput');
-        this.searchModelElement = element;
-        this.searchModelElement.addEventListener('searchModel', this.handleSearchModelEvent);
-      } else {
-        wktLogger.error('Failed to find modelDesignSearchInput');
-      }
+      viewHelper.addEventListenerToRootElement('searchModel', this.handleSearchModelEvent);
     };
 
     this.disconnected = function() {
@@ -72,9 +64,7 @@ function(accUtils, i18n, ko, project, urlCatalog, viewHelper, wktLogger, jsYaml,
         this.designer.deactivateProvider(this.dataProvider);
       }
 
-      if (this.searchModelElement) {
-        this.searchModelElement.removeEventListener('searchModel', this.handleSearchModelEvent);
-      }
+      viewHelper.removeEventListenerFromRootElement('searchModel', this.handleSearchModelEvent);
     };
 
     this.labelMapper = (labelId, payload) => {
@@ -255,7 +245,7 @@ function(accUtils, i18n, ko, project, urlCatalog, viewHelper, wktLogger, jsYaml,
 
     this.handleSearchModelEvent = (event) => {
       const searchModelText = event.detail.value;
-      wktLogger.debug('received searchModel event: %s', searchModelText);
+      wktLogger.debug('model-design-view received searchModel event: %s', searchModelText);
 
       // Once the WRC change is available, call the method to pass the search text and return.
       //

webui/src/js/viewModels/model-design-view.js

@@ -5,7 +5,7 @@
  */
 define([],
   function () {
-    function ModelPageImpl(args, accUtils, ko, i18n, ModuleRouterAdapter, ArrayDataProvider, validator, preparer) {
+    function ModelPageImpl(args, accUtils, ko, i18n, ModuleRouterAdapter, ArrayDataProvider, validator, preparer, viewHelper, wktLogger) {
 
       this.connected = () => {
         accUtils.announce('Model page loaded.', 'assertive');
@@ -59,12 +59,15 @@ define([],
       this.searchModel = () => {
         const searchModelElement = document.getElementById('modelDesignSearchInput');
         if (searchModelElement && searchModelElement.value) {
+          wktLogger.debug('found modelDesignSearchInput with value %s', searchModelElement.value);
           const payload = {
+            bubbles: true,
             detail: {
               value: searchModelElement.value
             }
           };
-          searchModelElement.dispatchEvent(new CustomEvent('searchModel', payload));
+          wktLogger.debug('dispatched searchModel event with payload %s', payload);
+          viewHelper.dispatchEventFromRootElement(new CustomEvent('searchModel', payload));
         }
       };
     }

webui/src/js/viewModels/model-page-impl.js

@@ -4,10 +4,10 @@
  * Licensed under The Universal Permissive License (UPL), Version 1.0 as shown at https://oss.oracle.com/licenses/upl/
  */
 define(['viewModels/model-page-impl', 'accUtils', 'knockout', 'utils/i18n', 'ojs/ojmodulerouter-adapter',
-  'ojs/ojarraydataprovider', 'utils/wdt-validator', 'utils/wdt-preparer'],
-function (impl, accUtils, ko, i18n, ModuleRouterAdapter, ArrayDataProvider, validator, preparer) {
+  'ojs/ojarraydataprovider', 'utils/wdt-validator', 'utils/wdt-preparer', 'utils/view-helper', 'utils/wkt-logger'],
+function (impl, accUtils, ko, i18n, ModuleRouterAdapter, ArrayDataProvider, validator, preparer, viewHelper, wktLogger) {
   function ModelPage(args) {
-    return new impl(args, accUtils, ko, i18n, ModuleRouterAdapter, ArrayDataProvider, validator, preparer);
+    return new impl(args, accUtils, ko, i18n, ModuleRouterAdapter, ArrayDataProvider, validator, preparer, viewHelper, wktLogger);
   }
 
   return ModelPage;