ampproject / ampproject/amphtml
Inconsistent rendering of amp-autocomplete
- Dominant language
- JavaScript
- Stars
- 14.9k
- Forks
- 4.1k
- PR merge metrics
- No merged PRs in 30d
Description
### Description
Amp-autocomplete renders the associated input field differently, depending on browser and/or if it uses amp-moustache. In chromium based browsers the close button (x) is sometimes displayed inside the INPUT element (if autocomplete uses amp-moustache template), while in Firefox it is never displayed.
Also I have been unable to find a way NOT to display the close button, as it interferes with a custom icon used in input fields I am working on.
### Reproduction Steps
https://amp.dev/documentation/examples/components/amp-autocomplete/?format=websites
Compare your example page in Chrome and Firefox. In Firefox the (x) close button is never displayed, while in Chrome it's sometimes displayed, sometimes not.
Chromium (106.0.5249.91):




Firefox (105.0.1):


### Relevant Logs
_No response_
### Browser(s) Affected
Chrome, Firefox
### OS(s) Affected
Linux
### Device(s) Affected
_No response_
### AMP Version Affected
2209142312000
Contributor guide
Research direction
Start with the amp-autocomplete example at https://amp.dev/documentation/examples/components/amp-autocomplete/?format=websites and reproduce the input rendering in Chrome and Firefox on Linux. Investigate the differing close-button behavior, including the amp-moustache case and the custom-icon conflict; the issue is resolved when rendering is consistent and the close button can be omitted.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100