turbo:morph-element fires twice #1273
Comments
|
Should fire once. I've put together a test script below if you want to try and reproduce the issue: # Save it to file and run as a ruby script:
#
# ruby test.rb
require "bundler/inline"
gemfile true do
source "https://rubygems.org"
gem "rails"
gem "propshaft"
gem "puma"
gem "sqlite3", "~> 1.4"
gem "turbo-rails"
gem "stimulus-rails"
gem "capybara"
gem "cuprite", require: "capybara/cuprite"
end
ENV["DATABASE_URL"] = "sqlite3::memory:"
ENV["RAILS_ENV"] = "test"
require "active_record/railtie"
# require "active_storage/engine"
require "action_controller/railtie"
require "action_view/railtie"
# require "action_mailer/railtie"
# require "active_job/railtie"
require "action_cable/engine"
# require "action_mailbox/engine"
# require "action_text/engine"
require "rails/test_unit/railtie"
class App < Rails::Application
config.load_defaults Rails::VERSION::STRING.to_f
config.root = __dir__
config.hosts << "example.org"
config.eager_load = false
config.session_store :cookie_store, key: "cookie_store_key"
config.secret_key_base = "secret_key_base"
config.consider_all_requests_local = true
config.action_cable.cable = {"adapter" => "async"}
config.turbo.draw_routes = false
Rails.logger = config.logger = Logger.new($stdout)
routes.append do
root to: "application#index"
post "/", to: "application#create"
end
end
Rails.application.initialize!
class ApplicationController < ActionController::Base
include Rails.application.routes.url_helpers
def index
render inline: <<~TEMPLATE, formats: :html
<html>
<head>
<%= csrf_meta_tags %>
<script type="importmap" data-turbo-track="reload">
{
"imports": {
"@hotwired/turbo-rails": "<%= asset_path("turbo.js") %>",
"@hotwired/stimulus": "<%= asset_path("stimulus.js") %>"
}
}
</script>
<script type="module">
import "@hotwired/turbo-rails"
import { Application, Controller } from "@hotwired/stimulus";
window.Stimulus = Application.start();
window.count = 0;
Stimulus.register("hello", class extends Controller {
reconnect() {
window.count += 1;
this.element.textContent = window.count;
}
})
</script>
<meta name="turbo-refresh-method" content="morph">
</head>
<body>
<div id="reconnected"
data-controller="hello"
data-action="turbo:morph-element->hello#reconnect">
</div>
<%= button_to "refresh", "/" %>
</body>
</html>
TEMPLATE
end
def create
render turbo_stream: turbo_stream.action(:refresh, nil)
end
end
class ApplicationSystemTestCase < ActionDispatch::SystemTestCase
driven_by :cuprite,
using: :chrome,
screen_size: [1400, 1400],
options: {
js_errors: true,
headless: true
}
end
Capybara.configure do |config|
config.server = :puma, {Silent: true}
config.default_normalize_ws = true
end
require "rails/test_help"
class TurboSystemTest < ApplicationSystemTestCase
test "a bug" do
visit "/"
click_button "refresh"
assert_selector "#reconnected", text: "1"
end
end |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
I need to reconnect a few Stimulus controllers after page has morphed.
To do that, I was making use of
turbo:morph@window->controller#reconnect, but that doesn't get triggered when inside a Turbo Frame.Then I switched to
turbo:morph-element->controller#reconnect, which works, but fires twice.I this expected behaviour, or am I missing something?
The text was updated successfully, but these errors were encountered: