fixed variable typo in findDOMNodes, added spec

Author: tannermares

lib/assets/javascripts/react_ujs.js

@@ -238,7 +238,7 @@ var ReactRailsUJS = {
 
   // helper method for the mount and unmount methods to find the
   // `data-react-class` DOM elements
-  findDOMNodes: function(selector) {
+  findDOMNodes: function(searchSelector) {
     var classNameAttr = ReactRailsUJS.CLASS_NAME_ATTR
     // we will use fully qualified paths as we do not bind the callbacks
     var selector, parent;
@@ -502,4 +502,4 @@ module.exports = function(reqctx) {
 
 /***/ })
 /******/ ]);
-});
+});

react_ujs/dist/react_ujs.js

@@ -238,7 +238,7 @@ var ReactRailsUJS = {
 
   // helper method for the mount and unmount methods to find the
   // `data-react-class` DOM elements
-  findDOMNodes: function(selector) {
+  findDOMNodes: function(searchSelector) {
     var classNameAttr = ReactRailsUJS.CLASS_NAME_ATTR
     // we will use fully qualified paths as we do not bind the callbacks
     var selector, parent;
@@ -502,4 +502,4 @@ module.exports = function(reqctx) {
 
 /***/ })
 /******/ ]);
-});
+});

react_ujs/index.js

@@ -20,7 +20,7 @@ var ReactRailsUJS = {
 
   // helper method for the mount and unmount methods to find the
   // `data-react-class` DOM elements
-  findDOMNodes: function(selector) {
+  findDOMNodes: function(searchSelector) {
     var classNameAttr = ReactRailsUJS.CLASS_NAME_ATTR
     // we will use fully qualified paths as we do not bind the callbacks
     var selector, parent;

test/dummy/app/views/pages/show.html.erb

@@ -1,10 +1,13 @@
 <ul>
-  <li><%= link_to 'Alice', page_path(:id => 0) %></li>
-  <li><%= link_to 'Bob', page_path(:id => 1) %></li>
+  <li><%= link_to 'Alice', page_path(id: 0) %></li>
+  <li><%= link_to 'Bob', page_path(id: 1) %></li>
 </ul>
 
 <div id='component-parent'>
-  <%= react_component 'GreetingMessage', { :name => @name }, { :id => 'component', prerender: @prerender } %>
+  <%= react_component 'GreetingMessage', { name: @name }, { id: 'component', prerender: @prerender } %>
+  <ul>
+    <%= react_component 'Todo', { todo: 'Another Component' }, { id: 'todo', prerender: @prerender } %>
+  </ul>
 </div>
 
 <button onClick="ReactRailsUJS.unmountComponents('#component-parent')">Unmount by parent selector</button>

test/react/rails/controller_lifecycle_test.rb

@@ -46,7 +46,7 @@ def teardown
   test "it calls setup and teardown methods" do
     get '/pages/1?param_test=123'
     helper_obj = controller.__react_component_helper
-    lifecycle_steps = ["123", :react_component, :teardown]
+    lifecycle_steps = ["123", :react_component, :react_component, :teardown]
     assert_equal(lifecycle_steps, helper_obj.events)
   end
 

test/react/rails/react_rails_ujs_test.rb

@@ -124,6 +124,21 @@ def refute_greeting(page, greeting)
       assert_greeting(page, 'Hello Bob')
     end
 
+    test 'react_ujs does not unmount components that do not match a selector reference for the component' do
+      visit '/pages/1'
+      assert_greeting page, 'Hello Bob'
+      assert page.has_content?('Another Component'), page.body
+
+      page.click_button "Unmount by own selector"
+      refute_greeting(page, 'Hello Bob')
+      assert page.has_content?('Another Component'), page.body
+
+      page.click_button "Mount by own selector"
+      assert_greeting(page, 'Hello Bob')
+      assert page.has_content?('Another Component'), page.body
+    end
+
+
     test 'react_ujs can unmount/mount using a dom node context' do
       visit '/pages/1'
       assert_greeting(page, 'Hello Bob')