= How to enable Form features = == input[type=number] == If you have never done anything for input[type=number], it lacks the following features: Spin button UI Number localization === Spin button UI === This is optional. Opera has similar UI, but IE10 has no spin button. If you want the spin button UI, implement RenderTheme::adjustInnerSpinButtonStyle and paintInnerSpinButtonStyle. Test: fast/forms/number/number-{appearance,spinbutton}*.html === Number localization === This is optional. IE10 localizes numbers, but Opera doesn't. This feature requires Locale class implementation. If your port is using WebCore/platform/text/LocaleNone.cpp, this feature is disabled. Use WebCore/platform/text/{LocaleICU.cpp,mac/LocaleMac.mm,win/LocaleWin.cpp}, or implement your own Locale class. Test: fast/forms/number/number-l10n-input.html == Interactive form validation == 1. Implement WebCore/page/ValidationMessageClient.h for your port 2. Set it to PageClients::validationMessageClient 3. Page::settings()->setInteractiveFormValidationEnabled(true) Doing step 3 without step 1 and 2 enables platform-neutral form validation UI. But it has some unresolvable bugs. You should provide your ValidationMessageClient. == input[type=color] == Enable ENABLE_INPUT_TYPE_COLOR flag, and implement ChromeClient::createColorChooser. == Date, datetime-local, month, time, week input types == WebCore provides two UI types for them. Multiple-fields UI (ENABLE_INPUT_MULTIPLE_FIELDS_UI flag) Chooser-only UI (no ENABLE_INPUT_MULTIPLE_FIELDS_UI flag) In the multiple-fields UI, users can specify values quickly with keyboard or mouse input. This UI is not suitable for mobile devices with touch input. Optionally we can provide platform-specific chooser dialog UI. The Chooser-only UI is simple. We provide only platform-specific chooser dialog UI. === Chooser-only UI === 1. Enable ENABLE_INPUT_TYPE_FOO without ENABLE_INPUT_MULTIPLE_FIELDS_UI 2. Implement Locale class (See "Number localization" section) 3. Implement ChromeClient::openDateTimeChooser === Multiple-fields UI === 1. Enable ENABLE_INPUT_TYPE_FOO and ENABLE_INPUT_MULTIPLE_FIELDS_UI 2. Implement Locale class (See "Number localization" section) 2. Implement RenderTheme::adjustInnerSpinButonStyle and paintInnerSpinButtonStyle 3. Optionally, provide chooser dialog UI. 3.1 Implement RenderTheme::supportsCalendarPicker so that it returns true for supported input types. 3.2 Implement ChromeClient::openDateTimeChooser Note that WebCore has calendar chooser implementation built with HTML. It supports date type, month type, week type, and year-month-day part of datetime-local type. It requires ENABLE_CALENDAR_PICKER and ENABLE_PAGE_POPUP. This implementation doesn't support time type and the time part of datetime-local type. If we add their support in the future, ENABLE_CALENDAR_PICKER can be used for the chooser-only UI too. == input[type=datetime] == Do not enable it. You can not make an appropriate UI with the current WebCore code. == Datalist element == This depends on input types. === Text field types === 1. Enable ENABLE_DATALIST_ELEMENT 2. Implement RenderTheme::supportsDataListUI so that it returns true for supported types. 3. In WebKit layer, hook keyboard input, focus, or touch events for a target text field, and show UI to choose values of HTMLInputElement::dataList. === Range type === 1. Enable ENABLE_DATALIST_ELEMENT 2. Implement RenderTheme::supportsDataListUI so that it returns true for range type. 3. Implement/override RenderTheme::slideTickSnappingThreshold, sliderTickSize, sliderTickOffsetFromTrackCenter. === Color type === 1. Enable ENABLE_DATALIST_ELEMENT 2. Implement RenderTheme::supportsDataListUI so that it returns true for color type. 3. Your ColorChooser implementation should respect ColorChooserClient::shouldShowSuggestions and suggestions. === Date, datetime-local, month, time, week types === 1. Enable ENABLE_DATALIST_ELEMENT 2. Implement RenderTheme::supportsDataListUI so that it returns true for supported types. 3. Implement ChromeClient::openDateTimeChooser so that it handles DateTimeChooserParameters::suggestionValues.