#15 - Expose a destroy method to allow for global teardown

fredevery · fredevery · commit 1f814daa86fa · 2018-08-20T15:17:36.000+02:00
diff --git a/src/scripts/containers/AppContainer.js b/src/scripts/containers/AppContainer.js
@@ -116,6 +116,15 @@ const AppContainer = Container({
          */
         handleBlur () {
             // Should the container require to do anything in particular here
+        },
+
+        /**
+         * Destroy the entire Typeset instance
+         * @func destroy
+         */
+        destroy () {
+            const { mediator } = this;
+            mediator.emit('app:destroy');
         }
     }
 });
diff --git a/src/scripts/core/Container.js b/src/scripts/core/Container.js
@@ -166,7 +166,9 @@ const Container = function Container(containerObj) {
             return {
                 setMediatorParent (parentMediator) {
                     mediator.setParent(parentMediator);
-                }
+                },
+
+                destroy: boundMethods.destroy
             };
         }
     };
diff --git a/test/server/html/index.html b/test/server/html/index.html
@@ -61,7 +61,10 @@
     </head>
     <body>
         <div class='header'>
-          <h1>Typester test server</h1>
+          <h1>
+            Typester test server
+            <button class='destroy-btn'>Destroy</button>
+          </h1>
           <div class='inspector-tools'>
             <a class='inspect-content' data-target-inspector='content'>Inspect Content</a>
             <a class='inspect-canvas' data-target-inspector='canvas'>Inspect Canvas</a>
@@ -114,7 +117,7 @@ <h1>Typester test server</h1>
         <script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/highlight.min.js"></script>
         <script>
           const contentEditable = document.getElementById('content-editable');
-          new Typester({
+          const typesterInstance = new Typester({
               el: contentEditable,
               configs: {
                 // toolbar: {
@@ -130,6 +133,7 @@ <h1>Typester test server</h1>
                 }
               }
           });
+          console.log(typesterInstance);
         </script>
 
         <script>
@@ -138,6 +142,7 @@ <h1>Typester test server</h1>
 
               const contentInspector = document.getElementById('content-inspector');
               const inspectorTools = document.querySelectorAll('.inspector-tools a');
+              const destroyBtn = document.querySelector('.destroy-btn');
 
               inspectorTools.forEach(function (inspectorTool, index) {
                 if (index === 0) {
@@ -230,7 +235,10 @@ <h1>Typester test server</h1>
               editorObserver.observe(contentEditable, observerConfig);
               canvasObserver.observe(document.querySelector('.typester-canvas'), observerConfig);
               updateInspector();
-              // requestAnimationFrame(updateInspector);
+
+              destroyBtn.addEventListener('click', function () {
+                typesterInstance.destroy();
+              });
           })();
         </script>
     </body>
