react-spectrum icon indicating copy to clipboard operation
react-spectrum copied to clipboard

feat: add autocomplete prop to rac datefield + datepicker

Open yihuiliao opened this issue 9 months ago • 11 comments

Closes https://github.com/adobe/react-spectrum/issues/7167

Excludes adding autocomplete prop to DateRangePicker since the only date spec that is really supported is "bday" and those don't really come in ranges. See spec: https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill

This is just a RAC change but we could add it to Spectrum probably.

✅ Pull Request Checklist:

  • [ ] Included link to corresponding React Spectrum GitHub Issue.
  • [ ] Added/updated unit tests and storybook for this change (for new code or code which already has tests).
  • [ ] Filled out test instructions.
  • [ ] Updated documentation (if it already exists for this component).
  • [ ] Looked at the Accessibility Practices for this feature - Aria Practices

📝 Test Instructions:

Personally, I've only been able to get this working in Safari. You need to ensure that you have your contact information filled out for it to work. Browser support for date autofill is spotty at best. See https://www.w3.org/WAI/GL/wiki/WCAG_2.1_Implementations/JF/research

When you type into the textfield, (you might need to click in the textfield a couple times), a popover should appear that looks something like this. Click the option with that says "fill birthday" and it should autofill

Screenshot 2025-02-14 at 12 05 49 PM

yihuiliao avatar Feb 14 '25 19:02 yihuiliao