glimmer-dsl-web 0.0.12 → 0.1.1

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: aaaa7092a643511c072a409a2b771b34db6b2aa0859adc5b200e5aba0869590e
-  data.tar.gz: 15ba8d9639037fa17104cb997a449f42e79703ae9ec4992f21b8a7551d3b09f0
+  metadata.gz: 84438bf8ca94283ebca35c684038f1ba326c9301782508bdf07b7c4e23ecb391
+  data.tar.gz: f7246af497c04e9c509457444ac9c17c8617aa881fca82adb4561473f1d18044
 SHA512:
-  metadata.gz: 5732c5dca9591d17917fd6dfbd1425eed080f6aa345f6b9fb6bbbd8f3d487ce83428063b9ef974cabab8c2fdd7e6d8799b67e4442c462e6c174a4a81448900c6
-  data.tar.gz: 34afe2b80aeb727dad38572f81f46f7d442ef2998cb97b94ae92d332364f3ff2da0669203ced36a0484304fbbcbdfb1c7cb30a8b74b49ce42abb329ce333b7de
+  metadata.gz: b47263b248b7952d58d9fe8fb03f0614f8c917e025310839f7ab311f33fc31e292fe257ffec8f1c487843eab7814253829c00579ea2132385b4064b75e801890
+  data.tar.gz: 6be5e5bab5900605d78977e703d27ac95dac303fa3855d52bd4f7dd4a1e8c8f090d49b95c57a5abe3155dde9adece9a028cfa7afc3872b9fcead2ce1a417676d

data/CHANGELOG.md

@@ -1,5 +1,17 @@
 # Change Log
 
+## 0.1.1
+
+- Upgrade to opal-jquery 0.5.1 (adds `# backtick_javascript: true` where needed to satisfy new Opal requirement)
+- Upgrade to opal-async 1.4.1 (adds `# backtick_javascript: true` where needed to satisfy new Opal requirement)
+- Update setup instructions to NOT disable Hotwire files, to allow running Hotwire/Turbo side by side with Glimmer DSL for Web (but not in the same pages)
+
+## 0.1.0
+
+- Update rendering system to render HTML elements immediately instead of waiting for complete components to be rendered all at once.
+- Support `render: false` option in any element or component to avoid rendering when building the elements/components (including a Component#create alternative to Component#render that defers rendering if needed).
+- Fix `Glimmer::Web::Component` `after_render` hook by ensuring it only fires after the component markup has been rendered
+
 ## 0.0.12
 
 - Treat HTML text formatting elements differently (e.g. `b`, `i`, `strong`, `em`, `sub`, `sup`, `del`, `ins`, `small`, `mark`) by not appending to their parent content, yet having them generate a String with `to_s` that can be embedded in a `String` that is the text content of another normal element like `p` or `div`.

data/README.md

@@ -1,4 +1,4 @@
-# [<img src="https://raw.githubusercontent.com/AndyObtiva/glimmer/master/images/glimmer-logo-hi-res.png" height=85 />](https://github.com/AndyObtiva/glimmer) Glimmer DSL for Web 0.0.12 (Early Alpha)
+# [<img src="https://raw.githubusercontent.com/AndyObtiva/glimmer/master/images/glimmer-logo-hi-res.png" height=85 />](https://github.com/AndyObtiva/glimmer) Glimmer DSL for Web 0.1.1 (Beta)
 ## Ruby in the Browser Web GUI Frontend Library
 [![Gem Version](https://badge.fury.io/rb/glimmer-dsl-web.svg)](http://badge.fury.io/rb/glimmer-dsl-web)
 [![Join the chat at https://gitter.im/AndyObtiva/glimmer](https://badges.gitter.im/AndyObtiva/glimmer.svg)](https://gitter.im/AndyObtiva/glimmer?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge)
@@ -17,7 +17,7 @@ include Glimmer
 Document.ready? do
   div {
     'Hello, World!'
-  }.render
+  }
 end
 ```
 
@@ -49,7 +49,7 @@ Document.ready? do
         $$.alert('Hello, Button!')
       end
     }
-  }.render
+  }
 end
 ```
 
@@ -150,7 +150,7 @@ Document.ready? do
         }
       CSS
     }
-  }.render
+  }
 end
 ```
 
@@ -245,6 +245,8 @@ class HelloObserver
   end
   
   after_render do
+    @number_input.value = @number_holder.number
+    @range_input.value = @number_holder.number
     # Observe Model attribute @number_holder.number for changes and update View
     # Observer is automatically cleaned up if remove method is called on rendered HelloObserver
     # or its top-level element
@@ -262,7 +264,7 @@ class HelloObserver
   markup {
     div {
       div {
-        @number_input = input(type: 'number', value: @number_holder.number, min: 0, max: 100) {
+        @number_input = input(type: 'number', min: 0, max: 100) {
           # oninput listener updates Model attribute @number_holder.number
           oninput do
             @number_holder.number = @number_input.value.to_i
@@ -276,7 +278,7 @@ class HelloObserver
         }
       }
       div {
-        @range_input = input(type: 'range', value: @number_holder.number, min: 0, max: 100) {
+        @range_input = input(type: 'range', min: 0, max: 100) {
           # oninput listener updates Model attribute @number_holder.number
           oninput do
             @number_holder.number = @range_input.value.to_i
@@ -411,7 +413,7 @@ Document.ready? do
                       computed_by: @address.members + ['state_code'],
                     ]
     }
-  }.render
+  }
 end
 ```
 
@@ -546,7 +548,7 @@ Document.ready? do
         end
       end
     }
-  }.render
+  }
 end
 ```
 
@@ -1073,7 +1075,7 @@ Screenshot:
 
 --
 
-NOTE: Glimmer DSL for Web is an Early Alpha project. If you want it developed faster, please [open an issue report](https://github.com/AndyObtiva/glimmer-dsl-web/issues/new). I have completed some GitHub project features much faster before due to [issue reports](https://github.com/AndyObtiva/glimmer-dsl-web/issues) and [pull requests](https://github.com/AndyObtiva/glimmer-dsl-web/pulls). Please help make better by contributing, adopting for small or low risk projects, and providing feedback. It is still an early alpha, so the more feedback and issues you report the better.
+NOTE: Glimmer DSL for Web is a Beta project. If you want it developed faster, please [open an issue report](https://github.com/AndyObtiva/glimmer-dsl-web/issues/new). I have completed some GitHub project features much faster before due to [issue reports](https://github.com/AndyObtiva/glimmer-dsl-web/issues) and [pull requests](https://github.com/AndyObtiva/glimmer-dsl-web/pulls). Please help make better by contributing, adopting for small or low risk projects, and providing feedback. It is still a Beta, so the more feedback and issues you report the better.
 
 Learn more about the differences between various [Glimmer](https://github.com/AndyObtiva/glimmer) DSLs by looking at:
 
@@ -1081,7 +1083,7 @@ Learn more about the differences between various [Glimmer](https://github.com/An
 
 ## Table of Contents
 
-- [Glimmer DSL for Web](#-glimmer-dsl-for-opal-alpha-pure-ruby-web-gui)
+- [Glimmer DSL for Web](#)
   - [Prerequisites](#prerequisites)
   - [Setup](#setup)
   - [Usage](#usage)
@@ -1121,7 +1123,7 @@ Learn more about the differences between various [Glimmer](https://github.com/An
 
 ## Setup
 
-(NOTE: Keep in mind this is an Early Alpha. If you run into issues, try to go back to a [previous revision](https://rubygems.org/gems/glimmer-dsl-web/versions). Also, there is a slight chance any issues you encounter are fixed in master or some other branch that you could check out instead)
+(NOTE: Keep in mind this is a Beta. If you run into issues, try to go back to a [previous revision](https://rubygems.org/gems/glimmer-dsl-web/versions). Also, there is a slight chance any issues you encounter are fixed in master or some other branch that you could check out instead)
 
 The [glimmer-dsl-web](https://rubygems.org/gems/glimmer-dsl-web) gem is a [Rails Engine](https://guides.rubyonrails.org/engines.html) gem that includes assets.
 
@@ -1144,7 +1146,7 @@ rails new glimmer_app_server
 Add the following to `Gemfile`:
 
 ```
-gem 'glimmer-dsl-web', '~> 0.0.12'
+gem 'glimmer-dsl-web', '~> 0.1.1'
 ```
 
 Run:
@@ -1189,26 +1191,28 @@ rails db:migrate
 Add the following to `config/routes.rb` inside the `Rails.application.routes.draw` block:
 
 ```ruby
-mount Glimmer::Engine => "/glimmer" # add on top
 root to: 'welcomes#index'
 ```
 
 Clear the file `app/views/welcomes/index.html.erb` completely from all content.
 
-Delete `app/javascript` directory
+Rename `app/assets/javascript/application.js.rb` file to `app/assets/javascript/opal_application.rb`.
 
 Rename `app/assets/javascript` directory to `app/assets/opal`.
 
-Add the following lines to `app/assets/config/manifest.js` (and delete their `javascript` equivalents):
+Edit `app/assets/config/manifest.js` and update `//= link_directory ../javascript .js` to `//= link_directory ../opal .js`:
 
 ```js
-//= link_tree ../../opal .js
 //= link_directory ../opal .js
 ```
 
-Rename `app/assets/opal/application.js.rb` to `app/assets/opal/application.rb`.
+Edit `app/views/layouts/application.html.erb` and update `<%= javascript_include_tag "application", "data-turbolinks-track": "reload" %>` to `<%= javascript_include_tag "opal_application", "data-turbolinks-track": "reload" %>`:
 
-Edit and replace `app/assets/opal/application.rb` content with code below (optionally including a require statement for one of the [samples](#samples) below):
+```erb
+<%= javascript_include_tag "opal_application", "data-turbolinks-track": "reload" %>
+```
+
+Edit and replace `app/assets/opal/opal_application.rb` content with code below (optionally including a require statement for one of the [samples](#samples) below):
 
 ```ruby
 require 'glimmer-dsl-web' # brings opal and other dependencies automatically
@@ -1247,7 +1251,7 @@ Document.ready? do
     label(class: 'greeting') {
       'Hello, World!'
     }
-  }.render
+  }
 end
 ```
 
@@ -1298,7 +1302,7 @@ Document.ready? do
     label(class: 'greeting') {
       'Hello, World!'
     }
-  }.render
+  }
 end
 ```
 
@@ -1315,6 +1319,7 @@ That produces:
 </div>
 ...
 ```
+
 You may insert a Glimmer component anywhere into a Rails View using `glimmer_component(component_path, *args)` Rails helper. Add `include GlimmerHelper` to `ApplicationHelper` or another Rails helper, and use `<%= glimmer_component("path/to/component", *args) %>` in Views.
 
 To use `glimmer_component`, edit `app/helpers/application_helper.rb` in your Rails application, add `require 'glimmer/helpers/glimmer_helper'` on top and `include GlimmerHelper` inside `module`.
@@ -1331,6 +1336,8 @@ module ApplicationHelper
 end
 ```
 
+Note that Turbo is disabled on Glimmer elements/components. You can still use Turbo/Hotwire side by side with Glimmer DSL for Web by using one of the two technologies in every page. But, mixing them in the same pages is not recommended at the moment, so any pages loaded with Glimmer DSL for Web must be loaded without Turbo (e.g. by putting "data-turbo"="false" on anchor "a" tag links to Glimmer pages).
+
 If you run into any issues in setup, refer to the [Sample Glimmer DSL for Web Rails 7 App](https://github.com/AndyObtiva/sample-glimmer-dsl-web-rails7-app) project (in case I forgot to include some setup steps by mistake).
 
 Otherwise, if you still cannot setup successfully (even with the help of the sample project, or if the sample project stops working), please do not hesitate to report an [Issue request](https://github.com/AndyObtiva/glimmer-dsl-web/issues) or fix and submit a [Pull Request](https://github.com/AndyObtiva/glimmer-dsl-web/pulls).
@@ -1360,7 +1367,7 @@ Disable the `webpacker` gem line in `Gemfile`:
 Add the following to `Gemfile`:
 
 ```ruby
-gem 'glimmer-dsl-web', '~> 0.0.12'
+gem 'glimmer-dsl-web', '~> 0.1.1'
 ```
 
 Run:
@@ -1405,10 +1412,8 @@ rails db:migrate
 Add the following to `config/routes.rb` inside the `Rails.application.routes.draw` block:
 
 ```ruby
-mount Glimmer::Engine => "/glimmer" # add on top
 root to: 'welcomes#index'
 ```
-```
 
 Also, delete the following line:
 
@@ -1418,18 +1423,23 @@ Also, delete the following line:
 
 Clear the file `app/views/welcomes/index.html.erb` completely from all content.
 
+Rename `app/assets/javascript/application.js.rb` file to `app/assets/javascript/opal_application.rb`.
+
 Rename `app/assets/javascript` directory to `app/assets/opal`.
 
-Add the following lines to `app/assets/config/manifest.js` (and delete their `javascript` equivalents):
+Edit `app/assets/config/manifest.js` and update `//= link_directory ../javascript .js` to `//= link_directory ../opal .js`:
 
 ```js
-//= link_tree ../../opal .js
 //= link_directory ../opal .js
 ```
 
-Rename `app/assets/opal/application.js.rb` to `app/assets/opal/application.rb`.
+Edit `app/views/layouts/application.html.erb` and update `<%= javascript_include_tag "application", "data-turbolinks-track": "reload" %>` to `<%= javascript_include_tag "opal_application", "data-turbolinks-track": "reload" %>`:
+
+```erb
+<%= javascript_include_tag "opal_application", "data-turbolinks-track": "reload" %>
+```
 
-Edit and replace `app/assets/opal/application.rb` content with code below (optionally including a require statement for one of the [samples](#samples) below inside a `Document.ready? do; end` block):
+Edit and replace `app/assets/opal/opal_application.rb` content with code below (optionally including a require statement for one of the [samples](#samples) below):
 
 ```ruby
 require 'glimmer-dsl-web' # brings opal and other dependencies automatically
@@ -1461,7 +1471,7 @@ Document.ready? do
     label(class: 'greeting') {
       'Hello, World!'
     }
-  }.render
+  }
 end
 ```
 
@@ -1506,6 +1516,8 @@ module ApplicationHelper
 end
 ```
 
+Note that Turbo is disabled on Glimmer elements/components. You can still use Turbo/Hotwire side by side with Glimmer DSL for Web by using one of the two technologies in every page. But, mixing them in the same pages is not recommended at the moment, so any pages loaded with Glimmer DSL for Web must be loaded without Turbo (e.g. by putting "data-turbo"="false" on anchor "a" tag links to Glimmer pages).
+
 **NOT RELEASED OR SUPPORTED YET**
 
 If you run into any issues in setup, refer to the [Sample Glimmer DSL for Web Rails 6 App](https://github.com/AndyObtiva/sample-glimmer-dsl-web-rails6-app) project (in case I forgot to include some setup steps by mistake).
@@ -1616,7 +1628,7 @@ include Glimmer
 Document.ready? do
   div {
     'Hello, World!'
-  }.render
+  }
 end
 ```
 
@@ -1638,7 +1650,7 @@ require 'glimmer-dsl-web'
 include Glimmer
 
 Document.ready? do
-  div('Hello, World!').render
+  div('Hello, World!')
 end
 ```
 
@@ -1670,7 +1682,7 @@ Document.ready? do
         $$.alert('Hello, Button!')
       end
     }
-  }.render
+  }
 end
 ```
 
@@ -1771,7 +1783,7 @@ Document.ready? do
         }
       CSS
     }
-  }.render
+  }
 end
 ```
 
@@ -1866,6 +1878,8 @@ class HelloObserver
   end
   
   after_render do
+    @number_input.value = @number_holder.number
+    @range_input.value = @number_holder.number
     # Observe Model attribute @number_holder.number for changes and update View
     # Observer is automatically cleaned up if remove method is called on rendered HelloObserver
     # or its top-level element
@@ -1883,7 +1897,7 @@ class HelloObserver
   markup {
     div {
       div {
-        @number_input = input(type: 'number', value: @number_holder.number, min: 0, max: 100) {
+        @number_input = input(type: 'number', min: 0, max: 100) {
           # oninput listener updates Model attribute @number_holder.number
           oninput do
             @number_holder.number = @number_input.value.to_i
@@ -1897,7 +1911,7 @@ class HelloObserver
         }
       }
       div {
-        @range_input = input(type: 'range', value: @number_holder.number, min: 0, max: 100) {
+        @range_input = input(type: 'range', min: 0, max: 100) {
           # oninput listener updates Model attribute @number_holder.number
           oninput do
             @number_holder.number = @range_input.value.to_i
@@ -2088,7 +2102,7 @@ Document.ready? do
                       computed_by: @address.members + ['state_code'],
                     ]
     }
-  }.render
+  }
 end
 ```
 
@@ -2223,7 +2237,7 @@ Document.ready? do
         end
       end
     }
-  }.render
+  }
 end
 ```
 
@@ -2849,7 +2863,7 @@ Document.ready? do
         CSS
       }
     }
-  }.render
+  }
 end
 ```
 

data/VERSION

@@ -1 +1 @@
-0.0.12
+0.1.1

data/glimmer-dsl-web.gemspec

@@ -2,16 +2,16 @@
 # DO NOT EDIT THIS FILE DIRECTLY
 # Instead, edit Jeweler::Tasks in Rakefile, and run 'rake gemspec'
 # -*- encoding: utf-8 -*-
-# stub: glimmer-dsl-web 0.0.12 ruby lib
+# stub: glimmer-dsl-web 0.1.1 ruby lib
 
 Gem::Specification.new do |s|
   s.name = "glimmer-dsl-web".freeze
-  s.version = "0.0.12".freeze
+  s.version = "0.1.1".freeze
 
   s.required_rubygems_version = Gem::Requirement.new(">= 0".freeze) if s.respond_to? :required_rubygems_version=
   s.require_paths = ["lib".freeze]
   s.authors = ["Andy Maleh".freeze]
-  s.date = "2024-01-07"
+  s.date = "2024-01-08"
   s.description = "Glimmer DSL for Web (Ruby in the Browser Web GUI Frontend Library) enables building Web GUI frontends using Ruby in the Browser, as per Matz's recommendation in his RubyConf 2022 keynote speech to replace JavaScript with Ruby. It aims at providing the simplest, most intuitive, most straight-forward, and most productive frontend library in existence. The library follows the Ruby way (with DSLs and TIMTOWTDI) and the Rails way (Convention over Configuration) while supporting both Unidirectional (One-Way) Data-Binding (using <=) and Bidirectional (Two-Way) Data-Binding (using <=>). Dynamic rendering (and re-rendering) of HTML content is also supported via Content Data-Binding. And, modular design is supported with Glimmer Web Components. You can finally live in pure Rubyland on the Web in both the frontend and backend with Glimmer DSL for Web! This library relies on Opal Ruby.".freeze
   s.email = "andy.am@gmail.com".freeze
   s.extra_rdoc_files = [
@@ -79,8 +79,8 @@ Gem::Specification.new do |s|
   s.add_runtime_dependency(%q<glimmer-dsl-css>.freeze, ["~> 1.2.2".freeze])
   s.add_runtime_dependency(%q<opal>.freeze, ["= 1.8.2".freeze])
   s.add_runtime_dependency(%q<opal-rails>.freeze, ["= 2.0.3".freeze])
-  s.add_runtime_dependency(%q<opal-async>.freeze, ["~> 1.4.0".freeze])
-  s.add_runtime_dependency(%q<opal-jquery>.freeze, ["~> 0.5.0".freeze])
+  s.add_runtime_dependency(%q<opal-async>.freeze, ["~> 1.4.1".freeze])
+  s.add_runtime_dependency(%q<opal-jquery>.freeze, ["~> 0.5.1".freeze])
   s.add_runtime_dependency(%q<to_collection>.freeze, [">= 2.0.1".freeze, "< 3.0.0".freeze])
   s.add_development_dependency(%q<puts_debuggerer>.freeze, [">= 0".freeze])
   s.add_development_dependency(%q<rake>.freeze, [">= 10.1.0".freeze, "< 14.0.0".freeze])

data/lib/glimmer/helpers/glimmer_helper.rb

@@ -7,24 +7,27 @@ module GlimmerHelper
   end
   
   def glimmer_component(component_asset_path, *component_args)
-    component_file = component_asset_path.split('/').last
-    component_class_name = component_file.classify
+    component_file = component_asset_path.split('/').last # TODO support namespaced components
+    component_class_name = component_file.classify # TODO support namespaced components
     next_id_number = GlimmerHelper.next_id_number
     component_id = "glimmer_component_#{next_id_number}"
     component_script_container_id = "glimmer_component_script_container_#{next_id_number}"
     component_args_json = JSON.dump(component_args)
-    opal_script = <<~Opal
+    opal_script = <<~OPAL
       require 'glimmer-dsl-web'
       component_args_json = '#{component_args_json}'
       component_args = JSON.parse(component_args_json)
       component_args << {} if !component_args.last.is_a?(Hash)
       component_args.last[:parent] = "##{component_id}"
       #{component_class_name}.render(*component_args)
-    Opal
-    content_tag(:div, id: component_script_container_id, class: ['glimmer_component_script_container', "#{component_file}_script_container"]) do
+    OPAL
+    js_script = <<~JAVASCRIPT
+      Opal.eval(`#{opal_script}`)
+    JAVASCRIPT
+    content_tag(:div, id: component_script_container_id, class: ['glimmer_component_script_container', "#{component_file}_script_container"], 'data-turbo': 'false') do
       content_tag(:div, '', id: component_id, class: ['glimmer_component', component_file]) +
       javascript_include_tag(component_asset_path, "data-turbolinks-track": "reload") +
-        content_tag(:script, raw(opal_script), type: 'text/ruby')
+      content_tag(:script, raw(js_script), type: 'application/javascript', "data-turbo-eval": "false")
     end
   end
 end

data/lib/glimmer/web/component.rb

@@ -93,10 +93,17 @@ module Glimmer
           self.name.underscore.gsub('::', '__').split('__').last
         end
         
+        # Creates component without rendering
+        def create(*args)
+          args << {} unless args.last.is_a?(Hash)
+          args.last[:render] = false
+          rendered_component = send(keyword, *args)
+          rendered_component
+        end
+        
+        # Creates and renders component
         def render(*args)
           rendered_component = send(keyword, *args)
-          options = args.last.is_a?(Hash) ? args.last.slice(:parent, :custom_parent_dom_element, :brand_new) : {}
-          rendered_component.render(**options)
           rendered_component
         end
       end
@@ -204,10 +211,15 @@ module Glimmer
         markup_block = self.class.instance_variable_get("@markup_block")
         raise Glimmer::Error, 'Invalid Glimmer web component for having no markup! Please define markup block!' if markup_block.nil?
         @markup_root = instance_exec(&markup_block)
-        @markup_root.options[:parent] = options[:parent] if options[:parent]
+        @markup_root.options[:parent] = options[:parent] if !options[:parent].nil?
         @parent ||= @markup_root.parent
         raise Glimmer::Error, 'Invalid Glimmer web component for having an empty markup! Please fill markup block!' if @markup_root.nil?
-        execute_hooks('after_render')
+        if options[:render] != false
+          execute_hooks('after_render')
+        else
+          on_render_listener = proc { execute_hooks('after_render') }
+          @markup_root.handle_observation_request('on_render', on_render_listener)
+        end
         
         # TODO adapt for web
         observer_registration_cleanup_listener = proc do

data/lib/glimmer/web/element_proxy.rb

@@ -109,16 +109,25 @@ module Glimmer
         @keyword = keyword
         @parent = parent
         @options = args.last.is_a?(Hash) ? args.last.symbolize_keys : {}
+        if parent.nil?
+          options[:parent] ||= Component.interpretation_stack.last&.options&.[](:parent)
+          options[:render] ||= Component.interpretation_stack.last&.options&.[](:render)
+        end
         @args = args
         @block = block
         @children = []
         @parent&.post_initialize_child(self)
+        render if !@rendered && render_after_create?
+      end
+      
+      def render_after_create?
+        options[:render] != false && (@parent.nil? || @parent.render_after_create?)
       end
       
       # Executes for the parent of a child that just got added
       def post_initialize_child(child)
         @children << child
-        child.render
+        child.render if !render_after_create?
       end
       
       # Executes for the parent of a child that just got removed
@@ -128,6 +137,7 @@ module Glimmer
       
       # Executes at the closing of a parent widget curly braces after all children/properties have been added/set
       def post_add_content
+        # TODO double check every place we should call this method
         # No Op
       end
       
@@ -215,7 +225,7 @@ module Glimmer
       def parent_selector
         @parent&.selector
       end
-
+      
       def parent_dom_element
         if parent_selector
           Document.find(parent_selector)
@@ -243,7 +253,6 @@ module Glimmer
         brand_new = @dom.nil? || old_element.empty? || !options[:parent].to_s.empty? || brand_new
         build_dom(layout: !custom_parent_dom_element) # TODO handle custom parent layout by passing parent instead of parent dom element
         if brand_new
-          # TODO make a method attach to allow subclasses to override if needed
           attach(the_parent_dom_element)
         else
           reattach(old_element)
@@ -253,8 +262,10 @@ module Glimmer
             handle_observation_request(keyword, event_listener)
           end
         end
-        children.each do |child|
-          child.render
+        unless render_after_create?
+          children.each do |child|
+            child.render
+          end
         end
         @rendered = true
         unless skip_content_on_render_blocks?
@@ -262,6 +273,10 @@ module Glimmer
             content(&content_block)
           end
         end
+        # TODO replace following line with a method call like (`notify_listeners('on_render')`)
+        listeners_for('on_render').each do |listener|
+          listener.original_event_listener.call(EventProxy.new(listener: listener))
+        end
       end
       alias rerender render
         
@@ -320,6 +335,7 @@ module Glimmer
         end
         html_options[:class] ||= ''
         html_options[:class] = "#{html_options[:class]} #{body_class}".strip
+        html_options['data-turbo'] = 'false' if parent.nil?
         html_options
       end
       

data/lib/glimmer/web/event_proxy.rb

@@ -1,3 +1,5 @@
+# backtick_javascript: true
+
 # Copyright (c) 2023-2024 Andy Maleh
 #
 # Permission is hereby granted, free of charge, to any person obtaining

data/lib/glimmer-dsl-web/samples/hello/hello_button.rb

@@ -30,5 +30,5 @@ Document.ready? do
         $$.alert('Hello, Button!')
       end
     }
-  }.render
+  }
 end

data/lib/glimmer-dsl-web/samples/hello/hello_content_data_binding.rb

@@ -137,5 +137,5 @@ Document.ready? do
         end
       end
     }
-  }.render
+  }
 end

data/lib/glimmer-dsl-web/samples/hello/hello_data_binding.rb

@@ -177,5 +177,5 @@ Document.ready? do
                       computed_by: @address.members + ['state_code'],
                     ]
     }
-  }.render
+  }
 end

data/lib/glimmer-dsl-web/samples/hello/hello_form.rb

@@ -98,5 +98,5 @@ Document.ready? do
         }
       CSS
     }
-  }.render
+  }
 end

data/lib/glimmer-dsl-web/samples/hello/hello_input_date_time.rb

@@ -113,5 +113,5 @@ Document.ready? do
         CSS
       }
     }
-  }.render
+  }
 end

data/lib/glimmer-dsl-web/samples/hello/hello_observer.rb

@@ -37,6 +37,8 @@ class HelloObserver
   end
   
   after_render do
+    @number_input.value = @number_holder.number
+    @range_input.value = @number_holder.number
     # Observe Model attribute @number_holder.number for changes and update View
     # Observer is automatically cleaned up if remove method is called on rendered HelloObserver
     # or its top-level element
@@ -54,7 +56,7 @@ class HelloObserver
   markup {
     div {
       div {
-        @number_input = input(type: 'number', value: @number_holder.number, min: 0, max: 100) {
+        @number_input = input(type: 'number', min: 0, max: 100) {
           # oninput listener updates Model attribute @number_holder.number
           oninput do
             @number_holder.number = @number_input.value.to_i
@@ -68,7 +70,7 @@ class HelloObserver
         }
       }
       div {
-        @range_input = input(type: 'range', value: @number_holder.number, min: 0, max: 100) {
+        @range_input = input(type: 'range', min: 0, max: 100) {
           # oninput listener updates Model attribute @number_holder.number
           oninput do
             @number_holder.number = @range_input.value.to_i

data/lib/glimmer-dsl-web/samples/hello/hello_world.rb

@@ -26,5 +26,5 @@ include Glimmer
 Document.ready? do
   div {
     'Hello, World!'
-  }.render
+  }
 end

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: glimmer-dsl-web
 version: !ruby/object:Gem::Version
-  version: 0.0.12
+  version: 0.1.1
 platform: ruby
 authors:
 - Andy Maleh
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2024-01-07 00:00:00.000000000 Z
+date: 2024-01-08 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: glimmer
@@ -86,28 +86,28 @@ dependencies:
     requirements:
     - - "~>"
       - !ruby/object:Gem::Version
-        version: 1.4.0
+        version: 1.4.1
   type: :runtime
   prerelease: false
   version_requirements: !ruby/object:Gem::Requirement
     requirements:
     - - "~>"
       - !ruby/object:Gem::Version
-        version: 1.4.0
+        version: 1.4.1
 - !ruby/object:Gem::Dependency
   name: opal-jquery
   requirement: !ruby/object:Gem::Requirement
     requirements:
     - - "~>"
       - !ruby/object:Gem::Version
-        version: 0.5.0
+        version: 0.5.1
   type: :runtime
   prerelease: false
   version_requirements: !ruby/object:Gem::Requirement
     requirements:
     - - "~>"
       - !ruby/object:Gem::Version
-        version: 0.5.0
+        version: 0.5.1
 - !ruby/object:Gem::Dependency
   name: to_collection
   requirement: !ruby/object:Gem::Requirement