trix-toolbar can't put after trix-editor

[hoppergee]

trix form can only works when trix-toolbar put before trix-editor

Steps to Reproduce

<trix-editor></trix-editor>
<trix-toolbar></trix-toolbar>

When trix-toolbar put after trix-editor, I will get an error when submit the form.

An invalid form control with name='href' is not focusable.

I have to fix it by put the trix-toolbar before trix-editor like this:

<trix-toolbar></trix-toolbar>
<trix-editor></trix-editor>

Details

• Trix version: 1.3.1
• Browser name and version: Chrome 90
• Operating system: Mac OS 11.4

[brady2037]

Refer to this：https://github.com/basecamp/trix/issues/807

[frenkel]

If you wrap it in a div with some css styling it will work without problems:

<div style="display: flex; flex-direction: column-reverse">
  <trix-toolbar></trix-toolbar>
  <trix-editor></trix-editor>
</div>