diff --git a/lib/react/api.rb b/lib/react/api.rb index a60aa88..16aef16 100644 --- a/lib/react/api.rb +++ b/lib/react/api.rb @@ -71,7 +71,7 @@ class extends React.Component { this.__opalInstanceSyncSetState = true; this.__opalInstance.$component_will_mount(); this.__opalInstanceSyncSetState = false; - } + } } componentDidMount() { this.__opalInstance.is_mounted = true @@ -171,6 +171,10 @@ def self.convert_props(properties) props["className"] = value elsif ["style", "dangerously_set_inner_HTML"].include? key props[lower_camelize(key)] = value.to_n + + elsif key == "key" + props["key"] = value.to_key + elsif key == 'ref' && value.is_a?(Proc) props[key] = %x{ function(dom_node){ diff --git a/lib/react/object.rb b/lib/react/object.rb index efeb700..02f7b92 100644 --- a/lib/react/object.rb +++ b/lib/react/object.rb @@ -12,4 +12,19 @@ def const_missing(const_name) React::Component::Tags.html_tag_class_for(const_name) || raise(e) end end + + def to_key + object_id + end +end +class Number + def to_key + self + end +end + +class Boolean + def to_key + self + end end diff --git a/spec/react/key_to_react_spec.rb b/spec/react/key_to_react_spec.rb new file mode 100644 index 0000000..04cd11f --- /dev/null +++ b/spec/react/key_to_react_spec.rb @@ -0,0 +1,29 @@ +require 'spec_helper' + +describe 'key_to_react helper', js: true do + it "will use the use the to_key method to get the react key" do + mount "TestComponent" do + class MyTestClass + attr_reader :to_key_called + def to_key + @to_key_called = true + super + end + end + class TestComponent < Hyperloop::Component + before_mount { @test_object = MyTestClass.new } + render do + DIV(key: @test_object) { TestComponent2(test_object: @test_object) } + end + end + class TestComponent2 < Hyperloop::Component + param :test_object + render do + "to key was called!" if params.test_object.to_key_called + end + end + end + pause + expect(page).to have_content('to key was called!') + end +end diff --git a/spec/react/to_key_spec.rb b/spec/react/to_key_spec.rb new file mode 100644 index 0000000..aa33c7a --- /dev/null +++ b/spec/react/to_key_spec.rb @@ -0,0 +1,28 @@ +require 'spec_helper' + +describe 'to_key helper', js: true do + it "has added 'to_key' method to Object and each key is different" do + expect_evaluate_ruby do + Object.new.to_key != Object.new.to_key + end.to be_truthy + end + + it "to_key return 'self' for String objects" do + expect_evaluate_ruby do + debugger + "hello".to_key == "hello" + end.to be_truthy + end + + it "to_key return 'self' for Number objects" do + expect_evaluate_ruby do + 12.to_key == 12 + end.to be_truthy + end + + it "to_key return 'self' for Boolean objects" do + expect_evaluate_ruby do + true.to_key == true && false.to_key == false + end.to be_truthy + end +end