HTMLSelectElement showPicker()

Category: User input
Type: New or changed feature
Status: Enabled by default (Chrome 121)
Intent stage: None

Breaking change: No
Enterprise impact: None
Chromium flag: #enable-experimental-web-platform-features
Spec maturity: Published standard
Web Platform Tests: No

WPT details: https://wpt.fyi/results/html/semantics/forms/the-select-element?label=master&label=experimental&aligned&q=show-picker We are able to test the error case behaviors but the actual showing of the picker is not testable using WPT.

Summary

Developers have been asking for a way to programmatically open the option picker of a select element. See https://www.google.com/search?q=programmatically+open+select+site%3Astackoverflow.com This is currently impossible in almost every browser. Providing showPicker() gives developers a supported way to do this. Following the pattern of input.showPicker().

Motivation

Developers have been asking for a way to programmatically open the option picker of a select element. See https://www.google.com/search?q=programmatically+open+select+site%3Astackoverflow.com This is currently impossible in almost every browser. Providing showPicker() gives developers a supported way to do this. Following the pattern of input.showPicker().

Standards & signals

Specification: https://html.spec.whatwg.org/multipage/input.html#dom-select-showpicker
Firefox: Positive — Implementation in progress
Safari: Support
Web developers: No signals
Tracking bug: https://bugs.chromium.org/p/chromium/issues/detail?id=1485010

Ecosystem

Web Platform Tests: https://wpt.fyi/results/?q=show-picker
Chrome Platform Showcase: https://chrome-platform-showcase.paulkinlan-ea.deno.net/features
GenDN reference: https://gendn.paulkinlan-ea.deno.net/features
chrome.dev demos search: https://www.google.com/search?q=site%3Achrome.dev+HTMLSelectElement%20showPicker()
MDN Web Docs: https://developer.mozilla.org/en-US/search?q=HTMLSelectElement%20showPicker()
Baseline status: https://webstatus.dev/?q=HTMLSelectElement%20showPicker()

Samples: https://select-show-picker.glitch.me/

Explainers: https://github.com/whatwg/html/pull/9754

View on chromestatus.com