isomorfeus-react 16.12.11 → 16.12.12

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 5bd800a1904a42600ff9e2fc9f13fefecb7cff632c5804c035270dbf08190153
-  data.tar.gz: a89ec7399fd872fd0f22c8125ad6cd0bf181292207fb48dc3256fc09481bee39
+  metadata.gz: 331181f0913df3ce50e11f4e6d4aa062bd6d329a8d4442d0c0d00c7ff9041a1d
+  data.tar.gz: 9f0c73b00b5a5476b47a62bf6212df26ee69144445af822ee167a5e018495c32
 SHA512:
-  metadata.gz: 33548792159ab94a1fe617d5b643171791238c7e845b8faa033ae1874bc04b36106a1745d687591521a09ccdf55a7277b9c144473a7705e3111014847ceb42c0
-  data.tar.gz: 85e4cb089330099e2cee4c93801bf13a7a0930a6b5ac52c785f4e35357c002f8392b981fc93d838759249676e9f6f4e361afcdbf87ba5d8a6535d6efaa49f911
+  metadata.gz: f5f8afde93bbd151bc29b8e28fc38951c75380de3bea39fc85b6df2ddaf5da8cab28bd5e387610298c8cb56bbc2f15ba7db1ec56f6b91cd336f25bdfd160a1d2
+  data.tar.gz: 0763e89fb0c282cb7294e02caa355d92ba39acc95c13e8fc7fb4ff39f30652425a0489b11d64a8f8137e611ccf3fb602e15c82b15e644c2d0c30929dcc75d12d

data/lib/isomorfeus/config.rb

@@ -147,4 +147,17 @@ module Isomorfeus
       end
     end
   end
+
+  class << self
+    def raise_error(error_class: nil, message: nil, stack: nil)
+      error_class = RuntimeError unless error_class
+      execution_environment = if on_browser? then 'on Browser'
+                              elsif on_ssr? then 'in Server Side Rendering'
+                              elsif on_server? then 'on Server'
+                              end
+      error = error_class.new("Isomorfeus in #{env} #{execution_environment}:\n#{message}")
+      error.set_backtrace(stack) if stack
+      raise error
+    end
+  end
 end

data/lib/isomorfeus/props/validator.rb

@@ -34,7 +34,7 @@ module Isomorfeus
                  end
             @v = !!@v if @o[:type] == :boolean
           rescue
-            raise "#{@c}: #{@p} cast failed" unless @v.class == @o[:class]
+            Isomorfeus.raise_error(message: "#{@c}: #{@p} cast failed") unless @v.class == @o[:class]
           end
         end
       end
@@ -54,13 +54,13 @@ module Isomorfeus
       def type!
         return if @o[:allow_nil] && @v.nil?
         if @o.key?(:class)
-          raise "#{@c}: #{@p} class not #{@o[:class]}" unless @v.class == @o[:class]
+          Isomorfeus.raise_error(message: "#{@c}: #{@p} class not #{@o[:class]}") unless @v.class == @o[:class]
         elsif @o.key?(:is_a)
-          raise "#{@c}: #{@p} is not a #{@o[:is_a]}" unless @v.is_a?(@o[:is_a])
+          Isomorfeus.raise_error(message: "#{@c}: #{@p} is not a #{@o[:is_a]}") unless @v.is_a?(@o[:is_a])
         elsif @o.key?(:type)
           case @o[:type]
           when :boolean
-            raise "#{@c}: #{@p} is not a boolean" unless @v.class == TrueClass || @v.class == FalseClass
+            Isomorfeus.raise_error(message: "#{@c}: #{@p} is not a boolean") unless @v.class == TrueClass || @v.class == FalseClass
           end
         end
       end
@@ -77,48 +77,48 @@ module Isomorfeus
 
       # specific validations
       def c_gt(v)
-        raise "#{@c}: #{@p} not greater than #{v}!" unless @v > v
+        Isomorfeus.raise_error(message: "#{@c}: #{@p} not greater than #{v}!") unless @v > v
       end
 
       def c_lt(v)
-        raise "#{@c}: #{@p} not less than #{v}!" unless @v < v
+        Isomorfeus.raise_error(message: "#{@c}: #{@p} not less than #{v}!") unless @v < v
       end
 
       def c_keys(v)
-        raise "#{@c}: #{@p} keys dont fit!" unless @v.keys.sort == v.sort
+        Isomorfeus.raise_error(message: "#{@c}: #{@p} keys dont fit!") unless @v.keys.sort == v.sort
       end
 
       def c_size(v)
-        raise "#{@c}: #{@p} length/size is not #{v}" unless @v.size == v
+        Isomorfeus.raise_error(message: "#{@c}: #{@p} length/size is not #{v}") unless @v.size == v
       end
 
       def c_matches(v)
-        raise "#{@c}: #{@p} does not match #{v}" unless v.match?(@v)
+        Isomorfeus.raise_error(message: "#{@c}: #{@p} does not match #{v}") unless v.match?(@v)
       end
 
       def c_max(v)
-        raise "#{@c}: #{@p} is larger than #{v}" unless @v <= v
+        Isomorfeus.raise_error(message: "#{@c}: #{@p} is larger than #{v}") unless @v <= v
       end
 
       def c_min(v)
-        raise "#{@c}: #{@p} is smaller than #{v}" unless @v >= v
+        Isomorfeus.raise_error(message: "#{@c}: #{@p} is smaller than #{v}") unless @v >= v
       end
 
       def c_max_size(v)
-        raise "#{@c}: #{@p} is larger than #{v}" unless @v.size <= v
+        Isomorfeus.raise_error(message: "#{@c}: #{@p} is larger than #{v}") unless @v.size <= v
       end
 
       def c_min_size(v)
-        raise "#{@c}: #{@p} is smaller than #{v}" unless @v.size >= v
+        Isomorfeus.raise_error(message: "#{@c}: #{@p} is smaller than #{v}") unless @v.size >= v
       end
 
       def c_direction(v)
-        raise "#{@c}: #{@p} is positive" if v == :negative && @v >= 0
-        raise "#{@c}: #{@p} is negative" if v == :positive && @v < 0
+        Isomorfeus.raise_error(message: "#{@c}: #{@p} is positive") if v == :negative && @v >= 0
+        Isomorfeus.raise_error(message: "#{@c}: #{@p} is negative") if v == :positive && @v < 0
       end
 
       def c_test
-        raise "#{@c}: #{@p} test condition check failed" unless @o[:test].call(@v)
+        Isomorfeus.raise_error(message: "#{@c}: #{@p} test condition check failed") unless @o[:test].call(@v)
       end
 
       def c_sub_type(v)

data/lib/isomorfeus/react_view_helper.rb

@@ -35,12 +35,15 @@ module Isomorfeus
           begin
             asset = Net::HTTP.get(URI(asset_path))
           rescue Exception => e
-            raise "SSR: Failed loading asset #{asset_path} from webpack dev server. Error: #{e.message}"
+            Isomorfeus.raise_error(message: "Server Side Rendering: Failed loading asset #{asset_path} from webpack dev server. Error: #{e.message}")
+          end
+          if asset.strip.start_with?('<')
+            Isomorfeus.raise_error(message: "Server Side Rendering: Failed loading asset #{asset_path} from webpack dev server, asset is not javascript. Did the webpack build succeed?")
           end
           begin
             Isomorfeus.ssr_contexts[thread_id_asset] = ExecJS.permissive_compile(asset)
           rescue Exception => e
-            raise "SSR: Failed creating context for #{asset_path}. Error: #{e.message}"
+            Isomorfeus.raise_error(message: "Server Side Rendering: Failed creating context for #{asset_path}. Error: #{e.message}")
           end
         else
           # initialize speednode context
@@ -58,6 +61,7 @@ module Isomorfeus
           global.Opal.React.active_components = [];
           global.Opal.React.active_redux_components = [];
           global.FirstPassFinished = false;
+          global.Exception = false;
           global.Opal.Isomorfeus['$env=']('#{Isomorfeus.env}');
           if (typeof global.Opal.Isomorfeus.$negotiated_locale === 'function') {
             global.Opal.Isomorfeus["$negotiated_locale="]('#{props[:locale]}');
@@ -74,14 +78,18 @@ module Isomorfeus
         api_ws_path = Isomorfeus.respond_to?(:api_websocket_path) ? Isomorfeus.api_websocket_path : ''
         transport_ws_url = ws_scheme + location_host + api_ws_path
         javascript << <<~JAVASCRIPT
-          var api_ws_path = '#{api_ws_path}';
+          let api_ws_path = '#{api_ws_path}';
+          let exception;
           if (typeof global.Opal.Isomorfeus.Transport !== 'undefined' && api_ws_path !== '') {
             global.Opal.Isomorfeus.TopLevel["$transport_ws_url="]("#{transport_ws_url}");
             global.Opal.send(global.Opal.Isomorfeus.Transport.$promise_connect(), 'then', [], ($$1 = function(){
               try {
                 global.Opal.Isomorfeus.TopLevel.$render_component_to_string('#{component_name}', #{Oj.dump(props, mode: :strict)});
                 global.FirstPassFinished = 'transport';
-              } catch (e) { global.FirstPassFinished = 'transport'; }
+              } catch (e) {
+                global.Exception = e; 
+                global.FirstPassFinished = 'transport';               
+              }
             }, $$1.$$s = this, $$1.$$arity = 0, $$1))
           } else { return global.FirstPassFinished = true; };
         JAVASCRIPT
@@ -91,7 +99,8 @@ module Isomorfeus
 
         # wait for first pass to finish
         unless first_pass_skipped
-          first_pass_finished = Isomorfeus.ssr_contexts[thread_id_asset].exec('return global.FirstPassFinished')
+          first_pass_finished, exception = Isomorfeus.ssr_contexts[thread_id_asset].exec('return [global.FirstPassFinished, global.Exception ? { message: global.Exception.message, stack: global.Exception.stack } : false ]')
+          Isomorfeus.raise_error(message: "Server Side Rendering: #{exception['message']}", stack: exception['stack']) if exception
           unless first_pass_finished
             start_time = Time.now
             while !first_pass_finished
@@ -121,6 +130,7 @@ module Isomorfeus
           global.Opal.React.render_buffer = [];
           global.Opal.React.active_components = [];
           global.Opal.React.active_redux_components = [];
+          global.Exception = false;
           let rendered_tree;
           let ssr_styles;
           let component;
@@ -135,7 +145,7 @@ module Isomorfeus
               rendered_tree = global.Opal.global.ReactDOMServer.renderToString(sheets.collect(app));
               ssr_styles = sheets.toString();
             } catch (e) {
-              rendered_tree = e.message + "\\n" + e.stack;
+              global.Exception = e;
             }
           } else if (typeof global.Opal.global.ReactJSS !== 'undefined' && typeof global.Opal.global.ReactJSS.SheetsRegistry !== 'undefined') {
             component = '#{component_name}'.split(".").reduce(function(o, x) {
@@ -150,26 +160,26 @@ module Isomorfeus
               rendered_tree = global.Opal.global.ReactDOMServer.renderToString(element);
               ssr_styles = sheets.toString();
             } catch (e) {
-              rendered_tree = e.message + "\\n" + e.stack;
+              global.Exception = e;
             }
           } else {
             try {
               rendered_tree = global.Opal.Isomorfeus.TopLevel.$render_component_to_string('#{component_name}', #{Oj.dump(props, mode: :strict)});
             } catch (e) {
-              rendered_tree = e.message + "\\n" + e.stack;
+              global.Exception = e;
             }
           }
           let application_state = global.Opal.Isomorfeus.store.native.getState();
           if (typeof global.Opal.Isomorfeus.Transport !== 'undefined') { global.Opal.Isomorfeus.Transport.$disconnect(); }
-          return [rendered_tree, application_state, ssr_styles, global.Opal.Isomorfeus['$ssr_response_status']()];
+          return [rendered_tree, application_state, ssr_styles, global.Opal.Isomorfeus['$ssr_response_status'](), global.Exception ? { message: global.Exception.message, stack: global.Exception.stack } : false];
         JAVASCRIPT
 
         # execute second render pass
-        rendered_tree, application_state, @ssr_styles, @ssr_response_status = Isomorfeus.ssr_contexts[thread_id_asset].exec(javascript)
+        rendered_tree, application_state, @ssr_styles, @ssr_response_status, exception = Isomorfeus.ssr_contexts[thread_id_asset].exec(javascript)
+        Isomorfeus.raise_error(message: "Server Side Rendering: #{exception['message']}", stack: exception['stack']) if exception
 
         # build result
         render_result << " data-iso-hydrated='true'" if rendered_tree
-        # render_result << " data-iso-nloc='#{props[:locale]}' data-iso-state='#{Oj.dump(application_state, mode: :strict)}'>"
         render_result << " data-iso-nloc='#{props[:locale]}'>"
         render_result << (rendered_tree ? rendered_tree : "SSR didn't work")
       else

data/lib/isomorfeus/top_level.rb

@@ -5,7 +5,7 @@ module Isomorfeus
         Isomorfeus.init
         Isomorfeus::TopLevel.on_ready do
           root_element = `document.querySelector('div[data-iso-root]')`
-          raise "Isomorfeus root element not found!" unless root_element
+          Isomorfeus.raise_error(message: "Isomorfeus root element not found!") unless root_element
           component_name = root_element.JS.getAttribute('data-iso-root')
           Isomorfeus.env = root_element.JS.getAttribute('data-iso-env')
           component = nil

data/lib/isomorfeus-react.rb

@@ -71,7 +71,6 @@ if RUBY_ENGINE == 'opal'
   require 'react/component/location'
   require 'react/component/history'
   require 'react/component/resolution'
-  require 'react/component/event_handler'
   require 'react/component/styles'
   require 'react/component/mixin'
   require 'react/component/base'

data/lib/isomorfeus_react/lucid_app/mixin.rb

@@ -5,7 +5,6 @@ module LucidApp
       base.extend(::LucidApp::NativeLucidComponentConstructor)
       base.extend(::LucidApp::NativeComponentConstructor)
       base.extend(::LucidPropDeclaration::Mixin)
-      base.extend(::React::Component::EventHandler)
       base.extend(::LucidComponent::EnvironmentSupport)
       base.include(::LucidComponent::EnvironmentSupport)
       base.include(::React::Component::Elements)

data/lib/isomorfeus_react/lucid_app/native_lucid_component_constructor.rb

@@ -32,10 +32,6 @@ module LucidApp
               this.state.component_state = {};
               this.state.component_state[this.__object_id] = {};
             };
-            var event_handlers = #{base.event_handlers};
-            for (var i = 0; i < event_handlers.length; i++) {
-              this[event_handlers[i]] = this[event_handlers[i]].bind(this);
-            }
             var defined_refs = #{base.defined_refs};
             for (var ref in defined_refs) {
               if (defined_refs[ref] != null) {

data/lib/isomorfeus_react/lucid_component/mixin.rb

@@ -5,7 +5,6 @@ module LucidComponent
       base.extend(::LucidComponent::NativeLucidComponentConstructor)
       base.extend(::LucidComponent::NativeComponentConstructor)
       base.extend(::LucidPropDeclaration::Mixin)
-      base.extend(::React::Component::EventHandler)
       base.extend(::LucidComponent::EnvironmentSupport)
       base.include(::LucidComponent::EnvironmentSupport)
       base.include(::React::Component::Elements)

data/lib/isomorfeus_react/lucid_component/native_lucid_component_constructor.rb

@@ -22,10 +22,6 @@ module LucidComponent
               this.state.component_state = {};
               this.state.component_state[this.__object_id] = {};
             };
-            var event_handlers = #{base.event_handlers};
-            for (var i = 0; i < event_handlers.length; i++) {
-              this[event_handlers[i]] = this[event_handlers[i]].bind(this);
-            }
             var defined_refs = #{base.defined_refs};
             for (var ref in defined_refs) {
               if (defined_refs[ref] != null) {

data/lib/isomorfeus_react/lucid_func/initializer.rb

@@ -6,14 +6,6 @@ module LucidFunc
       @app_store = LucidComponent::AppStoreProxy.new(self)
       @class_store = LucidComponent::ClassStoreProxy.new(self)
       @store = LucidComponent::InstanceStoreProxy.new(self)
-      event_handlers = self.class.event_handlers
-      event_handler_source = self.class
-      %x{
-        for (var i = 0; i < event_handlers.length; i++) {
-          self[event_handlers[i]] = event_handler_source[event_handlers[i]];
-          self[event_handlers[i]] = self[event_handlers[i]].bind(self);
-        }
-      }
     end
   end
 end

data/lib/isomorfeus_react/lucid_func/mixin.rb

@@ -5,7 +5,6 @@ module LucidFunc
       base.include(::React::Component::Features)
       base.include(::LucidFunc::Initializer)
       base.include(::React::FunctionComponent::Api)
-      base.extend(::React::FunctionComponent::EventHandler)
       base.extend(::LucidComponent::EnvironmentSupport)
       base.include(::LucidComponent::EnvironmentSupport)
       base.extend(::LucidFunc::NativeComponentConstructor)

data/lib/isomorfeus_react/react/function_component/api.rb

@@ -66,7 +66,7 @@ module React
             block.$call();
             // console.log("get_react_element popping", Opal.React.render_buffer, Opal.React.render_buffer.toString())
             let new_element = Opal.React.render_buffer[Opal.React.render_buffer.length - 1].pop();
-            if (last_buffer_element === new_element) { #{raise "Block did not create any React element!"} }
+            if (last_buffer_element === new_element) { #{Isomorfeus.raise_error(message: "Block did not create any React element!")} }
             return new_element;
           }
         else
@@ -86,6 +86,16 @@ module React
       end
       alias rre render_react_element
 
+      def method_ref(method_symbol)
+        %x{
+          if (#{self}.method_refs && #{self}.method_refs[#{method_symbol}]) { return #{self}.method_refs[#{method_symbol}]; }
+          if (!#{self}.method_refs) { #{self}.method_refs = {}; }
+          #{self}.method_refs[#{method_symbol}] = #{method(method_symbol)};
+          return #{self}.method_refs[#{method_symbol}];
+        }
+      end
+      alias m_ref method_ref
+
       def to_n
         self
       end

data/lib/isomorfeus_react/react/function_component/initializer.rb

@@ -4,14 +4,6 @@ module React
       def initialize
         self.JS[:native_props] = `{ props: null }`
         @native_props = ::React::Component::Props.new(self)
-        event_handlers = self.class.event_handlers
-        event_handler_source = self.class
-        %x{
-          for (var i = 0; i < event_handlers.length; i++) {
-            self[event_handlers[i]] = event_handler_source[event_handlers[i]];
-            self[event_handlers[i]] = self[event_handlers[i]].bind(self);
-          }
-        }
       end
     end
   end

data/lib/isomorfeus_react/react/function_component/mixin.rb

@@ -6,7 +6,6 @@ module React
         base.include(::React::Component::Features)
         base.include(::React::FunctionComponent::Initializer)
         base.include(::React::FunctionComponent::Api)
-        base.extend(::React::FunctionComponent::EventHandler)
         base.extend(::React::FunctionComponent::NativeComponentConstructor)
       end
     end

data/lib/isomorfeus_react/react/memo_component/mixin.rb

@@ -6,7 +6,6 @@ module React
         base.include(::React::Component::Features)
         base.include(::React::FunctionComponent::Initializer)
         base.include(::React::FunctionComponent::Api)
-        base.extend(::React::FunctionComponent::EventHandler)
         base.extend(::React::MemoComponent::NativeComponentConstructor)
       end
     end

data/lib/isomorfeus_react_material/lucid_material/app/mixin.rb

@@ -6,7 +6,6 @@ module LucidMaterial
         base.extend(::LucidApp::NativeLucidComponentConstructor)
         base.extend(::LucidMaterial::App::NativeComponentConstructor)
         base.extend(::LucidPropDeclaration::Mixin)
-        base.extend(::React::Component::EventHandler)
         base.extend(::LucidComponent::EnvironmentSupport)
         base.include(::LucidComponent::EnvironmentSupport)
         base.include(::React::Component::Elements)

data/lib/isomorfeus_react_material/lucid_material/component/mixin.rb

@@ -6,7 +6,6 @@ module LucidMaterial
         base.extend(::LucidComponent::NativeLucidComponentConstructor)
         base.extend(::LucidMaterial::Component::NativeComponentConstructor)
         base.extend(::LucidPropDeclaration::Mixin)
-        base.extend(::React::Component::EventHandler)
         base.extend(::LucidComponent::EnvironmentSupport)
         base.include(::LucidComponent::EnvironmentSupport)
         base.include(::React::Component::Elements)

data/lib/isomorfeus_react_material/lucid_material/func/mixin.rb

@@ -6,7 +6,6 @@ module LucidMaterial
         base.include(::React::Component::Features)
         base.include(::LucidFunc::Initializer)
         base.include(::React::FunctionComponent::Api)
-        base.extend(::React::FunctionComponent::EventHandler)
         base.extend(::LucidComponent::EnvironmentSupport)
         base.include(::LucidComponent::EnvironmentSupport)
         base.extend(::LucidMaterial::Func::NativeComponentConstructor)

data/lib/lucid_prop_declaration/mixin.rb

@@ -78,7 +78,7 @@ module LucidPropDeclaration
       props = {} unless props
       declared_props.each_key do |prop|
         if declared_props[prop].key?(:required) && declared_props[prop][:required] && !props.key?(prop)
-          raise "Required prop #{prop} not given!"
+          Isomorfeus.raise_error(message: "Required prop #{prop} not given!")
         end
       end
       result = true

data/lib/react/component/api.rb

@@ -86,7 +86,7 @@ module React
             block.$call();
             // console.log("get_react_element popping", Opal.React.render_buffer, Opal.React.render_buffer.toString())
             let new_element = Opal.React.render_buffer[Opal.React.render_buffer.length - 1].pop();
-            if (last_buffer_element === new_element) { #{raise "Block did not create any React element!"} }
+            if (last_buffer_element === new_element) { #{Isomorfeus.raise_error(message: "Block did not create any React element!")} }
             return new_element;
           }
         else
@@ -106,6 +106,7 @@ module React
           return #@native.method_refs[#{method_symbol}];
         }
       end
+      alias m_ref method_ref
 
       def render_react_element(el)
         # push el to buffer

data/lib/react/component/mixin.rb

@@ -5,7 +5,6 @@ module React
         base.include(::Native::Wrapper)
         base.extend(::React::Component::NativeComponentConstructor)
         base.extend(::LucidPropDeclaration::Mixin)
-        base.extend(::React::Component::EventHandler)
         base.include(::React::Component::Elements)
         base.include(::React::Component::Api)
         base.include(::React::Component::Callbacks)

data/lib/react/component/native_component_constructor.rb

@@ -17,10 +17,6 @@ module React
                 this.state = {};
               };
               this.__ruby_instance = base.$new(this);
-              var event_handlers = #{base.event_handlers};
-              for (var i = 0; i < event_handlers.length; i++) {
-                this[event_handlers[i]] = this[event_handlers[i]].bind(this);
-              }
               var defined_refs = #{base.defined_refs};
               for (var ref in defined_refs) {
                 if (defined_refs[ref] != null) {

data/lib/react/native_constant_wrapper.rb

@@ -22,7 +22,7 @@ module React
         if (component) {
           return Opal.React.internal_prepare_args_and_render(component, args, block);
         } else {
-          #{raise NameError, "No such native Component #@const_name.#{name}"};
+          #{Isomorfeus.raise_error(error_class: NameError, message: "No such native Component #@const_name.#{name}")};
         }
       }
     end

data/lib/react/version.rb

@@ -1,3 +1,3 @@
 module React
-  VERSION = '16.12.11'
+  VERSION = '16.12.12'
 end

data/lib/react.rb

@@ -37,17 +37,62 @@ module React
         key = keys[i];
         if (key[0] === 'o' && key[1] === 'n' && key[2] === '_') {
           let handler = ruby_style_props['$[]'](key);
-          if (typeof handler === "function") {
+          let type = typeof handler;
+          if (type === "function") {
             let active_c = self.active_component();
             result[Opal.React.lower_camelize(key)] = function(event, info) {
               let ruby_event;
               if (typeof event === "object") { #{ruby_event = ::React::SyntheticEvent.new(`event`)}; }
-              else { #{ruby_event = `event`}; }
+              else { ruby_event = event; }
               #{`active_c.__ruby_instance`.instance_exec(ruby_event, `info`, &`handler`)};
             }
+          } else if (type === "object" && typeof handler.$call === "function" ) {
+            if (!handler.react_event_handler_function) {
+              handler.react_event_handler_function = function(event, info) {
+                let ruby_event;
+                if (typeof event === "object") { #{ruby_event = ::React::SyntheticEvent.new(`event`)}; }
+                else { ruby_event = event; }
+                handler.$call(ruby_event, `info`)
+              };
+            }
+            result[Opal.React.lower_camelize(key)] = handler.react_event_handler_function;
+          } else if (type === "string" ) {
+            let active_component = Opal.React.active_component();
+            let method_ref;
+            let method_name = '$' + handler;
+            if (typeof active_component[method_name] === "function") {
+              // got a ruby instance
+              if (active_component.native && active_component.native.method_refs && active_component.native.method_refs[handler]) { method_ref = active_component.native.method_refs[handler]; } // ruby instance with native
+              else if (active_component.method_refs && active_component.method_refs[handler]) { method_ref = active_component.method_refs[handler]; } // ruby function component
+              else { method_ref = active_component.$method_ref(handler); } // create the ref
+            } else if (typeof active_component.__ruby_instance[method_name] === "function") {
+              // got a native instance
+              if (active_component.method_refs && active_component.method_refs[handler]) { method_ref = active_component.method_refs[handler]; }
+              else { method_ref = active_component.__ruby_instance.$method_ref(handler); } // create ref for native
+            }
+            if (method_ref) {
+              if (!method_ref.react_event_handler_function) {
+                method_ref.react_event_handler_function = function(event, info) {
+                  let ruby_event;
+                  if (typeof event === "object") { #{ruby_event = ::React::SyntheticEvent.new(`event`)}; }
+                  else { ruby_event = event; }
+                  method_ref.$call(ruby_event, `info`)
+                };
+              }
+              result[Opal.React.lower_camelize(key)] = method_ref.react_event_handler_function;
+            } else {
+              let component_name;
+              if (active_component.__ruby_instance) { component_name = active_component.__ruby_instance.$to_s(); }
+              else { component_name = active_component.$to_s(); }
+              #{Isomorfeus.raise_error(message: "Is #{`handler`} a valid method of #{`component_name`}? If so then please use: #{`key`}: method_ref(:#{`handler`}) within component: #{`component_name`}")}
+            }
           } else {
             let active_component = Opal.React.active_component();
-            result[Opal.React.lower_camelize(key)] = active_component[handler];
+            let component_name;
+            if (active_component.__ruby_instance) { component_name = active_component.__ruby_instance.$to_s(); }
+            else { component_name = active_component.$to_s(); }
+            #{Isomorfeus.raise_error(message: "Received invalid value for #{`key`} with #{`handler`} within component: #{`component_name`}")}
+            console.error( + key + " event handler:", handler, " within component:", self.active_component());
           }
         } else if (key[0] === 'a' && key.startsWith("aria_")) {
           result[key.replace("_", "-")] = ruby_style_props['$[]'](key);

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: isomorfeus-react
 version: !ruby/object:Gem::Version
-  version: 16.12.11
+  version: 16.12.12
 platform: ruby
 authors:
 - Jan Biedermann
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2020-01-20 00:00:00.000000000 Z
+date: 2020-01-25 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: concurrent-ruby
@@ -228,7 +228,6 @@ files:
 - lib/isomorfeus_react/lucid_func/native_component_constructor.rb
 - lib/isomorfeus_react/react/function_component/api.rb
 - lib/isomorfeus_react/react/function_component/base.rb
-- lib/isomorfeus_react/react/function_component/event_handler.rb
 - lib/isomorfeus_react/react/function_component/initializer.rb
 - lib/isomorfeus_react/react/function_component/mixin.rb
 - lib/isomorfeus_react/react/function_component/native_component_constructor.rb
@@ -253,7 +252,6 @@ files:
 - lib/react/component/base.rb
 - lib/react/component/callbacks.rb
 - lib/react/component/elements.rb
-- lib/react/component/event_handler.rb
 - lib/react/component/features.rb
 - lib/react/component/history.rb
 - lib/react/component/initializer.rb
@@ -277,7 +275,13 @@ licenses:
 - MIT
 metadata:
   github_repo: ssh://github.com/isomorfeus/gems
-post_install_message: 
+post_install_message: |2+
+
+  isomorfeus-react 16.12.12:
+   Breaking change:
+     The event_handler DSL is gone. Instead use normal methods and method_ref, see:
+     https://github.com/isomorfeus/isomorfeus-react/blob/master/ruby/docs/events.md
+
 rdoc_options: []
 require_paths:
 - lib

data/lib/isomorfeus_react/react/function_component/event_handler.rb

@@ -1,21 +0,0 @@
-module React
-  module FunctionComponent
-    module EventHandler
-      def event_handlers
-        @event_handlers ||= []
-      end
-
-      def event_handler(name, &block)
-        event_handlers << name
-        %x{
-          var fun = function(event, info) {
-            if (typeof event === "object") { #{ruby_event = ::React::SyntheticEvent.new(`event`)}; }
-            else { #{ruby_event = `event`}; }
-            #{`this`.instance_exec(ruby_event, `info`, &block)};
-          }
-          self[name] = fun;
-        }
-      end
-    end
-  end
-end

data/lib/react/component/event_handler.rb

@@ -1,23 +0,0 @@
-module React
-  module Component
-    module EventHandler
-      def event_handlers
-        @event_handlers ||= []
-      end
-
-      def event_handler(name, &block)
-        event_handlers << name
-        %x{
-          var fun = function(event, info) {
-            let ruby_event;
-            if (typeof event === "object") { #{ruby_event = ::React::SyntheticEvent.new(`event`)}; }
-            else { #{ruby_event = `event`}; }
-            #{`this.__ruby_instance`.instance_exec(ruby_event, `info`, &block)};
-          }
-          if (self.lucid_react_component) { self.lucid_react_component.prototype[name] = fun; }
-          else { self.react_component.prototype[name] = fun; }
-        }
-      end
-    end
-  end
-end