Lexxy not initializing when in a <turbo-frame> on 'advance' action.

[wdiechmann]

I started a discussion regarding this issue which does not show a lot of interest - either me and "Chet" have got lexxy completely wrong, or there is a precondition/requirement we are not aware of, or you guys are yet to start implementing/utilizing lexxy

In an 'album' I have this soup:

<turbo-frame id="main_content" src="http://localhost:3001/ended-2/albums/1259" complete="">
  <turbo-frame data-turbo-action="advance" id="album_block">
    ..8<..
    <a data-turbo-action="advance" data-turbo-frame="main_content" class="inline-flex items-center px-4 py-2 border border-transparent rounded-md shadow-sm text-sm font-medium text-white bg-blue-600 hover:bg-blue-700 " href="/ended-2/albums/1259/photos/new">📸 Upload Billede</a>
    ..8<..
  </turbo-frame>
</turbo-frame>

When I click the 'Upload Billede' link, I see this in the log:

2026-01-26T06:43:50.392570446Z [0af7e1d1-148d-4881-ba3e-fbec47079484] Started GET "/ended-2/albums/1259/photos/new" for 172.70.240.17 at 2026-01-26 06:43:50 +0000
2026-01-26T06:43:50.394333591Z [0af7e1d1-148d-4881-ba3e-fbec47079484] Processing by PhotosController#new as HTML
2026-01-26T06:43:50.394435932Z [0af7e1d1-148d-4881-ba3e-fbec47079484]   Parameters: {"album_id" => "1259"}
2026-01-26T06:43:50.432162088Z [0af7e1d1-148d-4881-ba3e-fbec47079484] Completed 200 OK in 37ms (Views: 28.0ms | ActiveRecord: 2.8ms (8 queries, 1 cached) | GC: 3.4ms)

In the browser console I see:

turbo.es2017-esm.js:766 Hent afsluttede indlæsningen: GET "http://localhost:3001/ended-2/albums/1259/photos/new".

So - all is looking good - except (as the discussion details) the action text elements are not accessible but 'empty'.

I do hope this is a bug - and not me crying 'Wolf'
🥹

[samuelpecher]

Hey @wdiechmann 👋. We do use Lexxy! It's the core text editor of our newest product: fizzy.do 🫧.

Can I check I am understanding the issue? In your new form pages (loaded via turbo frame) you are not seeing editable Lexxy editors until you refresh the page. Is that correct?

[wdiechmann]

Hey @wdiechmann 👋. We do use Lexxy! It's the core text editor of our newest product: fizzy.do 🫧.

Can I check I am understanding the issue? In your new form pages (loaded via turbo frame) you are not seeing editable Lexxy editors until you refresh the page. Is that correct?

Oh - I know 😉

I guess what I meant was that other guys might not yet have taken up converting from Trix to Lexxy -

You understand the issue correct (and what puzzles me and have me think that it is a JS issue is that if I reload all is good)

[samuelpecher]

Could you share how you are including Lexxy’s js in your app?

[wdiechmann]

Absolutely - this feels a lot like stripping to my socks and take a walk down Main Street - but here goes 😂

//config/import.map
//
// Configure your import map in config/importmap.rb. Read more: https://github.com/rails/importmap-rails
import "@hotwired/turbo-rails"
import "controllers"

// import "trix"
import "@rails/actiontext"
import "lexxy"

<!-- layouts/application.html.erb -->
..8<..
<%= stylesheet_link_tag :app, "data-turbo-track": "reload" %>
<%= stylesheet_link_tag "lexxy", "data-turbo-track": "reload" %>

<%= javascript_importmap_tags %>

source "https://rubygems.org"

gem "rails", github: "rails/rails", branch: "main"
gem "propshaft"
gem "sqlite3", ">= 2.1"
gem "puma", ">= 5.0"
gem "importmap-rails"
gem "turbo-rails"
gem "stimulus-rails"
gem "tailwindcss-rails"
gem "jbuilder"
gem "bcrypt", "~> 3.1.7"
gem "webauthn"
gem "closure_tree"
gem "ancestry"
gem "acts_as_list"
gem "tzinfo-data", platforms: %i[ windows jruby ]
gem "solid_cache"
gem "solid_queue"
gem "solid_cable"
gem "bootsnap", require: false
gem "kamal", require: false
gem "thruster", require: false
gem "image_processing", "~> 1.2"
gem "csv"
gem "pagy", "~> 9.0"
gem "paper_trail"

group :development, :test do
  gem "debug", platforms: %i[ mri windows ], require: "debug/prelude"
  gem "brakeman", require: false
  gem "rubocop-rails-omakase", require: false
  gem "dotenv-rails", "~> 3.2"
end

group :development do
  gem "web-console"
  gem "localhost"
end

group :test do
  gem "capybara"
  gem "selenium-webdriver"
end

gem "mailtrap", "~> 2.4"
gem "lexxy", "~> 0.7.0.beta"
gem "tidewave", "~> 0.4.1", group: :development

[samuelpecher]

🤔 Nothing looks untoward there.

Based on what you're describing in the discussion, it seems that the turbo-advance action is preventing empty lexxy-editors from connecting, whereas a full-page load works fine.

There is one difference: the placeholder attribute isn't rendered in your 'with content' example. Are the blank/non-blank rich text tags rendered in different templates?

Any chance you could share a repo with the basic page structure you're using for these pages with the turbo frames which has the same bug?

[wdiechmann]

🤔 Nothing looks untoward there.

Based on what you're describing in the discussion, it seems that the turbo-advance action is preventing empty lexxy-editors from connecting, whereas a full-page load works fine.

There is one difference: the placeholder attribute isn't rendered in your 'with content' example. Are the blank/non-blank rich text tags rendered in different templates?

Any chance you could share a repo with the basic page structure you're using for these pages with the turbo frames which has the same bug?

i'll get to work on erecting a repo with that part of the app ASAP

[wdiechmann]

here is a small repo with the issue https://github.com/wdiechmann/lexxybug

start at /albums and try to upload photo and then immediately reload browser to watch the actiontext fields fill - i didn't spend too much time making them actually do work but they initialize which is the issue
🥲

[samuelpecher]

I don't have a solution at the moment, but the "main-content" turbo-frame seems to be suppressing Lexxy's load. It didn't happen on fresh load of the new view since there was two <turbo-frame id="main-content">; fixing that makes the bug consistent.

edit: Of course it doesn't because there's no js 🙃

[wdiechmann]

not sure I get the edit - no js?

[samuelpecher]

Loading /new with render layout :false causes there to be no head, and therefore the lexxy js isn't included...

I've dug into it, the editors are there, but not connected properly. As a workaround for now, you can call lexxyEditor.connectedCallback() to kick them into action.

There is definitely an interaction between turbo-frame and Lexxy which prevents proper initialization.