Reload microfrontend when clicking on selected node (SAP#385)

* triggering iframe reload when the same route is accessed again
stanleychh · Jan 31, 2019 · e7e5677 · e7e5677
1 parent fe051b4
commit e7e5677
Show file tree

Hide file tree

Showing 3 changed files with 23 additions and 6 deletions.
diff --git a/core/src/services/iframe.js b/core/src/services/iframe.js
@@ -124,3 +124,9 @@ export const navigateIframe = (config, component, node) => {
     }, iframeNavFallbackTimeout);
   }
 };
+
+export const reloadActiveIframe = () => {
+  IframeHelpers.getVisibleIframes()
+    .pop()
+    .contentDocument.location.reload(true);
+};
diff --git a/core/src/services/routing.js b/core/src/services/routing.js
@@ -36,16 +36,18 @@ export const concatenatePath = (basePath, relativePath) => {
 
 /**
   navigateTo used for navigation
+  Triggers a frame reload if we are on the same route (eg. if we click on same navigation item again)
   @param route string  absolute path of the new route
  */
 export const navigateTo = async route => {
-  if (LuigiConfig.getConfigValue('routing.useHashRouting')) {
-    window.location.hash = route;
+  const windowPath = GenericHelpers.trimLeadingSlash(getWindowPath());
+  if (windowPath === GenericHelpers.trimLeadingSlash(route)) {
+    Iframe.reloadActiveIframe();
     return;
   }
 
-  // Avoid infinite loop on logout + login whith path routing
-  if (window.location.pathname === route) {
+  if (LuigiConfig.getConfigValue('routing.useHashRouting')) {
+    window.location.hash = route;
     return;
   }
 
@@ -71,10 +73,13 @@ export const navigateTo = async route => {
   window.dispatchEvent(event);
 };
 
-export const buildFromRelativePath = node => {
-  let windowPath = LuigiConfig.getConfigValue('routing.useHashRouting')
+const getWindowPath = () =>
+  LuigiConfig.getConfigValue('routing.useHashRouting')
     ? GenericHelpers.getPathWithoutHash(window.location.hash)
     : window.location.pathname;
+
+export const buildFromRelativePath = node => {
+  let windowPath = getWindowPath();
   if (node.parent && node.parent.pathSegment) {
     // use only this part of the current path that refers to the parent of the node (remove additional parts refering to the sibiling)
     // remove everything that is after the parents pathSegment 'parent/keepSelectedForChildren/something' -> 'parent'

diff --git a/core/src/utilities/helpers/iframe-helpers.js b/core/src/utilities/helpers/iframe-helpers.js
@@ -98,3 +98,9 @@ export const getLocation = url => {
   element.href = url;
   return element.origin;
 };
+
+export const getVisibleIframes = () => {
+  return Array.prototype.slice
+    .call(document.querySelectorAll('iframe'))
+    .filter(item => item.style.display !== 'none');
+};