Turn vc operators into buttongroup

Change-Id: I61df007ac73cdb009f26a0fedb5e6f99012d185a
diff --git a/dev/js/spec/buttongroupSpec.js b/dev/js/spec/buttongroupSpec.js
index fa5a888..1e27d96 100644
--- a/dev/js/spec/buttongroupSpec.js
+++ b/dev/js/spec/buttongroupSpec.js
@@ -35,6 +35,40 @@
       expect(btn.innerText).toEqual('Meta');
     });
 
+    it('should be clearable', function () {
+      var group = buttonGroupClass.create();
+      expect(group.element().classList.contains('button-group')).toBeTruthy();
+
+      group.add('Meta', ['meta', 'top'], function (e) {});
+      group.add('Mate', ['mate'], function (e) {});
+
+      var btn = group.element().children[0];
+      expect(btn.tagName).toEqual('SPAN');
+      expect(btn.classList.contains('meta')).toBeTruthy();
+      expect(btn.classList.contains('top')).toBeTruthy();
+      expect(btn.innerText).toEqual('Meta');
+
+      btn = group.element().children[1];
+      expect(btn.tagName).toEqual('SPAN');
+      expect(btn.classList.contains('mate')).toBeTruthy();
+      expect(btn.classList.contains('top')).toBeFalsy();
+      expect(btn.innerText).toEqual('Mate');
+
+      // clear button
+      group.clear();
+
+      expect(group.element().children.length).toEqual(0);
+
+      group.add('New', ['new'], function (e) {});
+
+      btn = group.element().children[0];
+      expect(btn.tagName).toEqual('SPAN');
+      expect(btn.classList.contains('new')).toBeTruthy();
+      expect(btn.classList.contains('top')).toBeFalsy();
+      expect(btn.innerText).toEqual('New');
+    });
+
+    
     it('should listen to button clicks', function () {
       var group = buttonGroupClass.create();
 
diff --git a/dev/js/spec/matchSpec.js b/dev/js/spec/matchSpec.js
index 5a4111b..b09a7cb 100644
--- a/dev/js/spec/matchSpec.js
+++ b/dev/js/spec/matchSpec.js
@@ -350,7 +350,8 @@
       expect(e.classList.contains('active')).toBe(true);
       expect(e["_match"]).not.toBe(undefined);
 
-      actions = e.querySelector("p.ref > div.action.bottom").getElementsByTagName("span");
+      actions = e.querySelector("p.ref > div.action.bottom").children;
+      
       expect(actions[0].getAttribute("class")).toEqual("meta");
       expect(actions[1].getAttribute("class")).toEqual("info");
       expect(actions[2].getAttribute("class")).toEqual("tree");
diff --git a/dev/js/spec/vcSpec.js b/dev/js/spec/vcSpec.js
index 482d384..66183f4 100644
--- a/dev/js/spec/vcSpec.js
+++ b/dev/js/spec/vcSpec.js
@@ -30,15 +30,15 @@
   };
 
   function _andOn (obj) {
-    KorAP._and.bind(obj.element().lastChild.firstChild).apply();
+    KorAP._and.apply(obj);
   };
 
   function _orOn (obj) {
-    KorAP._or.bind(obj.element().lastChild.firstChild).apply();
+    KorAP._or.apply(obj);
   };
 
   function _delOn (obj) {
-    KorAP._delete.bind(obj.element().lastChild.firstChild).apply();
+    KorAP._delete.apply(obj);
   };
 
   var demoFactory = buildFactory(vcClass, {
@@ -566,7 +566,7 @@
       expect(docElement.lastChild.children.length).toEqual(0);
     });
 
-    it('should be removable, when no root', function () {
+    it('should be removable, when no root', function () {    
       var docGroup = docGroupClass.create();
       docGroup.operation('or');
       expect(docGroup.operation()).toEqual('or');
@@ -582,6 +582,9 @@
       // Add unspecified object
       docGroup.append();
 
+      var parent = document.createElement('div');
+      parent.appendChild(docGroup.element());
+
       expect(docGroup.element().getAttribute('class')).toEqual('docGroup');
       expect(docGroup.element().children[0].getAttribute('class')).toEqual('doc');
 
@@ -593,6 +596,7 @@
       expect(unspec.lastChild.children[0].getAttribute('class')).toEqual('delete');
     });
 
+    
     it('should be replaceable by a doc', function () {
       var doc = unspecifiedClass.create();
       expect(doc.ldType()).toEqual("non");
@@ -1141,15 +1145,15 @@
         '(Titel = "Baum" & Veröffentlichungsort = "hihi" & ' +
           '(Titel = "Baum" | Veröffentlichungsort = "hihi")) ' +
           '| Untertitel ~ "huhu"');
-      expect(vc.root().element().lastChild.children[0].firstChild.nodeValue).toEqual('and');
-      expect(vc.root().element().lastChild.children[1].firstChild.nodeValue).toEqual('×');
+      expect(vc.root().element().lastChild.children[0].innerText).toEqual('and');      
+      expect(vc.root().element().lastChild.children[1].innerText).toEqual('×');
       expect(vc.root().delOperand(vc.root().getOperand(0)).update()).not.toBeUndefined();
       expect(vc.toQuery()).toEqual('Untertitel ~ "huhu"');
 
       var lc = vc.root().element().lastChild;
-      expect(lc.children[0].firstChild.nodeValue).toEqual('and');
-      expect(lc.children[1].firstChild.nodeValue).toEqual('or');
-      expect(lc.children[2].firstChild.nodeValue).toEqual('×');
+      expect(lc.children[0].innerText).toEqual('and');
+      expect(lc.children[1].innerText).toEqual('or');
+      expect(lc.children[2].innerText).toEqual('×');
 
       // Clean everything
       vc.clean();
@@ -1230,23 +1234,22 @@
       expect(op.or()).toBeTruthy();
       expect(op.del()).toBeTruthy();
 
-      var e = op.element();
+      var e = op.update();
       expect(e.getAttribute('class')).toEqual('operators button-group');
       expect(e.children[0].getAttribute('class')).toEqual('or');
-      expect(e.children[0].firstChild.data).toEqual('or');
+      expect(e.children[0].innerText).toEqual('or');
       expect(e.children[1].getAttribute('class')).toEqual('delete');
-      expect(e.children[1].firstChild.data).toEqual('×');
+      expect(e.children[1].innerText).toEqual('×');
 
       op.and(true);
       op.del(false);
-      op.update();
+      e = op.update();
 
-      e = op.element();
       expect(e.getAttribute('class')).toEqual('operators button-group');
       expect(e.children[0].getAttribute('class')).toEqual('and');
-      expect(e.children[0].firstChild.data).toEqual('and');
+      expect(e.children[0].innerText).toEqual('and');
       expect(e.children[1].getAttribute('class')).toEqual('or');
-      expect(e.children[1].firstChild.data).toEqual('or');
+      expect(e.children[1].innerText).toEqual('or');
     });
   });