#15 - Destroy flow documentation + test

fredevery · fredevery · commit e537ae95f144 · 2018-08-20T20:54:46.000+02:00
diff --git a/README.md b/README.md
@@ -29,7 +29,10 @@ Setting up Typester on your page is as easy as:
 ```
 import Typester from 'typester-editor'
 
-new Typester({ el: document.querySelector('[contenteditable]') }) // Where document.querySelector(...) is a single DOM element.
+const typesterInstance = new Typester({ el: document.querySelector('[contenteditable]') }) // Where document.querySelector(...) is a single DOM element.
+
+// If you need to tear down for any reason:
+typesterInstance.destroy();
 ```
 
 ### Configuration
diff --git a/test/e2e/app/index.html b/test/e2e/app/index.html
@@ -5,11 +5,12 @@
   </head>
   <body>
       <div id='content-editable' class='content-editable' style='margin-top: 200px'></div>
+      <a class='destroy-control'>Destroy</a>
       <script src='/js/typester.js'></script>
       <script>
         console.log('Typester')
         console.log(Typester);
-        new Typester({
+        window.typesterInstance = new Typester({
             el: document.getElementById('content-editable')
         });
       </script>
diff --git a/test/e2e/test/pages/index.js b/test/e2e/test/pages/index.js
@@ -174,6 +174,24 @@ var pageCommands = {
         }, [], function (response) {
             console.log(response);
         });
+        return this;
+    },
+
+    destroy: function () {
+        var api = this.api;
+
+        api.execute(function () {
+            try {
+                window.typesterInstance.destroy();
+                return 'Destroyed!';
+            } catch (e) {
+                return e.message;
+            }
+        }, [], function (response) {
+            console.log('Destroy:');
+            console.log(response);
+        });
+
         return this;
     }
 };
diff --git a/test/e2e/test/specs/core/core.js b/test/e2e/test/specs/core/core.js
@@ -12,5 +12,16 @@ module.exports = {
             .waitForElementPresent('.typester-canvas', 1000)
             .assert.attributeEquals('.content-editable', 'contenteditable', 'true')
             .end();
+    },
+
+    'Destroy': function (browser) {
+        var page = browser.page.index();
+
+        page.navigate()
+            .assert.elementPresent('.typester-toolbar')
+            .assert.elementPresent('.typester-canvas')
+            .destroy()
+            .assert.elementNotPresent('.typester-toolbar')
+            .assert.elementNotPresent('.typester-canvas');
     }
 };
