tests for jsplumb gadget

dce6bd81 · Jérome Perrin · 906a44b6 · dce6bd81 · dce6bd81
Commit dce6bd81 authored Nov 21, 2014 by Jérome Perrin
Hide whitespace changes
Inline Side-by-side

Showing with 205 additions and 0 deletions

dream/platform/src/jsplumb/test.html dream/platform/src/jsplumb/test.html +17 -0

dream/platform/src/jsplumb/test.js dream/platform/src/jsplumb/test.js +188 -0

No files found.
--- a/dream/platform/src/jsplumb/test.html
+++ b/dream/platform/src/jsplumb/test.html
+<!doctype html>
+<html>
+  <head>
+    <meta charset="utf-8">
+    <link rel="stylesheet" href="../<%= copy.qunitcss.relative_dest %>">
+    <script src="../<%= copy.rsvp.relative_dest %>"></script>
+    <script src="../<%= copy.renderjs.relative_dest %>"></script>
+    <script src="../<%= copy.qunitjs.relative_dest %>"></script>
+    <script src="../<%= curl.jquery.relative_dest %>"></script>
+    <script src="test.js"></script>
+  </head>
+  <body>
+    <div id="qunit"></div>
+    <div id="qunit-fixture"></div>
+  </body>
+</html>
--- a/dream/platform/src/jsplumb/test.js
+++ b/dream/platform/src/jsplumb/test.js
+/*global rJS, JSON, QUnit, jQuery*/
+(function (rJS, JSON, QUnit, $) {
+  "use strict";
+  var start = QUnit.start,
+    stop = QUnit.stop,
+    test = QUnit.test,
+    equal = QUnit.equal,
+    sample_class_definition = {
+        "edge": {
+            "description": "Base definition for edge",
+            "properties": {
+                "_class": {
+                    "type": "string"
+                },
+                "destination": {
+                    "type": "string"
+                },
+                "name": {
+                    "type": "string"
+                },
+                "required": [
+                    "name",
+                    "_class",
+                    "source",
+                    "destination"
+                ],
+                "source": {
+                    "type": "string"
+                }
+            },
+            "type": "object"
+        },
+        "Example.Edge": {
+            "_class": "edge",
+            "allOf": [
+                {
+                    "$ref": "#edge"
+                },
+                {
+                    "properties": {
+                        "color": {
+                            "enum": [
+                                "red",
+                                "green",
+                                "blue"
+                            ]
+                        }
+                    }
+                }
+            ],
+            "description": "An example edge with a color property"
+        },
+        "Example.Node": {
+            "_class": "node",
+            "allOf": [
+                {
+                    "$ref": "#node"
+                },
+                {
+                    "properties": {
+                        "shape": {
+                            "type": "string"
+                        }
+                    }
+                }
+            ],
+            "description": "An example node with a shape property"
+        },
+        "node": {
+            "description": "Base definition for node",
+            "properties": {
+                "_class": {
+                    "type": "string"
+                },
+                "coordinate": {
+                    "properties": {
+                        "left": "number",
+                        "top": "number"
+                    },
+                    "type": "object"
+                },
+                "name": {
+                    "type": "string"
+                },
+                "required": [
+                    "name",
+                    "_class"
+                ]
+            },
+            "type": "object"
+        }
+    },
+    sample_graph = {
+      "edge": {
+        "edge1": {
+          "_class": "Example.Edge",
+          "source": "N1",
+          "destination": "N2",
+          "color": "blue"
+        }
+      },
+      "node": {
+        "N1": {
+          "_class": "Example.Node",
+          "name": "Node 1",
+          "shape": "square"
+        },
+        "N2": {
+          "_class": "Example.Node",
+          "name": "Node 2",
+          "shape": "circle"
+        }
+      }
+    },
+    sample_data_graph = JSON.stringify(
+      {class_definition: sample_class_definition, graph: sample_graph }),
+    sample_data_empty_graph = JSON.stringify(
+      {class_definition: sample_class_definition, graph: {node: {}, edge: {}} });
+  QUnit.config.testTimeout = 5000;
+  rJS(window).ready(function (g) {
+    test("Sample graph can be loaded and output is equal to input", function () {
+      var jsplumb_gadget;
+      stop();
+      g.declareGadget("./index.html", {
+        element: document.querySelector("#qunit-fixture")
+      })
+        .then(function (new_gadget) {
+          jsplumb_gadget = new_gadget;
+          return jsplumb_gadget.render(sample_data_graph);
+        })
+        .then(function () {
+          return jsplumb_gadget.getContent();
+        })
+        .then(function (content) {
+          equal(content, sample_data_graph);
+        })
+        .fail(console.error.bind(this))
+        .always(start);
+    });
+    test("New node can be drag & dropped", function () {
+      var jsplumb_gadget;
+      stop();
+      g.declareGadget("./index.html", {
+        element: document.querySelector("#qunit-fixture")
+      })
+        .then(function (new_gadget) {
+          jsplumb_gadget = new_gadget;
+          return jsplumb_gadget.render(sample_data_empty_graph);
+        })
+        /* XXX if we start service then we wait for ever
+        .then(function () {
+          return jsplumb_gadget.startService();
+        }) */
+        .then(function () {
+          // fake a drop event
+          var event = new CustomEvent('drop',{
+            stopPropagation: function() {return;},
+            dataTransfer:{
+              getData: function(type){
+                 // make sure we are called properly
+                 equal(type, 'application/json');
+                 return 'Example.Node';
+               }
+             }
+          });
+          jsplumb_gadget.props.element.dispatchEvent(event);
+        })
+        .then(function () {
+          return jsplumb_gadget.getContent();
+        })
+        .then(function (content) {
+          var node, graph = JSON.parse(content).graph;
+          equal(1, Object.keys(graph.node).length);
+          node = graph.node[Object.keys(graph.node)[0]];
+          equal('Example.Node', node._class);
+        })
+        .fail(console.error.bind(this))
+        .always(start);
+    });
+  });
+}(rJS, JSON, QUnit, jQuery));