react-rails 2.0.0 → 2.0.2

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: e9fe44131627108a965e3ab9eb09d5dfd1880926
-  data.tar.gz: aabdd492d7f9dd5cf9e17d7f10ef8547749cb8ca
+  metadata.gz: 2d281b77d99197720b6074abc35e3ebb9be613c2
+  data.tar.gz: cc3103861584d6b55f450b39e03d8df5def19e1b
 SHA512:
-  metadata.gz: 0e13b6d9112c96ca74ecc0f2fc78540fc6577a63f7e46ae2e5cb9fa481726d5f879d8f63a2e5f479c572398bea14c3b37bed4c45952175e287d6dfd02602a0f8
-  data.tar.gz: d8c03917cabcf1d59b399fb10162642f5e76ea31b8d4f08ef5d223a3e2c713250c536a421db8f44d480ffae16d20f15b79b015bc5950a3977ff8796aea194805
+  metadata.gz: 4e393b22c5f5c93be85e919d334d21c9421484d5e82fd59cd06029d65a2f549ebfe32b7a9b7b2fb6c8b66559e5f953c876db31021e34d7a5d851a6527796638a
+  data.tar.gz: fbb538016c5a28fd5d455fd9fd615009942079d89d2b7a31d753102c13a7d36afc1d88bd981fc8b7169ddc9bd77cadd59de6be781dd89b7d68e4825a378e7ee4

data/CHANGELOG.md

@@ -8,6 +8,15 @@
 
 #### Bug Fixes
 
+## 2.0.2 (April 13, 2017)
+
+#### New Features
+
+- Rerun events detection at any time with `ReactRailsUJS.detectEvents()` #693
+- Make the NPM version of `react_ujs` match the Rubygem version
+
+`2.0.1` was skipped because a bad version of `react_ujs` was published to NPM.
+
 ## 2.0.0 (April 13, 2017)
 
 #### Breaking Changes

data/README.md

@@ -59,7 +59,7 @@ When you add a component to `components/`, you can [render it in a Rails view](#
 The component name tells `react-rails` where to load the component. For example:
 
 `react_component` call | component `require`
-=======================|======================
+-----|-----
 `react_component("Item")` | `require("Item")`
 `react_component("items/index")` | `require("items/index")`
 `react_component("items.Index")` | `require("items").Index`
@@ -245,7 +245,14 @@ You can use this when the DOM is modified by AJAX calls or modal windows.
 
 `ReactRailsUJS` will automatically mount components on `<%= react_component(...) %>` tags and unmount them when appropriate.
 
-Be sure to load `react_ujs` _after_ these libraries so that it can detect them.
+If you need to re-detect events, you can call `detectEvents`:
+
+```js
+// Remove previous event handlers and add new ones:
+ReactRailsUJS.detectEvents()
+```
+
+For example, if `Turbolinks` is loaded _after_ `ReactRailsUJS`, you'll need to call this again. This function removes previous handlers before adding new ones, so it's safe to call as often as needed.
 
 ### `getConstructor`
 

data/lib/assets/javascripts/react_ujs.js

@@ -117,14 +117,36 @@ var turbolinksClassicEvents = __webpack_require__(10)
 // see what things are globally available
 // and setup event handlers to those things
 module.exports = function(ujs) {
+  if (ujs.handleEvent) {
+    // We're calling this a second time -- remove previous handlers
+    turbolinksClassicEvents.teardown(ujs)
+    turbolinksEvents.teardown(ujs);
+    turbolinksClassicDeprecatedEvents.teardown(ujs);
+    pjaxEvents.teardown(ujs);
+    nativeEvents.teardown(ujs);
+  }
+
   if (ujs.jQuery) {
     ujs.handleEvent = function(eventName, callback) {
       ujs.jQuery(document).on(eventName, callback);
     };
-  } else {
+    ujs.removeEvent = function(eventName, callback) {
+      ujs.jQuery(document).off(eventName, callback);
+    }
+  } else if ('addEventListener' in window) {
     ujs.handleEvent = function(eventName, callback) {
       document.addEventListener(eventName, callback);
     };
+    ujs.removeEvent = function(eventName, callback) {
+      document.removeEventListener(eventName, callback);
+    };
+  } else {
+    ujs.handleEvent = function(eventName, callback) {
+      window.attachEvent(eventName, callback);
+    };
+    ujs.removeEvent = function(eventName, callback) {
+      window.detachEvent(eventName, callback);
+    };
   }
 
   // Detect which kind of events to set up:
@@ -251,8 +273,11 @@ var ReactRailsUJS = {
   // the default is ReactRailsUJS.ComponentGlobal
   getConstructor: constructorFromGlobal,
 
-  useContext: function(req) {
-    this.getConstructor = constructorFromRequireContextWithGlobalFallback(req)
+  // Given a Webpack `require.context`,
+  // try finding components with `require`,
+  // then falling back to global lookup.
+  useContext: function(requireContext) {
+    this.getConstructor = constructorFromRequireContextWithGlobalFallback(requireContext)
   },
 
   // Render `componentName` with `props` to a string,
@@ -298,11 +323,36 @@ var ReactRailsUJS = {
       ReactDOM.unmountComponentAtNode(node);
     }
   },
+
+  // Check the global context for installed libraries
+  // and figure out which library to hook up to (pjax, Turbolinks, jQuery)
+  // This is called on load, but you can call it again if needed
+  // (It will unmount itself)
+  detectEvents: function() {
+    detectEvents(this)
+  },
 }
 
+// These stable references are so that handlers can be added and removed:
+ReactRailsUJS.handleMount = function(e) {
+  var target = undefined;
+  if (e && e.target) {
+    target = e.target;
+  }
+  ReactRailsUJS.mountComponents(target);
+}
+ReactRailsUJS.handleUnmount = function(e) {
+  var target = undefined;
+  if (e && e.target) {
+    target = e.target;
+  }
+  ReactRailsUJS.unmountComponents(target);
+}
+
+
 if (typeof window !== "undefined") {
   // Only setup events for browser (not server-rendering)
-  detectEvents(ReactRailsUJS)
+  ReactRailsUJS.detectEvents()
 }
 
 // It's a bit of a no-no to populate the global namespace,
@@ -324,13 +374,19 @@ module.exports = {
   setup: function(ujs) {
     if (ujs.jQuery) {
       // Use jQuery if it's present:
-      ujs.jQuery(function() { ujs.mountComponents() });
+      ujs.handleEvent("ready", ujs.handleMount);
     } else if ('addEventListener' in window) {
-      document.addEventListener('DOMContentLoaded', function() { ujs.mountComponents() });
+      ujs.handleEvent('DOMContentLoaded', ujs.handleMount);
     } else {
       // add support to IE8 without jQuery
-      window.attachEvent('onload', function() { ujs.mountComponents() });
+      ujs.handleEvent('onload', ujs.handleMount);
     }
+  },
+
+  teardown: function(ujs) {
+    ujs.removeEvent("ready", ujs.handleMount);
+    ujs.removeEvent('DOMContentLoaded', ujs.handleMount);
+    ujs.removeEvent('onload', ujs.handleMount);
   }
 }
 
@@ -342,10 +398,16 @@ module.exports = {
 module.exports = {
   // pjax support
   setup: function(ujs) {
-    ujs.handleEvent('ready', function() { ujs.mountComponents() });
-    ujs.handleEvent('pjax:end', function(e) { ujs.mountComponents(e.target) });
-    ujs.handleEvent('pjax:beforeReplace', function(e) { ujs.unmountComponents(e.target) });
-  }
+    ujs.handleEvent('ready', ujs.handleMount);
+    ujs.handleEvent('pjax:end', ujs.handleMount);
+    ujs.handleEvent('pjax:beforeReplace', ujs.handleUnmount);
+  },
+
+  teardown: function(ujs) {
+    ujs.removeEvent('ready', ujs.handleMount);
+    ujs.removeEvent('pjax:end', ujs.handleMount);
+    ujs.removeEvent('pjax:beforeReplace', ujs.handleUnmount);
+  },
 }
 
 
@@ -356,9 +418,15 @@ module.exports = {
 module.exports = {
   // Turbolinks 5+ got rid of named events (?!)
   setup: function(ujs) {
-    ujs.handleEvent('DOMContentLoaded', function() { ujs.mountComponents() })
-    ujs.handleEvent('turbolinks:render', function() { ujs.mountComponents() })
-    ujs.handleEvent('turbolinks:before-render', function() { ujs.unmountComponents() })
+    ujs.handleEvent('DOMContentLoaded', ujs.handleMount)
+    ujs.handleEvent('turbolinks:render', ujs.handleMount)
+    ujs.handleEvent('turbolinks:before-render', ujs.handleUnmount)
+  },
+
+  teardown: function(ujs) {
+    ujs.removeEvent('DOMContentLoaded', ujs.handleMount)
+    ujs.removeEvent('turbolinks:render', ujs.handleMount)
+    ujs.removeEvent('turbolinks:before-render', ujs.handleUnmount)
   },
 }
 
@@ -371,8 +439,12 @@ module.exports = {
   // Attach handlers to Turbolinks-Classic events
   // for mounting and unmounting components
   setup: function(ujs) {
-    ujs.handleEvent(Turbolinks.EVENTS.CHANGE, function() { ujs.mountComponents() });
-    ujs.handleEvent(Turbolinks.EVENTS.BEFORE_UNLOAD, function() { ujs.unmountComponents() });
+    ujs.handleEvent(Turbolinks.EVENTS.CHANGE, ujs.handleMount);
+    ujs.handleEvent(Turbolinks.EVENTS.BEFORE_UNLOAD, ujs.handleUnmount);
+  },
+  teardown: function(ujs) {
+    ujs.removeEvent(Turbolinks.EVENTS.CHANGE, ujs.handleMount);
+    ujs.removeEvent(Turbolinks.EVENTS.BEFORE_UNLOAD, ujs.handleUnmount);
   }
 }
 
@@ -388,8 +460,12 @@ module.exports = {
   // https://github.com/reactjs/react-rails/issues/87
   setup: function(ujs) {
     Turbolinks.pagesCached(0)
-    ujs.handleEvent('page:change', function() { ujs.mountComponents() });
-    ujs.handleEvent('page:receive', function() { ujs.unmountComponents() });
+    ujs.handleEvent('page:change', ujs.handleMount);
+    ujs.handleEvent('page:receive', ujs.handleUnmount);
+  },
+  teardown: function(ujs) {
+    ujs.removeEvent('page:change', ujs.handleMount);
+    ujs.removeEvent('page:receive', ujs.handleUnmount);
   }
 }
 

data/lib/react/rails/version.rb

@@ -1,7 +1,7 @@
 module React
   module Rails
     # If you change this, make sure to update VERSIONS.md
-    # And the version hint in README.md, if needed
-    VERSION = "2.0.0"
+    # and republish the UJS by updating package.json and `bundle exec rake ujs:publish`
+    VERSION = "2.0.2"
   end
 end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: react-rails
 version: !ruby/object:Gem::Version
-  version: 2.0.0
+  version: 2.0.2
 platform: ruby
 authors:
 - Paul O’Shannessy