material-components / material-components/material-web

Pressing enter in a text field does not submit form

Open
#4,182 21 comments 12 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
SCSS
Stars
11.3k
Forks
1.1k
Avg merge
20h 28m
Merged PRs (30d)
13

Description

Hi! I've built a small form example:
```


```

But it does not submit in any of the following cases:
- Click the `Submit` button
- Press Enter key when the text field is focused
- Press Enter key when the button is focused

I understand it's an issue related to shadow dom, but, is there a way to make this work as expected?

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Reproduce the supplied form using md-outlined-text-field and md-filled-button, then locate the entry points for those components and inspect their Shadow DOM form behavior. Verify submission by clicking the button and pressing Enter while either control is focused; done means the GET form submits in all three cases.

Written by the indexing model from the issue text.

Assessment

Domain
frontend, web-dev
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.