Replacing Q promises with ES6 promises

package.json

@@ -27,7 +27,6 @@
     "karma-jasmine": "^0.3.1",
     "karma-notify-reporter": "^0.1.1",
     "lodash": "^2.4.1",
-    "q": "^1.1.2",
     "snapsvg": "git://github.com/adobe-webplatform/Snap.svg#dev",
     "through": "^2.3.6"
   }

spec/parser/javascript/charset_range_spec.js

@@ -1,6 +1,5 @@
 import javascript from 'src/js/parser/javascript/parser.js';
 import util from 'src/js/util.js';
-import Q from 'q';
 import _ from 'lodash';
 
 describe('parser/javascript/charset_range.js', function() {
@@ -71,8 +70,8 @@ describe('parser/javascript/charset_range.js', function() {
       this.node.container = jasmine.createSpyObj('cotnainer', ['addClass', 'text', 'group']);
       this.node.container.text.and.returnValue('hyphen');
 
-      this.firstDeferred = Q.defer();
+      this.firstDeferred = this.testablePromise();
-      this.lastDeferred = Q.defer();
+      this.lastDeferred = this.testablePromise();
 
       spyOn(this.node.first, 'render').and.returnValue(this.firstDeferred.promise);
       spyOn(this.node.last, 'render').and.returnValue(this.lastDeferred.promise);
@@ -95,9 +94,8 @@ describe('parser/javascript/charset_range.js', function() {
             'hyphen',
             this.node.last
           ], { padding: 5 });
-        }, fail)
+          done();
-        .finally(done)
+        });
-        .done();
     });
 
   });

spec/parser/javascript/charset_spec.js

@@ -3,7 +3,6 @@ import Node from 'src/js/parser/javascript/node.js';
 import util from 'src/js/util.js';
 import _ from 'lodash';
 import Snap from 'snapsvg';
-import Q from 'q';
 
 describe('parser/javascript/charset.js', function() {
 
@@ -100,9 +99,9 @@ describe('parser/javascript/charset.js', function() {
         jasmine.createSpyObj('item', ['render'])
       ];
       this.elementDeferred = [
-        Q.defer(),
+        this.testablePromise(),
-        Q.defer(),
+        this.testablePromise(),
-        Q.defer()
+        this.testablePromise()
       ];
       this.node.elements[0].render.and.returnValue(this.elementDeferred[0].promise);
       this.node.elements[1].render.and.returnValue(this.elementDeferred[1].promise);
@@ -143,9 +142,8 @@ describe('parser/javascript/charset.js', function() {
         this.node._render()
           .then(() => {
             expect(util.spaceVertically).toHaveBeenCalledWith(this.node.elements, { padding: 5 });
-          }, fail)
+            done();
-          .finally(done)
+          });
-          .done();
       });
 
       it('renders a labeled box', function(done) {
@@ -153,9 +151,8 @@ describe('parser/javascript/charset.js', function() {
           .then(result => {
             expect(this.node.renderLabeledBox).toHaveBeenCalledWith('example label', this.partContainer, { padding: 5 });
             expect(result).toEqual('labeled box promise');
-          }, fail)
+            done();
-          .finally(done)
+          });
-          .done();
       });
 
     });

spec/parser/javascript/escape_spec.js

@@ -63,9 +63,8 @@ describe('parser/javascript/escape.js', function() {
             rx: '3',
             ry: '3'
           }));
-        }, fail)
+          done();
-        .finally(done)
+        });
-        .done();
     });
 
   });

spec/parser/javascript/literal_spec.js

@@ -43,9 +43,8 @@ describe('parser/javascript/literal.js', function() {
         .then(label => {
           expect(label.selectAll('tspan')[0].hasClass('quote')).toBeTruthy();
           expect(label.selectAll('tspan')[2].hasClass('quote')).toBeTruthy();
-        }, fail)
+          done();
-        .finally(done)
+        });
-        .done();
     });
 
     it('sets the edge radius of the rect', function(done) {
@@ -55,9 +54,8 @@ describe('parser/javascript/literal.js', function() {
             rx: '3',
             ry: '3'
           }));
-        }, fail)
+          done();
-        .finally(done)
+        });
-        .done();
     });
 
   });

spec/parser/javascript/match_fragment_spec.js

@@ -1,7 +1,6 @@
 import javascript from 'src/js/parser/javascript/parser.js';
 import _ from 'lodash';
 import Snap from 'snapsvg';
-import Q from 'q';
 
 describe('parser/javascript/match_fragment.js', function() {
 
@@ -66,7 +65,7 @@ describe('parser/javascript/match_fragment.js', function() {
       ]);
       this.node.container.group.and.returnValue('example group');
 
-      this.renderDeferred = Q.defer();
+      this.renderDeferred = this.testablePromise();
       this.node.content = jasmine.createSpyObj('content', [
         'render',
         'transform',
@@ -99,9 +98,8 @@ describe('parser/javascript/match_fragment.js', function() {
         this.node._render()
           .then(() => {
             expect(this.node.content.transform).toHaveBeenCalledWith('example position');
-          }, fail)
+            done();
-          .finally(done)
+          });
-          .done();
       });
 
       it('renders a skip path and loop path', function(done) {
@@ -110,18 +108,16 @@ describe('parser/javascript/match_fragment.js', function() {
             expect(this.node.skipPath).toHaveBeenCalledWith('content bbox');
             expect(this.node.loopPath).toHaveBeenCalledWith('content bbox');
             expect(this.node.container.path).toHaveBeenCalledWith('skip pathloop path');
-          }, fail)
+            done();
-          .finally(done)
+          });
-          .done();
       });
 
       it('renders a loop label', function(done) {
         this.node._render()
           .then(() => {
             expect(this.node.loopLabel).toHaveBeenCalled();
-          }, fail)
+            done();
-          .finally(done)
+          });
-          .done();
       });
 
     });

spec/parser/javascript/match_spec.js

@@ -2,7 +2,6 @@ import javascript from 'src/js/parser/javascript/parser.js';
 import util from 'src/js/util.js';
 import _ from 'lodash';
 import Snap from 'snapsvg';
-import Q from 'q';
 
 describe('parser/javascript/match.js', function() {
 
@@ -112,8 +111,8 @@ describe('parser/javascript/match.js', function() {
       this.node.container.group.and.returnValue('example group');
 
       this.labelDeferreds = {
-        'Start of line': Q.defer(),
+        'Start of line': this.testablePromise(),
-        'End of line': Q.defer()
+        'End of line': this.testablePromise()
       };
       spyOn(this.node, 'renderLabel').and.callFake(label => {
         return this.labelDeferreds[label].promise;
@@ -126,9 +125,9 @@ describe('parser/javascript/match.js', function() {
       ];
 
       this.partDeferreds = [
-        Q.defer(),
+        this.testablePromise(),
-        Q.defer(),
+        this.testablePromise(),
-        Q.defer()
+        this.testablePromise()
       ];
 
       this.node.parts[0].render.and.returnValue(this.partDeferreds[0].promise);
@@ -217,9 +216,8 @@ describe('parser/javascript/match.js', function() {
           .then(() => {
             expect(this.node.start).toEqual('start label');
             expect(this.node.end).toEqual('end label');
-          }, fail)
+            done();
-          .finally(done)
+          });
-          .done();
       });
 
       it('spaces the items horizontally', function(done) {
@@ -232,9 +230,8 @@ describe('parser/javascript/match.js', function() {
               'part 2',
               'end label'
             ], { padding: 10 });
-          }, fail)
+            done();
-          .finally(done)
+          });
-          .done();
       });
 
       it('renders the connector paths', function(done) {
@@ -248,9 +245,8 @@ describe('parser/javascript/match.js', function() {
               'end label'
             ]);
             expect(this.node.container.path).toHaveBeenCalledWith('connector paths');
-          }, fail)
+            done();
-          .finally(done)
+          });
-          .done();
       });
 
     });

spec/parser/javascript/node_spec.js

@@ -1,5 +1,4 @@
 import Node from 'src/js/parser/javascript/node.js';
-import Q from 'q';
 import Snap from 'snapsvg';
 
 describe('parser/javascript/node.js', function() {
@@ -126,9 +125,8 @@ describe('parser/javascript/node.js', function() {
         .then(() => {
           expect(resolve).toHaveBeenCalledWith('result');
           expect(reject).not.toHaveBeenCalled();
-        }, fail)
+          done();
-        .finally(done)
+        });
-        .done();
     });
 
     it('rejects the returned promise when the render is canceled', function(done) {
@@ -141,9 +139,8 @@ describe('parser/javascript/node.js', function() {
         .then(() => {
           expect(resolve).not.toHaveBeenCalled();
           expect(reject).toHaveBeenCalledWith('Render cancelled');
-        }, fail)
+          done();
-        .finally(done)
+        });
-        .done();
     });
 
   });
@@ -193,9 +190,8 @@ describe('parser/javascript/node.js', function() {
           .then(() => {
             expect(this.text.transform).toHaveBeenCalledWith(Snap.matrix()
               .translate(5, 22));
-          }, fail)
+            done();
-          .finally(done)
+          });
-          .done();
       });
 
       it('sets the dimensions of the rect element', function(done) {
@@ -205,18 +201,16 @@ describe('parser/javascript/node.js', function() {
               width: 52,
               height: 34
             });
-          }, fail)
+            done();
-          .finally(done)
+          });
-          .done();
       });
 
       it('resolves with the group element', function(done) {
         this.node.renderLabel('example label')
           .then(group => {
             expect(group).toEqual(this.group);
-          }, fail)
+            done();
-          .finally(done)
+          });
-          .done();
       });
 
     });
@@ -271,7 +265,7 @@ describe('parser/javascript/node.js', function() {
     describe('when a proxy node is not used', function() {
 
       beforeEach(function() {
-        this.deferred = Q.defer();
+        this.deferred = this.testablePromise();
         this.node._render = jasmine.createSpy('_render').and.returnValue(this.deferred.promise);
         spyOn(this.node, 'startRender');
         spyOn(this.node, 'doneRender');
@@ -302,18 +296,16 @@ describe('parser/javascript/node.js', function() {
           this.node.render(this.container)
             .then(() => {
               expect(this.node.doneRender).toHaveBeenCalled();
-            }, fail)
+              done();
-            .finally(done)
+            });
-            .done();
         });
 
         it('ultimately resolves with the node instance', function(done) {
           this.node.render(this.container)
             .then(result => {
               expect(result).toEqual(this.node);
-            }, fail)
+              done();
-            .finally(done)
+            });
-            .done();
         });
 
       });
@@ -389,9 +381,8 @@ describe('parser/javascript/node.js', function() {
           .then(() => {
             expect(this.text.transform).toHaveBeenCalledWith(Snap.matrix()
               .translate(0, 20));
-          }, fail)
+            done();
-          .finally(done)
+          });
-          .done();
       });
 
       it('positions the rect element', function(done) {
@@ -400,9 +391,8 @@ describe('parser/javascript/node.js', function() {
           .then(() => {
             expect(this.rect.transform).toHaveBeenCalledWith(Snap.matrix()
               .translate(0, 20));
-          }, fail)
+            done();
-          .finally(done)
+          });
-          .done();
       });
 
       it('sets the dimensions of the rect element', function(done) {
@@ -412,10 +402,9 @@ describe('parser/javascript/node.js', function() {
             expect(this.rect.attr).toHaveBeenCalledWith({
               width: 210,
               height: 110
-            })
+            });
-          }, fail)
+            done();
-          .finally(done)
+          });
-          .done();
       });
 
       it('sets the dimensions of the rect element (based on the text element)', function(done) {
@@ -430,10 +419,9 @@ describe('parser/javascript/node.js', function() {
             expect(this.rect.attr).toHaveBeenCalledWith({
               width: 100,
               height: 110
-            })
+            });
-          }, fail)
+            done();
-          .finally(done)
+          });
-          .done();
       });
 
       it('positions the content element', function(done) {
@@ -442,9 +430,8 @@ describe('parser/javascript/node.js', function() {
           .then(() => {
             expect(this.content.transform).toHaveBeenCalledWith(Snap.matrix()
               .translate(5, 25));
-          }, fail)
+            done();
-          .finally(done)
+          });
-          .done();
       });
 
     });

spec/parser/javascript/regexp_spec.js

@@ -2,7 +2,6 @@ import javascript from 'src/js/parser/javascript/parser.js';
 import util from 'src/js/util.js';
 import _ from 'lodash';
 import Snap from 'snapsvg';
-import Q from 'q';
 
 describe('parser/javascript/regexp.js', function() {
 
@@ -60,9 +59,9 @@ describe('parser/javascript/regexp.js', function() {
       ];
 
       this.matchDeferred = [
-        Q.defer(),
+        this.testablePromise(),
-        Q.defer(),
+        this.testablePromise(),
-        Q.defer()
+        this.testablePromise()
       ];
 
       this.node.matches[0].render.and.returnValue(this.matchDeferred[0].promise);
@@ -104,9 +103,8 @@ describe('parser/javascript/regexp.js', function() {
         this.node._render()
           .then(() => {
             expect(util.spaceVertically).toHaveBeenCalledWith(this.node.matches, { padding: 5 });
-          }, fail)
+            done();
-          .finally(done)
+          });
-          .done();
       });
 
       it('renders the sides and curves into the container', function(done) {
@@ -118,9 +116,8 @@ describe('parser/javascript/regexp.js', function() {
             expect(this.node.makeSide).toHaveBeenCalledWith('container bbox', this.node.matches[0]);
             expect(this.node.makeSide).toHaveBeenCalledWith('container bbox', this.node.matches[2]);
             expect(this.node.container.path).toHaveBeenCalledWith('curvecurvecurvesideside');
-          }, fail)
+            done();
-          .finally(done)
+          });
-          .done();
       });
 
       it('renders the connectors into the match container', function(done) {
@@ -130,9 +127,8 @@ describe('parser/javascript/regexp.js', function() {
             expect(this.node.makeConnector).toHaveBeenCalledWith('group bbox', this.node.matches[1]);
             expect(this.node.makeConnector).toHaveBeenCalledWith('group bbox', this.node.matches[2]);
             expect(this.group.path).toHaveBeenCalledWith('connectorconnectorconnector');
-          }, fail)
+            done();
-          .finally(done)
+          });
-          .done();
       });
 
     });

spec/parser/javascript/root_spec.js

@@ -1,7 +1,6 @@
 import javascript from 'src/js/parser/javascript/parser.js';
 import Snap from 'snapsvg';
 import _ from 'lodash';
-import Q from 'q';
 
 describe('parser/javascript/root.js', function() {
 
@@ -62,7 +61,7 @@ describe('parser/javascript/root.js', function() {
         'getBBox'
       ]);
 
-      this.renderDeferred = Q.defer();
+      this.renderDeferred = this.testablePromise();
       this.node.regexp.render.and.returnValue(this.renderDeferred.promise);
     });
 
@@ -114,9 +113,8 @@ describe('parser/javascript/root.js', function() {
         this.node._render()
           .then(() => {
             expect(this.node.container.path).toHaveBeenCalledWith('M1,2H0M3,2H14');
-          }, fail)
+            done();
-          .finally(done)
+          });
-          .done();
       });
 
       it('renders circle elements before and after the regexp', function(done) {
@@ -124,9 +122,8 @@ describe('parser/javascript/root.js', function() {
           .then(() => {
             expect(this.node.container.circle).toHaveBeenCalledWith(0, 2, 5);
             expect(this.node.container.circle).toHaveBeenCalledWith(14, 2, 5);
-          }, fail)
+            done();
-          .finally(done)
+          });
-          .done();
       });
 
       describe('when there are flags', function() {
@@ -140,9 +137,8 @@ describe('parser/javascript/root.js', function() {
             .then(() => {
               expect(this.node.regexp.transform).toHaveBeenCalledWith(Snap.matrix()
                 .translate(10, 20));
-            }, fail)
+              done();
-            .finally(done)
+            });
-            .done();
         });
 
       });
@@ -158,9 +154,8 @@ describe('parser/javascript/root.js', function() {
             .then(() => {
               expect(this.node.regexp.transform).toHaveBeenCalledWith(Snap.matrix()
                 .translate(10, 0));
-            }, fail)
+              done();
-            .finally(done)
+            });
-            .done();
         });
 
       });

spec/parser/javascript/subexp_spec.js

@@ -2,7 +2,6 @@ import javascript from 'src/js/parser/javascript/parser.js';
 import Node from 'src/js/parser/javascript/node.js';
 import _ from 'lodash';
 import Snap from 'snapsvg';
-import Q from 'q';
 
 describe('parser/javascript/subexp.js', function() {
 
@@ -60,7 +59,7 @@ describe('parser/javascript/subexp.js', function() {
   describe('#_render', function() {
 
     beforeEach(function() {
-      this.renderDeferred = Q.defer();
+      this.renderDeferred = this.testablePromise();
 
       this.node = new javascript.Parser('(test)').__consume__subexp();
       this.node.regexp = jasmine.createSpyObj('regexp', ['render']);
@@ -81,9 +80,8 @@ describe('parser/javascript/subexp.js', function() {
       this.node._render()
         .then(() => {
           expect(this.node.renderLabeledBox).toHaveBeenCalledWith('example label', this.node.regexp, { padding: 10 });
-        }, fail)
+          done();
-        .finally(done)
+        });
-        .done();
     });
 
   });

spec/parser/javascript_spec.js

@@ -1,7 +1,6 @@
 import Parser from 'src/js/parser/javascript.js';
 import regexpParser from 'src/js/parser/javascript/grammar.peg';
 import Snap from 'snapsvg';
-import Q from 'q';
 
 describe('parser/javascript.js', function() {
 
@@ -54,36 +53,33 @@ describe('parser/javascript.js', function() {
       this.parser.parse('example expression')
         .then(() => {
           expect(regexpParser.parse).toHaveBeenCalledWith('example expression');
-        }, fail)
+          done();
-        .finally(done)
+        });
-        .done();
     });
 
     it('replaces newlines with "\\n"', function(done) {
       this.parser.parse('multiline\nexpression')
         .then(() => {
           expect(regexpParser.parse).toHaveBeenCalledWith('multiline\\nexpression');
-        }, fail)
+          done();
-        .finally(done)
+        });
-        .done();
     });
 
     it('resolves the returned promise with the parser instance', function(done) {
       this.parser.parse('example expression')
         .then(result => {
           expect(result).toEqual(this.parser);
-        }, fail)
+          done();
-        .finally(done)
+        });
-        .done();
     });
 
     it('rejects the returned promise with the exception thrown', function(done) {
-      this.parser.parse('/example')
+      regexpParser.parse.and.throwError('fail');
+      this.parser.parse('(example')
         .then(null, result => {
           expect(result).toBeDefined();
-        }, fail)
+          done();
-        .finally(done)
+        });
-        .done();
     });
 
   });
@@ -91,7 +87,7 @@ describe('parser/javascript.js', function() {
   describe('#render', function() {
 
     beforeEach(function() {
-      this.renderPromise = Q.defer();
+      this.renderPromise = this.testablePromise();
       this.parser.parsed = jasmine.createSpyObj('parsed', ['render']);
       this.parser.parsed.render.and.returnValue(this.renderPromise.promise);
     });
@@ -120,9 +116,8 @@ describe('parser/javascript.js', function() {
           .then(() => {
             expect(this.result.transform).toHaveBeenCalledWith(Snap.matrix()
               .translate(6, 8));
-          }, fail)
+            done();
-          .finally(done)
+          });
-          .done();
       });
 
       it('sets the dimensions of the image', function(done) {
@@ -132,9 +127,8 @@ describe('parser/javascript.js', function() {
 
             expect(svg.getAttribute('width')).toEqual('62');
             expect(svg.getAttribute('height')).toEqual('44');
-          }, fail)
+            done();
-          .finally(done)
+          });
-          .done();
       });
 
       it('removes the "loading" class', function(done) {
@@ -142,18 +136,16 @@ describe('parser/javascript.js', function() {
         this.parser.render()
           .then(() => {
             expect(this.parser._removeClass).toHaveBeenCalledWith('loading');
-          })
+            done();
-          .finally(done)
+          });
-          .done();
       });
 
       it('removes the progress element', function(done) {
         this.parser.render()
           .then(() => {
             expect(this.container.querySelector('.loading')).toBeNull();
-          })
+            done();
-          .finally(done)
+          });
-          .done();
       });
 
     });

spec/regexper_spec.js

@@ -2,7 +2,6 @@ import util from 'src/js/util.js';
 import Regexper from 'src/js/regexper.js';
 import Parser from 'src/js/parser/javascript.js';
 import Snap from 'snapsvg';
-import Q from 'q';
 
 describe('regexper.js', function() {
 
@@ -270,7 +269,7 @@ describe('regexper.js', function() {
   describe('#showExpression', function() {
 
     beforeEach(function() {
-      spyOn(this.regexper, 'renderRegexp').and.returnValue(jasmine.createSpyObj('renderRegexp', ['done']));
+      spyOn(this.regexper, 'renderRegexp').and.returnValue(jasmine.createSpyObj('renderRegexp', ['catch']));
     });
 
     it('sets the text field value', function() {
@@ -374,8 +373,8 @@ describe('regexper.js', function() {
   describe('#renderRegexp', function() {
 
     beforeEach(function() {
-      this.parsePromise = Q.defer();
+      this.parsePromise = this.testablePromise();
-      this.renderPromise = Q.defer();
+      this.renderPromise = this.testablePromise();
       spyOn(Parser.prototype, 'parse').and.returnValue(this.parsePromise.promise);
       spyOn(Parser.prototype, 'render').and.returnValue(this.renderPromise.promise);
       spyOn(Parser.prototype, 'cancel');
@@ -414,27 +413,24 @@ describe('regexper.js', function() {
         this.regexper.renderRegexp('example expression')
           .then(() => {
             expect(this.regexper.state).toEqual('has-error');
-          }, fail)
+            done();
-          .finally(done)
+          });
-          .done();
       });
 
       it('displays the error message', function(done) {
         this.regexper.renderRegexp('example expression')
           .then(() => {
             expect(this.regexper.error.innerHTML).toEqual('Error: example parse error');
-          }, fail)
+            done();
-          .finally(done)
+          });
-          .done();
       });
 
       it('tracks the parse error', function(done) {
         this.regexper.renderRegexp('example expression')
           .then(() => {
             expect(window._gaq.push).toHaveBeenCalledWith(['_trackEvent', 'visualization', 'parse error']);
-          }, fail)
+            done();
-          .finally(done)
+          });
-          .done();
       });
 
     });
@@ -451,9 +447,8 @@ describe('regexper.js', function() {
         this.regexper.renderRegexp('example expression')
           .then(() => {
             expect(this.parser.render).toHaveBeenCalled();
-          }, fail)
+            done();
-          .finally(done)
+          });
-          .done();
       });
 
     });
@@ -470,54 +465,48 @@ describe('regexper.js', function() {
         this.regexper.renderRegexp('example expression')
           .then(() => {
             expect(this.regexper.state).toEqual('has-results');
-          }, fail)
+            done();
-          .finally(done)
+          });
-          .done();
       });
 
       it('updates the links', function(done) {
         this.regexper.renderRegexp('example expression')
           .then(() => {
             expect(this.regexper.updateLinks).toHaveBeenCalled();
-          }, fail)
+            done();
-          .finally(done)
+          });
-          .done();
       });
 
       it('displays the warnings', function(done) {
         this.regexper.renderRegexp('example expression')
           .then(() => {
             expect(this.regexper.displayWarnings).toHaveBeenCalled();
-          }, fail)
+            done();
-          .finally(done)
+          });
-          .done();
       });
 
       it('tracks the complete render', function(done) {
         this.regexper.renderRegexp('example expression')
           .then(() => {
             expect(window._gaq.push).toHaveBeenCalledWith(['_trackEvent', 'visualization', 'complete']);
-          }, fail)
+            done();
-          .finally(done)
+          });
-          .done();
       });
 
       it('sets the running property to false', function(done) {
         this.regexper.renderRegexp('example expression')
           .then(() => {
             expect(this.regexper.running).toBeFalsy();
-          }, fail)
+            done();
-          .finally(done)
+          });
-          .done();
       });
 
       it('tracks the total rendering time', function(done) {
         this.regexper.renderRegexp('example expression')
           .then(() => {
             expect(window._gaq.push).toHaveBeenCalledWith(['_trackTiming', 'visualization', 'total time', jasmine.any(Number)]);
-          }, fail)
+            done();
-          .finally(done)
+          });
-          .done();
       });
 
     });
@@ -534,27 +523,24 @@ describe('regexper.js', function() {
         this.regexper.renderRegexp('example expression')
           .then(() => {
             expect(this.regexper.state).toEqual('');
-          }, fail)
+            done();
-          .finally(done)
+          });
-          .done();
       });
 
       it('tracks the cancelled render', function(done) {
         this.regexper.renderRegexp('example expression')
           .then(() => {
             expect(window._gaq.push).toHaveBeenCalledWith(['_trackEvent', 'visualization', 'cancelled']);
-          }, fail)
+            done();
-          .finally(done)
+          });
-          .done();
       });
 
       it('sets the running property to false', function(done) {
         this.regexper.renderRegexp('example expression')
           .then(() => {
             expect(this.regexper.running).toBeFalsy();
-          }, fail)
+            done();
-          .finally(done)
+          });
-          .done();
       });
 
     });
@@ -571,9 +557,8 @@ describe('regexper.js', function() {
         this.regexper.renderRegexp('example expression')
           .then(fail, () => {
             expect(this.regexper.running).toBeFalsy();
-          })
+            done();
-          .finally(done)
+          });
-          .done();
       });
 
     });

spec/setup_spec.js

@@ -8,6 +8,17 @@ beforeEach(function() {
     '<div class="progress"><div></div></div>'
   ].join('');
   document.body.appendChild(template);
+
+  this.testablePromise = function() {
+    var result = {};
+
+    result.promise = new Promise((resolve, reject) => {
+      result.resolve = resolve;
+      result.reject = reject;
+    });
+
+    return result;
+  };
 });
 
 afterEach(function() {

src/js/main.js

@@ -41,7 +41,13 @@ window._gaq = (typeof _gaq !== 'undefined') ? _gaq : {
   _.each(document.querySelectorAll('[data-expr]'), element => {
     new Parser(element, { keepContent: true })
       .parse(element.getAttribute('data-expr'))
-      .invoke('render')
+      .then(parser => {
-      .done();
+        parser.render();
+      })
+      .catch(error => {
+        setTimeout(() => {
+          throw error;
+        });
+      });
   });
 }());

src/js/parser/javascript.js

@@ -1,4 +1,3 @@
-import Q from 'q';
 import Snap from 'snapsvg';
 import _ from 'lodash';
 
@@ -45,23 +44,21 @@ export default class Parser {
   }
 
   parse(expression) {
-    var deferred = Q.defer();
-
     this._addClass('loading');
 
-    setTimeout(() => {
+    return new Promise((resolve, reject) => {
-      try {
+      setTimeout(() => {
-        javascript.Parser.SyntaxNode.state = this.state;
+        try {
+          javascript.Parser.SyntaxNode.state = this.state;
 
-        this.parsed = javascript.parse(expression.replace(/\n/g, '\\n'));
+          this.parsed = javascript.parse(expression.replace(/\n/g, '\\n'));
-        deferred.resolve(this);
+          resolve(this);
-      }
+        }
-      catch(e) {
+        catch(e) {
-        deferred.reject(e);
+          reject(e);
-      }
+        }
+      });
     });
-
-    return deferred.promise;
   }
 
   render() {
@@ -78,7 +75,7 @@ export default class Parser {
           height: box.height + 20
         });
       })
-      .finally(() => {
+      .then(() => {
         this._removeClass('loading');
         this.container.removeChild(this.container.querySelector('.progress'));
       });

src/js/parser/javascript/charset.js

@@ -1,6 +1,5 @@
 import util from '../../util.js';
 import _ from 'lodash';
-import Q from 'q';
 export default {
   type: 'charset',
 
@@ -22,7 +21,7 @@ export default {
   _render() {
     this.partContainer = this.container.group();
 
-    return Q.all(_.map(this.elements, part => {
+    return Promise.all(_.map(this.elements, part => {
       return part.render(this.partContainer.group());
     }))
       .then(() => {

src/js/parser/javascript/charset_range.js

@@ -1,6 +1,5 @@
 import util from '../../util.js';
 import _ from 'lodash';
-import Q from 'q';
 
 export default {
   type: 'charset-range',
@@ -12,7 +11,7 @@ export default {
       this.last
     ];
 
-    return Q.all([
+    return Promise.all([
       this.first.render(this.container.group()),
       this.last.render(this.container.group())
     ])

src/js/parser/javascript/escape.js

@@ -15,11 +15,12 @@ export default {
 
   _render() {
     return this.renderLabel(this.label)
-      .tap(label => {
+      .then(label => {
         label.select('rect').attr({
           rx: 3,
           ry: 3
         });
+        return label;
       });
   },
 

src/js/parser/javascript/literal.js

@@ -5,7 +5,7 @@ export default {
 
   _render() {
     return this.renderLabel(['\u201c', this.literal, '\u201d'])
-      .tap(label => {
+      .then(label => {
         var spans = label.selectAll('tspan');
 
         spans[0].addClass('quote');
@@ -15,6 +15,8 @@ export default {
           rx: 3,
           ry: 3
         });
+
+        return label;
       });
   },
 

src/js/parser/javascript/match.js

@@ -1,6 +1,5 @@
 import util from '../../util.js';
 import _ from 'lodash';
-import Q from 'q';
 
 export default {
   type: 'match',
@@ -28,12 +27,16 @@ export default {
 
     if (this.anchorStart) {
       start = this.renderLabel('Start of line')
-        .invoke('addClass', 'anchor');
+        .then(label => {
+          return label.addClass('anchor');
+        });
     }
 
     if (this.anchorEnd) {
       end = this.renderLabel('End of line')
-        .invoke('addClass', 'anchor');
+        .then(label => {
+          return label.addClass('anchor');
+        });
     }
 
     partPromises = _.map(this.parts, part => {
@@ -46,7 +49,7 @@ export default {
       items = [this.container.group()];
     }
 
-    return Q.all(items)
+    return Promise.all(items)
       .then(items => {
         this.start = _.first(items);
         this.end = _.last(items);

src/js/parser/javascript/node.js

@@ -1,6 +1,5 @@
 import util from '../../util.js';
 import _ from 'lodash';
-import Q from 'q';
 
 export default class Node {
   constructor(textValue, offset, elements, properties) {
@@ -59,18 +58,15 @@ export default class Node {
   }
 
   deferredStep() {
-    var deferred = Q.defer(),
+    return new Promise((resolve, reject) => {
-        result = arguments;
+      setTimeout(() => {
-
+        if (this.state.cancelRender) {
-    setTimeout(() => {
+          reject('Render cancelled');
-      if (this.state.cancelRender) {
+        } else {
-        deferred.reject('Render cancelled');
+          resolve.apply(this, arguments);
-      } else {
+        }
-        deferred.resolve.apply(this, result);
+      }, 1);
-      }
+    });
-    }, 1);
-
-    return deferred.promise;
   }
 
   renderLabel(text) {

src/js/parser/javascript/regexp.js

@@ -1,6 +1,5 @@
 import util from '../../util.js';
 import _ from 'lodash';
-import Q from 'q';
 
 export default {
   type: 'regexp',
@@ -11,7 +10,7 @@ export default {
       .transform(Snap.matrix()
         .translate(20, 0));
 
-    return Q.all(_.map(this.matches, match => {
+    return Promise.all(_.map(this.matches, match => {
       return match.render(matchContainer.group());
     }))
       .then(() => {

src/js/regexper.js

@@ -1,6 +1,5 @@
 import util from './util.js';
 import Parser from './parser/javascript.js';
-import Q from 'q';
 import _ from 'lodash';
 
 export default class Regexper {
@@ -98,7 +97,11 @@ export default class Regexper {
     this.state = '';
 
     if (expression !== '') {
-      this.renderRegexp(expression).done();
+      this.renderRegexp(expression).catch(message => {
+        setTimeout(() => {
+          throw message;
+        });
+      });
     }
   }
 
@@ -142,15 +145,13 @@ export default class Regexper {
         startTime, endTime;
 
     if (this.running) {
-      let deferred = Q.defer();
-
       this.running.cancel();
 
-      setTimeout(() => {
+      return new Promise((resolve, reject) => {
-        deferred.resolve(this.renderRegexp(expression));
+        setTimeout(() => {
-      }, 10);
+          resolve(this.renderRegexp(expression));
-
+        }, 10);
-      return deferred.promise;
+      });
     }
 
     this.state = 'is-loading';
@@ -161,7 +162,7 @@ export default class Regexper {
 
     return this.running
       .parse(expression)
-      .then(null, message => {
+      .catch(message => {
         this.state = 'has-error';
         this.error.innerHTML = '';
         this.error.appendChild(document.createTextNode(message));
@@ -170,7 +171,9 @@ export default class Regexper {
 
         throw message;
       })
-      .invoke('render')
+      .then(parser => {
+        return parser.render();
+      })
       .then(() => {
         this.state = 'has-results';
         this.updateLinks();
@@ -180,7 +183,7 @@ export default class Regexper {
         endTime = new Date().getTime();
         window._gaq.push(['_trackTiming', 'visualization', 'total time', endTime - startTime]);
       })
-      .then(null, message => {
+      .catch(message => {
         if (message === 'Render cancelled') {
           window._gaq.push(['_trackEvent', 'visualization', 'cancelled']);
           this.state = '';
@@ -190,8 +193,14 @@ export default class Regexper {
           throw message;
         }
       })
-      .finally(() => {
+      .then(
-        this.running = false;
+        () => {
-      });
+          this.running = false;
+        },
+        message => {
+          this.running = false;
+          throw message;
+        }
+      );
   }
 }