take 1

js/deferred.jsx

@@ -0,0 +1,36 @@
+var $ = require("jquery");
+
+var UNMOUNTING = {};
+
+/* If the component unmounts before the promise is resolved:
+ * ~ the fullfill handler is not called
+ * ~ the reject handler is called with PromiseMixin.UNMOUNTING
+ * ~ we make no effort to cancel the promise
+ */
+
+var PromiseMixin = {
+    defer: function(promise) {
+        var ret = $.Deferred();
+        this._deferreds.push(ret);
+
+        promise.then(
+            function() { ret.resolveWith(this, [].slice.call(arguments)); },
+            function() { ret.rejectWith(this, [].slice.call(arguments)); }
+        );
+
+        return ret.promise();
+    },
+
+    componentWillUnmount: function() {
+        this._deferreds.map(deferred => deferred.reject(UNMOUNTING));
+
+        // TODO necessary?
+        delete this._deferreds;
+    },
+
+    _deferreds: [],
+
+    UNMOUNTING
+};
+
+module.exports = PromiseMixin;

package.json

@@ -27,7 +27,8 @@
     "reactify": "~0.13.0",
     "react-tools": "~0.10.0",
     "underscore": "~1.6.0",
-    "moment": "*"
+    "moment": "*",
+    "jquery": "*"
   },
   "scripts": {
     "test": "make test",

test/deferred-test.jsx

@@ -0,0 +1,73 @@
+/** @jsx React.DOM */
+
+var jsdom = require("jsdom");
+var assert = require("assert");
+var React = require("react/addons");
+var TestUtils = React.addons.TestUtils;
+var PromiseMixin = require("../js/deferred.jsx");
+var $ = require("jquery");
+
+describe("PromiseMixin", function() {
+    beforeEach(function() {
+        global.window = jsdom.jsdom().createWindow();
+        global.document = window.document;
+
+        var Class = React.createClass({
+            mixins: [PromiseMixin],
+            render: function() {
+                return <div />;
+            }
+        });
+
+        this.node = document.createElement('div');
+        this.component = React.renderComponent(<Class />, this.node);
+    });
+
+    it("rejects when unmounting", function() {
+        var deferred = $.Deferred();
+        var rejected = false;
+        var resolved = false;
+        this.component.defer(deferred).then(
+            () => { resolved = true; },
+            () => { rejected = true; }
+        );
+        React.unmountComponentAtNode(this.node);
+
+        assert.strictEqual(resolved, false);
+        assert.strictEqual(rejected, true);
+    });
+
+    it("passes through a resolution", function() {
+        var deferred = $.Deferred();
+        var result = null;
+        this.component.defer(deferred).then(r => { result = r; });
+
+        var unique = {};
+        deferred.resolve(unique);
+
+        assert.strictEqual(result, unique);
+    });
+
+    it("passes through a rejection", function() {
+        var deferred = $.Deferred();
+        var result = null;
+        this.component.defer(deferred).then(null, r => { result = r; });
+
+        var unique = {};
+        deferred.reject(unique);
+
+        assert.strictEqual(result, unique);
+    });
+
+    // testing the raison d'etre of this mixin - we just need it to not throw
+    // an exception
+    it("doesn't barf when you resolve after unmounting", function() {
+        var deferred = $.Deferred();
+        this.component.defer(deferred).then(
+            () => { this.setState({ blowUp: true }); },
+            null
+        );
+        React.unmountComponentAtNode(this.node);
+        deferred.resolve(true);
+    });
+});