closes #55 closes #56

Author: catmando

ruby/hyper-component/Gemfile.lock

@@ -1,7 +1,7 @@
 PATH
   remote: ../hyper-spec
   specs:
-    hyper-spec (1.0.rc1)
+    hyper-spec (1.0.alpha1)
       capybara
       chromedriver-helper (= 1.2.0)
       libv8 (~> 6.3.0)
@@ -20,22 +20,22 @@ PATH
 PATH
   remote: ../hyper-state
   specs:
-    hyper-state (1.0.rc1)
-      hyperstack-config (= 1.0.rc1)
+    hyper-state (1.0.alpha1)
+      hyperstack-config (= 1.0.alpha1)
       opal (>= 0.11.0, < 0.12.0)
 
 PATH
   remote: ../hyper-store
   specs:
-    hyper-store (1.0.rc1)
-      hyper-state (= 1.0.rc1)
-      hyperstack-config (= 1.0.rc1)
+    hyper-store (1.0.alpha1)
+      hyper-state (= 1.0.alpha1)
+      hyperstack-config (= 1.0.alpha1)
       opal (>= 0.11.0, < 0.12.0)
 
 PATH
   remote: ../hyperstack-config
   specs:
-    hyperstack-config (1.0.rc1)
+    hyperstack-config (1.0.alpha1)
       libv8 (~> 6.3.0)
       listen (~> 3.0)
       mini_racer (~> 0.1.15)
@@ -47,9 +47,9 @@ PATH
 PATH
   remote: .
   specs:
-    hyper-component (1.0.rc1)
-      hyper-state (= 1.0.rc1)
-      hyperstack-config (= 1.0.rc1)
+    hyper-component (1.0.alpha1)
+      hyper-state (= 1.0.alpha1)
+      hyperstack-config (= 1.0.alpha1)
       libv8 (~> 6.3.0)
       mini_racer (~> 0.1.15)
       opal (>= 0.11.0, < 0.12.0)

ruby/hyper-component/lib/hyperstack/component.rb

@@ -30,10 +30,15 @@ def self.included(base)
       base.extend(Hyperstack::Internal::Component::ClassMethods)
     end
 
+    def self.mounted_components
+      @__hyperstack_component_mounted_components ||= Set.new
+    end
+
     def self.force_update!
-      components = Hyperstack::Internal::Component.mounted_components.to_a
+      components = mounted_components.to_a # need a copy as force_update may change the list
       components.each do |comp|
-        next unless Hyperstack::Internal::Component.mounted_components.include? comp
+        # check if its still mounted
+        next unless mounted_components.include? comp
         comp.force_update!
       end
     end
@@ -62,7 +67,7 @@ def component_will_mount
       @__hyperstack_component_params_wrapper = self.class.props_wrapper.new(self)
       IsomorphicHelpers.load_context(true) if IsomorphicHelpers.on_opal_client?
       observing(immediate_update: true) do
-        Hyperstack::Internal::Component.mounted_components << self
+        Hyperstack::Component.mounted_components << self
         run_callback(:before_mount, props)
       end
     end
@@ -96,7 +101,7 @@ def component_will_unmount
       observing do
         unmount # runs unmount callbacks as well
         remove
-        Hyperstack::Internal::Component.mounted_components.delete self
+        Hyperstack::Component.mounted_components.delete self
       end
     end
 

ruby/hyper-component/lib/hyperstack/internal/component.rb

@@ -4,13 +4,4 @@ module Hyperstack
 
   define_setting :prerendering, :off if RUBY_ENGINE != 'opal'
 
-  module Internal
-    module Component
-      class << self
-        def mounted_components
-          @__hyperstack_component_mounted_components ||= Set.new
-        end
-      end
-    end
-  end
 end

ruby/hyper-component/lib/hyperstack/internal/component/class_methods.rb

@@ -12,6 +12,10 @@ def hyper_component?
           true
         end
 
+        def mounted_components
+          Hyperstack::Component.mounted_components.select { |c| c.class <= self }
+        end
+
         def param_accessor_style(*args)
           props_wrapper.param_accessor_style(*args)
         end

ruby/hyper-component/spec/client_features/component_spec.rb

@@ -177,6 +177,51 @@ def render
       end
       expect_evaluate_ruby('Foo.instance == Foo.instance.force_update!').to be_truthy
     end
+
+    it 'has a class components method' do
+      mount 'Foo' do
+        class Bar < HyperComponent
+          param :id
+          render { inspect }
+        end
+        class Baz < HyperComponent
+          param :id
+          render { inspect }
+        end
+        class BarChild < Bar
+        end
+        class Foo
+          include Hyperstack::Component
+          def render
+            DIV do
+              Bar(id: 1)
+              Bar(id: 2)
+              Baz(id: 3)
+              Baz(id: 4)
+              BarChild(id: 5)
+              BarChild(id: 6)
+            end
+          end
+        end
+        module Hyperstack::Component
+          def to_s
+            "#{self.class.name}#{':' + @Id.to_s if @Id}"
+          end
+        end
+      end
+      expect_evaluate_ruby("Hyperstack::Component.mounted_components")
+        .to contain_exactly("Hyperstack::Internal::Component::TopLevelRailsComponent", "Foo", "Bar:1", "Bar:2", "Baz:3", "Baz:4", "BarChild:5", "BarChild:6")
+      expect_evaluate_ruby("HyperComponent.mounted_components")
+        .to contain_exactly("Bar:1", "Bar:2", "Baz:3", "Baz:4", "BarChild:5", "BarChild:6")
+      expect_evaluate_ruby("Bar.mounted_components")
+        .to contain_exactly("Bar:1", "Bar:2", "BarChild:5", "BarChild:6")
+      expect_evaluate_ruby("Baz.mounted_components")
+        .to contain_exactly("Baz:3", "Baz:4")
+      expect_evaluate_ruby("BarChild.mounted_components")
+        .to contain_exactly("BarChild:5", "BarChild:6")
+      expect_evaluate_ruby("Foo.mounted_components")
+        .to contain_exactly("Foo")
+    end
   end
 
   describe 'state management' do

ruby/hyper-router/Gemfile

@@ -4,4 +4,5 @@ gem 'hyper-spec',        path: '../hyper-spec'
 gem 'hyperstack-config', path: '../hyperstack-config'
 gem 'hyper-state',       path: '../hyper-state'
 gem 'hyper-component',   path: '../hyper-component'
+gem 'hyper-store',       path: '../hyper-store'
 gemspec

ruby/hyper-router/hyper-router.gemspec

@@ -22,6 +22,7 @@ Gem::Specification.new do |spec|
   spec.add_development_dependency 'chromedriver-helper'
   spec.add_development_dependency 'database_cleaner'
   spec.add_development_dependency 'hyper-spec', HyperRouter::VERSION
+  spec.add_development_dependency 'hyper-store', HyperRouter::VERSION
   spec.add_development_dependency 'listen'
   spec.add_development_dependency 'mini_racer', '~> 0.1.15'
   spec.add_development_dependency 'opal-rails', '~> 0.9.4'

ruby/hyper-router/lib/hyperstack/router.rb

@@ -18,7 +18,7 @@ def location
 
         after_mount do
           @_react_router_unlisten = history.listen do |location, _action|
-            Hyperstack::Internal::State::Mapper.observed! Hyperstack::Router::Location
+            Hyperstack::Internal::State::Mapper.mutated! Hyperstack::Router::Location
           end
         end
 

ruby/hyper-router/spec/hyper-router/basic_dsl_spec.rb

@@ -4,13 +4,17 @@
 
   it "can route" do
     visit '/'
+    expect(page.find('a', id: 'isolated_nav_link')[:class]).not_to include('selected')
     page.find('a', id: 'about_link').click
+    expect(page.find('a', id: 'isolated_nav_link')[:class]).to include('selected')
     expect(page).to have_content('About Page')
     expect(page.current_path).to eq('/about')
     page.find('a', id: 'topics_link').click
     expect(page).to have_content('Topics Page')
     expect(page.current_path).to eq('/topics')
+    expect(page.find('a', id: 'components_link')[:class]).not_to include('selected')
     page.find('a', id: 'components_link').click
+    expect(page.find('a', id: 'components_link')[:class]).to include('selected')
     expect(page).to have_content('more on components...')
     expect(page.current_path).to eq('/topics/components')
   end

ruby/hyper-router/spec/test_app/app/hyperstack/components/basic_example.rb

@@ -8,6 +8,7 @@ class App < HyperComponent
       LI { Link('/',       id: :home_link) { 'Home' } }
       LI { Link('/about',  id: :about_link) { 'About' } }
       LI { Link('/topics', id: :topics_link) { 'Topics' } }
+      LI { IsolatedNavLink() }
     end
     Route('/', exact: true, mounts: Home)
     Route('/about') { About() }
@@ -32,7 +33,7 @@ class Topics < HyperComponent
     H2 { 'Topics Page' }
     UL() do
       LI { Link("#{match.url}/rendering") { 'Rendering with React' } }
-      LI { Link("#{match.url}/components", id: :components_link) { 'Components' } }
+      LI { NavLink("#{match.url}/components", id: :components_link, active_class: :selected) { 'Components' } }
       LI { Link("#{match.url}/props-v-state") { 'Props v. State' } }
     end
     Route("#{match.url}/:topic_id", mounts: Topic)
@@ -42,6 +43,16 @@ class Topics < HyperComponent
   end
 end
 
+class IsolatedNavLink
+  include Hyperstack::Component
+  include Hyperstack::Router::Helpers
+  # this tests that a component does not have to be mounted directly from a Router
+  # for the active_class functionality to work
+  render do
+    NavLink('/about', id: :isolated_nav_link, active_class: :selected) { 'about-face' }
+  end
+end
+
 class Topic < HyperComponent
   render(DIV) do
     H3 { "more on #{match.params[:topic_id]}..." }