diff --git a/DOCS.md b/DOCS.md index 675f806..ac7649a 100644 --- a/DOCS.md +++ b/DOCS.md @@ -19,7 +19,7 @@ The methods are named after their React / Relay counterparts. Their functionalit * Possible `options` are the `queryParams` and the `queries` definitions. * [Example usage](https://github.com/RickWong/react-transmit/blob/c0266b061a2cfa7030500b932f3a88bf195e4465/src/example/Newsfeed.js#L50-L73) -#### `render(ReactClass, optionalProps, targetDOMNode) : void` +#### `render(ReactClass, optionalProps, targetDOMNode, completeCallback) : void` * For isomorphic apps, client-side. * Use it instead of `React.render()` when you're using Transmit's `renderToString()` on the server-side. @@ -40,6 +40,10 @@ The methods are named after their React / Relay counterparts. Their functionalit * This method is actually copied from [react-async](https://github.com/andreypopp/react-async). Thanks [@andreypopp](https://github.com/andreypopp)! * [Example usage](https://github.com/RickWong/react-isomorphic-starterkit/blob/2bf29c747770e79de06e130af325e0bdfb216bc9/src/server.js#L52) +#### `setPromiseConstructor(PromiseConstructor) : void` + +* Optional. Provide your preferred Promise implementation instead of using `global.Promise` by default. + ## API: `Transmit.Container` (Higher-order component) Transmit's `createContainer()` method describes a new React component, a so-called Higher-order component that wraps the original ReactClass. Like any React component you can pass props to it. Below are the Transmit-specific props. Your own props are just passed onto the original ReactClass. diff --git a/package.json b/package.json index 237d915..8bfb048 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "react-transmit", "description": "Relay-inspired library based on Promises instead of GraphQL.", - "version": "2.6.1", + "version": "2.6.3", "license": "BSD-3", "repository": { "type": "git", @@ -26,16 +26,16 @@ "ascii-json": "0.2.0" }, "devDependencies": { - "babel-core": "5.2.13", - "babel-loader": "5.0.0", - "babel-runtime": "5.2.13", - "concurrently": "0.0.5", - "isomorphic-fetch": "2.0.2", - "json-loader": "0.5.1", - "react-hot-loader": "1.2.6", + "babel-core": "5.4.7", + "babel-loader": "5.1.3", + "babel-runtime": "5.4.7", + "concurrently": "0.1.1", + "isomorphic-fetch": "2.1.0", + "json-loader": "0.5.2", + "react-hot-loader": "1.2.7", "react-inline-css": "1.1.1", - "webpack": "1.8.11", - "webpack-dev-server": "1.8.2" + "webpack": "1.9.10", + "webpack-dev-server": "1.9.0" }, "engines": { "node" : ">=0.10.32" diff --git a/src/lib/createContainer.js b/src/lib/createContainer.js index 3d54ee2..a3a2c31 100644 --- a/src/lib/createContainer.js +++ b/src/lib/createContainer.js @@ -3,8 +3,10 @@ */ "use strict"; -var React = require("./react"); -var assign = React.__spread; +var promiseProxy = require("./promiseProxy"); +var React = require("./react"); +var assign = React.__spread; +var shallowEqual = require('./shallowEqual'); /** * @function createContainer @@ -61,10 +63,10 @@ module.exports = function (Component, options) { }); if (!promises.length) { - promises.push(Promise.resolve(true)); + promises.push(promiseProxy.Promise.resolve(true)); } - return Promise.all( + return promiseProxy.Promise.all( promises ).then(function (promisedQueries) { var queryResults = {}; @@ -88,15 +90,22 @@ module.exports = function (Component, options) { this.setQueryParams({}); } else if (this.props.onQuery) { - this.props.onQuery.call(this, Promise.resolve({})); + this.props.onQuery.call(this, promiseProxy.Promise.resolve({})); } }, - setQueryParams: function (nextParams, optionalQueryNames) { + setQueryParams: function (nextParams, optionalQueryNames, options) { var _this = this; + options = arguments[2] || {}; - var promise = new Promise(function (resolve, reject) { + var promise = new promiseProxy.Promise(function (resolve, reject) { var props = _this.props || {}; var promise; + var allNextParams = {}; + var paramsEquals; + + assign(allNextParams, _this.currentParams, nextParams) + paramsEquals = shallowEqual(allNextParams, _this.currentParams) + if (options.checkEquals && paramsEquals && _this.hasQueryResults()) return assign(_this.currentParams, nextParams); promise = Container.getAllQueries(_this.currentParams, optionalQueryNames); diff --git a/src/lib/promiseProxy.js b/src/lib/promiseProxy.js new file mode 100644 index 0000000..8386dcf --- /dev/null +++ b/src/lib/promiseProxy.js @@ -0,0 +1,10 @@ +/** + * @copyright © 2015, Rick Wong. All rights reserved. + */ +"use strict"; + +module.exports = { + Promise: global.Promise || function () { + throw new Error("Missing ES6 Promise implementation"); + } +}; diff --git a/src/lib/react-transmit.js b/src/lib/react-transmit.js index f691f8c..a4ad933 100644 --- a/src/lib/react-transmit.js +++ b/src/lib/react-transmit.js @@ -4,8 +4,11 @@ "use strict"; module.exports = { - createContainer: require("./createContainer"), - render: require("./render"), - renderToString: require("./renderToString"), - injectIntoMarkup: require("./injectIntoMarkup") + createContainer: require("./createContainer"), + render: require("./render"), + renderToString: require("./renderToString"), + injectIntoMarkup: require("./injectIntoMarkup"), + setPromiseConstructor: function (PromiseConstructor) { + require("./promiseProxy").Promise = PromiseConstructor; + } }; diff --git a/src/lib/render.js b/src/lib/render.js index 2c63265..31c3c0c 100644 --- a/src/lib/render.js +++ b/src/lib/render.js @@ -12,5 +12,9 @@ var assign = React.__spread; module.exports = function (Component, props, targetDOMNode, callback) { var myProps = assign({}, props, window.__reactTransmitPacket || {}); + if (window.__reactTransmitPacket) { + delete window.__reactTransmitPacket; + } + React.render(React.createElement(Component, myProps), targetDOMNode, callback); }; diff --git a/src/lib/renderToString.js b/src/lib/renderToString.js index fe1b9c3..241fb9f 100644 --- a/src/lib/renderToString.js +++ b/src/lib/renderToString.js @@ -3,8 +3,9 @@ */ "use strict"; -var React = require("./react"); -var assign = React.__spread; +var promiseProxy = require("./promiseProxy"); +var React = require("./react"); +var assign = React.__spread; /** * @function renderToString @@ -12,7 +13,7 @@ var assign = React.__spread; module.exports = function (Component, props) { props = props || {}; - return new Promise(function (resolve, reject) { + return new promiseProxy.Promise(function (resolve, reject) { var onQuery = function (promise) { promise.then(function (queryResults) { var myProps = assign({}, props, queryResults); @@ -20,7 +21,7 @@ module.exports = function (Component, props) { resolve({ reactString: reactString, - reactData: queryResults + reactData: queryResults }); }).catch(function (error) { reject(error); diff --git a/src/lib/shallowEqual.js b/src/lib/shallowEqual.js new file mode 100644 index 0000000..fd3c366 --- /dev/null +++ b/src/lib/shallowEqual.js @@ -0,0 +1,3 @@ +"use strict"; + +module.exports = require('react/lib/shallowEqual');