basecamp/trix · warning

This browser does not support the .name property for trix-ed

Error message

This browser does not support the .name property for trix-editor elements.

What it means

The name getter on trix-editor warns and returns null in browsers that don't support reflecting the name property for form-associated custom elements. The attribute/property API is unavailable, so Trix degrades gracefully with a console warning.

Source

Thrown at src/trix/elements/trix_editor_element.js:301

    const label = findClosestElementFromNode(this.element, { matchingSelector: "label" })
    if (label) {
      if ([ this.element, null ].includes(label.control)) {
        labels.push(label)
      }
    }

    return labels
  }

  get form() {
    console.warn("This browser does not support the .form property for trix-editor elements.")

    return null
  }

  get name() {
    console.warn("This browser does not support the .name property for trix-editor elements.")

    return null
  }

  set name(value) {
    console.warn("This browser does not support the .name property for trix-editor elements.")
  }

  get disabled() {
    console.warn("This browser does not support the [disabled] attribute for trix-editor elements.")

    return false
  }

  set disabled(value) {
    console.warn("This browser does not support the [disabled] attribute for trix-editor elements.")
  }

View on GitHub (pinned to 4700401311)

Solutions

  1. Read the attribute instead: editor.getAttribute("name").
  2. Target browsers supporting form-associated custom elements or add a polyfill.
  3. Update Trix; newer versions may broaden support.
  4. Treat null as "unsupported" and fall back to attribute-based naming.

Example fix

// before
const fieldName = editor.name
// after
const fieldName = editor.name || editor.getAttribute("name")
Defensive patterns

Strategy: fallback

Validate before calling

const name = editor.name ?? editor.getAttribute("name")
if (name == null) console.warn("trix-editor name unavailable in this browser")

Type guard

function getEditorName(editor) {
  return editor.name != null ? editor.name : editor.getAttribute("name")
}

Try / catch

let name = null
try {
  name = editor.name
} catch (e) {
  name = null
}
if (name == null) name = editor.getAttribute("name")

Prevention

When it happens

Trigger: Reading editorElement.name in a browser without the required custom element form-association support (e.g. no ElementInternals/name reflection), while relying on it for form submission wiring.

Common situations: Legacy browser support matrices; automated tests on old engines; code copying patterns from native inputs (input.name) onto the custom element.

Related errors


AI-assisted analysis of basecamp/trix@4700401311 (2026-09-02). Data as JSON: /api/errors/aed089c1a4d84674. Report an issue: GitHub.