27821996062

Committed 19 Jun 2026 11:05AM UTC coverage: 54.986% (-0.2%) from 55.191%

Build # 27821996062

Build Type

push

github

Committed by

scriptype

Commit Message

Fix form not submitting on Enter in input

because of the shadow dom boundary, an explicit bridge needed to
simulate native submit of form

Coverage Stats

642 of 1173 branches covered (54.73%)

Branch coverage included in aggregate %.

0 of 3 new or added lines in 1 file covered. (0.0%)

2242 of 4072 relevant lines covered (55.06%)

710.65 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

0.0

/src/cms/server/public/app/components/ContentEditor/TextField.js

import { LitElement, html } from 'lit'

class ContentEditorTextField extends LitElement {
  static formAssociated = true

  static properties = {
    value: { type: String },
    label: { type: String },
    name: { type: String },
    placeholder: { type: String }
  }

  constructor() {
    super()
    this.internals = this.attachInternals()
    this.value = ''
    this.label = 'Text'
    this.name = `text-field-${Date.now()}`
    this.placeholder = ''
    this.addEventListener('keydown', this.onKeyDown)
  }

  updated(changedProps) {
    if (changedProps.has('value')) {
      this.internals.setFormValue(this.value)
    }
  }

  onInput(e) {
    this.value = e.target.value
    this.internals.setFormValue(this.value)
  }

  onKeyDown(e) {
    if (e.key === 'Enter') {
      this.internals.form?.requestSubmit()
    }
  }

  render() {
    return html`
      <div class="content-editor-field">
        <label for="${this.name}-field">
          ${this.label}
        </label>
        <input
          type="text"
          @input="${this.onInput}"
          .value="${this.value}"
          placeholder="${this.placeholder}"
          id="${this.name}-field"
          name="${this.name}">
      </div>
    `
  }
}

customElements.define('content-editor-text-field', ContentEditorTextField)

export default ContentEditorTextField

1	import { LitElement, html } from 'lit'
2
3	class ContentEditorTextField extends LitElement {
4	static formAssociated = true	×
5
6	static properties = {	×
7	value: { type: String },
8	label: { type: String },
9	name: { type: String },
10	placeholder: { type: String }
11	}
12
13	constructor() {
14	super()	×
15	this.internals = this.attachInternals()	×
16	this.value = ''	×
17	this.label = 'Text'	×
18	this.name = `text-field-${Date.now()}`	×
19	this.placeholder = ''	×
NEW 20	this.addEventListener('keydown', this.onKeyDown)	×
21	}
22
23	updated(changedProps) {
24	if (changedProps.has('value')) {	×
25	this.internals.setFormValue(this.value)	×
26	}
27	}
28
29	onInput(e) {
30	this.value = e.target.value	×
31	this.internals.setFormValue(this.value)	×
32	}
33
34	onKeyDown(e) {
NEW 35	if (e.key === 'Enter') {	×
NEW 36	this.internals.form?.requestSubmit()	×
37	}
38	}
39
40	render() {
41	return html`	×
42	<div class="content-editor-field">
43	<label for="${this.name}-field">
44	${this.label}
45	</label>
46	<input
47	type="text"
48	@input="${this.onInput}"
49	.value="${this.value}"
50	placeholder="${this.placeholder}"
51	id="${this.name}-field"
52	name="${this.name}">
53	</div>
54	`
55	}
56	}
57
58	customElements.define('content-editor-text-field', ContentEditorTextField)	×
59
60	export default ContentEditorTextField

scriptype / writ-cms / 27821996062

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous