Merge pull request #4 from flotiq/feature/add-detached-event-listener

add detached event listener

Author: rgembalik

README.md Readme.mdREADME.md renamed to Readme.md

@@ -1,35 +1,24 @@
 const appRoots = {};
 
-export const onElementRemoved = (element, callback) => {
-  new MutationObserver(function () {
-    if (!document.contains(element)) {
-      callback();
-      this.disconnect();
-    }
-  }).observe(element.parentElement, { childList: true });
-};
-
 export const addElementToCache = (element, key, data = {}) => {
   appRoots[key] = {
     element,
     data,
   };
 
-  element.addEventListener(
-    'flotiq.attached',
-    () => onElementRemoved(element, () => delete appRoots[key]),
-    true,
+  setTimeout(
+    () =>
+      element.addEventListener('flotiq.detached', () => {
+        delete appRoots[key];
+      }),
+    50,
   );
 };
 
 export const getCachedElement = (key) => {
   return appRoots[key];
 };
 
-export const removeCachedElement = (key) => {
-  delete appRoots[key];
-};
-
 export const registerFn = (pluginInfo, callback) => {
   if (window.FlotiqPlugins?.add) {
     window.FlotiqPlugins.add(pluginInfo, callback);

common/plugin-element-cache.js

@@ -2,7 +2,7 @@
   "id": "flotiq.deploy-netlify",
   "name": "Deploy Netlify",
   "description": "Integration with Netlify deploy. With this plugin, you can easily trigger Netlify builds within Content Object changes on form submission. You will also be able to quickly navigate to your Netlify pages from the Flotiq content editor.",
-  "version": "1.1.1",
+  "version": "1.1.2",
   "repository": "https://github.com/flotiq/flotiq-ui-plugin-deploy-netlify",
   "url": "https://localhost:3053/index.js",
   "permissions": []