When Trix Editor is its own Livewire Component, a JS error is thrown, but everything works correctly
The error thrown is "Uncaught Could not find Livewire component in DOM tree". The Trix version Im using is: Trix 2.0.8. I want nothing but a simple editor, so 2.0.8 is exactly that, without any cloud or API "features". Lets say I have a Livewire <x-trix-input> component:
<div>
@push('extra-css')
<link rel="stylesheet" type="text/css" href="{{ secure_asset('storage/assets/trix.css') }}">
@endpush
@push('extra-js')
<script type="text/javascript" src="{{ secure_asset('storage/assets/trix.umd.min.js') }}"></script>
@endpush
<trix-toolbar class="pt-2" id="trix-toolbar-{{ $modelId }}"></trix-toolbar>
<input id="trix-input-{{ $modelId }}" type="hidden" wire:model="content">
<trix-editor
id="trix-editor-{{ $modelId }}"
input="trix-input-{{ $modelId }}"
toolbar="trix-toolbar-{{ $modelId }}"
class="max-w-none min-h-72 border border-gray-300 rounded-lg"
placeholder="{{ $placeholder }}"
></trix-editor>
</div>
Then If I use:
@if($editingPost == $post->id)
<livewire:trix-input :key="'content-' .$post->id" :id="$post->id" wire:model="editedContent" />
@endif
That error gets thrown when I click on my edit button, which just sets the $editingPost to be the ID of the clicked post. Of course, theres a lot more code in my trix-input component, but If I remove the <trix-editor> tag from my Trix Input Livewire Component and click on the edit, the error is no longer thrown. So clearly the trix-editor tag causes this error to appear. This error is also being thrown weirdly, when Iclick to edit and for the Trix Input to appear, it appears and throws the error once. If I click on another post it throws it twice, then three times at once, then four, etc and it doesnt matter if i click to edit the same post or not. Everything works fine, by the way, eventhough there are errors thrown, the editor still opens and I can still use it and it functions normally, even with errors. Im just worried that there could be a point where 150 of the same errors would be thrown at once on a click, which is possible. I can ignore them, but I'd like to know why they appear.
Please or to participate in this conversation.