react_ujs - npm Package Compare versions

Comparing version 0.1.2 to 0.2.0

dist/react_ujs.js

 (function webpackUniversalModuleDefinition(root, factory) {
 	if(typeof exports === 'object' && typeof module === 'object')
-		module.exports = factory(require("react"), require("react-dom"));
+		module.exports = factory(require("react"), require("react-dom"), require("react-dom/server"));
 	else if(typeof define === 'function' && define.amd)
-		define(["react", "react-dom"], factory);
+		define(["react", "react-dom", "react-dom/server"], factory);
 	else if(typeof exports === 'object')
-		exports["ReactRailsUJS"] = factory(require("react"), require("react-dom"));
+		exports["ReactRailsUJS"] = factory(require("react"), require("react-dom"), require("react-dom/server"));
 	else
-		root["ReactRailsUJS"] = factory(root["React"], root["ReactDOM"]);
-})(this, function(__WEBPACK_EXTERNAL_MODULE_3__, __WEBPACK_EXTERNAL_MODULE_4__) {
+		root["ReactRailsUJS"] = factory(root["React"], root["ReactDOM"], root["ReactDOMServer"]);
+})(this, function(__WEBPACK_EXTERNAL_MODULE_3__, __WEBPACK_EXTERNAL_MODULE_4__, __WEBPACK_EXTERNAL_MODULE_5__) {
 return /******/ (function(modules) { // webpackBootstrap
@@ -76,3 +76,3 @@ /******/ 	// The module cache
 /******/ 	// Load entry module and return exports
-/******/ 	return __webpack_require__(__webpack_require__.s = 5);
+/******/ 	return __webpack_require__(__webpack_require__.s = 6);
 /******/ })
@@ -84,7 +84,7 @@ /************************************************************************/
 
-var nativeEvents = __webpack_require__(6)
-var pjaxEvents = __webpack_require__(7)
-var turbolinksEvents = __webpack_require__(8)
-var turbolinksClassicDeprecatedEvents = __webpack_require__(10)
-var turbolinksClassicEvents = __webpack_require__(9)
+var nativeEvents = __webpack_require__(7)
+var pjaxEvents = __webpack_require__(8)
+var turbolinksEvents = __webpack_require__(9)
+var turbolinksClassicDeprecatedEvents = __webpack_require__(11)
+var turbolinksClassicEvents = __webpack_require__(10)
 
@@ -115,3 +115,3 @@ // see what things are globally available
     }
-  } else if ($ && typeof $.pjax === 'function') {
+  } else if (typeof $ !== "undefined" && typeof $.pjax === 'function') {
     pjaxEvents.setup(ujs);
@@ -131,11 +131,12 @@ } else {
 // Also, try to gracefully import Babel 6 style default exports
+var topLevel = typeof window === "undefined" ? this : window;
+
 module.exports = function(className) {
   var constructor;
-
   // Try to access the class globally first
-  constructor = window[className];
+  constructor = topLevel[className];
 
   // If that didn't work, try eval
   if (!constructor) {
-    constructor = eval.call(window, className);
+    constructor = eval(className);
   }
@@ -167,3 +168,2 @@
     var keys = parts
-    console.log(filename, keys)
     // Load the module:
@@ -198,2 +198,8 @@ var component = reqctx("./" + filename)
 /* 5 */
+/***/ (function(module, exports) {
+
+module.exports = __WEBPACK_EXTERNAL_MODULE_5__;
+
+/***/ }),
+/* 6 */
 /***/ (function(module, exports, __webpack_require__) {
@@ -203,2 +209,3 @@
 var ReactDOM = __webpack_require__(4)
+var ReactDOMServer = __webpack_require__(5)
 
@@ -219,3 +226,3 @@ var detectEvents = __webpack_require__(0)
   // If jQuery is detected, save a reference to it for event handlers
-  jQuery: (typeof window.jQuery !== 'undefined') && window.jQuery,
+  jQuery: (typeof window !== 'undefined') && (typeof window.jQuery !== 'undefined') && window.jQuery,
 
@@ -263,2 +270,10 @@ // helper method for the mount and unmount methods to find the
 
+  // Render `componentName` with `props` to a string,
+  // using the specified `renderFunction` from `react-dom/server`.
+  serverRender: function(renderFunction, componentName, props) {
+    var componentClass = this.getConstructor(componentName)
+    var element = React.createElement(componentClass, props)
+    return ReactDOMServer[renderFunction](element)
+  },
+
   // Within `searchSelector`, find nodes which should have React components
@@ -301,4 +316,13 @@ // inside them, and mount them with their props.
 
-detectEvents(ReactRailsUJS)
+if (typeof window !== "undefined") {
+  // Only setup events for browser (not server-rendering)
+  detectEvents(ReactRailsUJS)
+}
 
+// It's a bit of a no-no to populate the global namespace,
+// but we really need it!
+// We need access to this object for server rendering, and
+// we can't do a dynamic `require`, so we'll grab it from here:
+self.ReactRailsUJS = ReactRailsUJS
+
 module.exports = ReactRailsUJS
@@ -308,3 +332,3 @@
 /***/ }),
-/* 6 */
+/* 7 */
 /***/ (function(module, exports) {
@@ -330,3 +354,3 @@
 /***/ }),
-/* 7 */
+/* 8 */
 /***/ (function(module, exports) {
@@ -345,3 +369,3 @@
 /***/ }),
-/* 8 */
+/* 9 */
 /***/ (function(module, exports) {
@@ -359,3 +383,3 @@
 /***/ }),
-/* 9 */
+/* 10 */
 /***/ (function(module, exports) {
@@ -374,3 +398,3 @@
 /***/ }),
-/* 10 */
+/* 11 */
 /***/ (function(module, exports) {
@@ -377,0 +401,0 @@

index.js

 var React = require("react")
 var ReactDOM = require("react-dom")
+var ReactDOMServer = require("react-dom/server")
 
@@ -18,3 +19,3 @@ var detectEvents = require("./src/events/detect")
   // If jQuery is detected, save a reference to it for event handlers
-  jQuery: (typeof window.jQuery !== 'undefined') && window.jQuery,
+  jQuery: (typeof window !== 'undefined') && (typeof window.jQuery !== 'undefined') && window.jQuery,
 
@@ -62,2 +63,10 @@ // helper method for the mount and unmount methods to find the
 
+  // Render `componentName` with `props` to a string,
+  // using the specified `renderFunction` from `react-dom/server`.
+  serverRender: function(renderFunction, componentName, props) {
+    var componentClass = this.getConstructor(componentName)
+    var element = React.createElement(componentClass, props)
+    return ReactDOMServer[renderFunction](element)
+  },
+
   // Within `searchSelector`, find nodes which should have React components
@@ -100,4 +109,13 @@ // inside them, and mount them with their props.
 
-detectEvents(ReactRailsUJS)
+if (typeof window !== "undefined") {
+  // Only setup events for browser (not server-rendering)
+  detectEvents(ReactRailsUJS)
+}
 
+// It's a bit of a no-no to populate the global namespace,
+// but we really need it!
+// We need access to this object for server rendering, and
+// we can't do a dynamic `require`, so we'll grab it from here:
+self.ReactRailsUJS = ReactRailsUJS
+
 module.exports = ReactRailsUJS

package.json

 {
   "name": "react_ujs",
-  "version": "0.1.2",
+  "version": "0.2.0",
   "description": "Rails UJS for the react-rails gem",
@@ -5,0 +5,0 @@ "main": "index.js",

src/events/detect.js

@@ -31,3 +31,3 @@ var nativeEvents = require("./native")
     }
-  } else if ($ && typeof $.pjax === 'function') {
+  } else if (typeof $ !== "undefined" && typeof $.pjax === 'function') {
     pjaxEvents.setup(ujs);
@@ -34,0 +34,0 @@ } else {

src/getConstructor/fromGlobal.js

 // Assume className is simple and can be found at top-level (window).
 // Fallback to eval to handle cases like 'My.React.ComponentName'.
 // Also, try to gracefully import Babel 6 style default exports
+var topLevel = typeof window === "undefined" ? this : window;
+
 module.exports = function(className) {
   var constructor;
-
   // Try to access the class globally first
-  constructor = window[className];
+  constructor = topLevel[className];
 
   // If that didn't work, try eval
   if (!constructor) {
-    constructor = eval.call(window, className);
+    constructor = eval(className);
   }
@@ -14,0 +15,0 @@

webpack.config.js

@@ -22,4 +22,10 @@ module.exports = {
       amd: 'react-dom'
+    },
+    'react-dom/server': {
+      root: 'ReactDOMServer',
+      commonjs2: 'react-dom/server',
+      commonjs: 'react-dom/server',
+      amd: 'react-dom/server'
     }
   }
 };

No alert changes

Improved metrics

Total package byte prevSize

81338

increased by2.89%

Lines of code

599

increased by7.73%

No dependency changes