Fixes #24320 - stop dropping vmware fields

Revert "Fixes #23290 - Unmount components before dom-update" This reverts commit b976723. (cherry picked from commit e1e37f1)
theforeman · Aug 1, 2018 · 399f176 · 399f176
1 parent 117cef4
commit 399f176
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 38 deletions.
diff --git a/app/assets/javascripts/host_edit.js b/app/assets/javascripts/host_edit.js
@@ -139,9 +139,6 @@ function submit_with_all_params(){
   clear_errors();
   animate_progress();
 
-  // clean the dom from react components before replacing the dom-content
-  tfm.reactMounter.unmountComponents('#content');
-
   $.ajax({
     type:'POST',
     url: url,

diff --git a/webpack/assets/javascripts/react_app/common/MountingService.js b/webpack/assets/javascripts/react_app/common/MountingService.js
@@ -7,46 +7,21 @@ import componentRegistry from '../components/componentRegistry';
 
 export { default as registerReducer } from '../redux/reducers/registerReducer';
 
-let mountedNodesCache = [];
+const mountedNodes = [];
 
 // In order to support turbolinks with react, need to
 // unmount all root components before turbolinks do the unload
 // TODO: remove it when migrating into (webpacker-react or react-rails)
-document.addEventListener('page:before-unload', () => unmountComponents());
+document.addEventListener('page:before-unload', () => {
+  let node = mountedNodes.shift();
 
-const unmountComponentsByNodes = nodes =>
-  nodes.forEach(node => ReactDOM.unmountComponentAtNode(node));
-
-/**
- * Will unmount all react-components from the dom
- * @param  {string} selector unmount component inside the selector
- * @return {number}          amount of unmounted nodes
- */
-export const unmountComponents = (selector) => {
-  const nodesToUnmount = [];
-  const nodesToKeep = [];
-
-  if (selector) {
-    const reactNode = document.querySelector(selector);
-
-    mountedNodesCache.forEach((node) => {
-      if (reactNode.contains(node)) {
-        nodesToUnmount.push(node);
-      } else {
-        nodesToKeep.push(node);
-      }
-    });
-  } else {
-    nodesToUnmount.push(...mountedNodesCache);
+  while (node) {
+    ReactDOM.unmountComponentAtNode(node);
+    node = mountedNodes.shift();
   }
+});
 
-  unmountComponentsByNodes(nodesToUnmount);
-  mountedNodesCache = nodesToKeep;
-
-  return nodesToUnmount.length;
-};
-
-export const mount = (component, selector, data) => {
+export function mount(component, selector, data) {
   const reactNode = document.querySelector(selector);
 
   if (reactNode) {
@@ -56,9 +31,9 @@ export const mount = (component, selector, data) => {
       reactNode,
     );
 
-    mountedNodesCache.push(reactNode);
+    mountedNodes.push(reactNode);
   } else {
     // eslint-disable-next-line no-console
     console.log(`Cannot find '${selector}' element for mounting the '${component}'`);
   }
-};
+}