Enhance <input type=color>: infrastructure for alpha and colorspace a…

…ttributes https://bugs.webkit.org/show_bug.cgi?id=281213 rdar://137663314 Reviewed by NOBODY (OOPS!). Add the necessary infrastructure for whatwg/html#10456. In particular: - Support the alpha and colorspace attributes behind a preference. - When the preference is enabled vastly expand the CSS color parsing and serialization capabilities of <input type=color>. Future changes will adjust the UI accordingly and add the necessary tests. * Source/WTF/Scripts/Preferences/UnifiedWebPreferences.yaml: * Source/WebCore/html/ColorInputType.cpp: (WebCore::colorParsingParameters): (WebCore::parseColorValue): (WebCore::serializeColorValue): (WebCore::ColorInputType::fallbackValue const): (WebCore::ColorInputType::sanitizeValue const): (WebCore::ColorInputType::valueAsColor const): (WebCore::ColorInputType::typeMismatchFor const): (WebCore::ColorInputType::didChooseColor): (WebCore::ColorInputType::suggestedColors const): (WebCore::ColorInputType::selectColor): * Source/WebCore/html/HTMLAttributeNames.in: * Source/WebCore/html/HTMLInputElement.cpp: (WebCore::HTMLInputElement::alpha): (WebCore::HTMLInputElement::colorSpace): (WebCore::HTMLInputElement::setColorSpace): * Source/WebCore/html/HTMLInputElement.h: * Source/WebCore/html/HTMLInputElement.idl:
annevk · Oct 11, 2024 · 4b921e1 · 4b921e1
1 parent b4239a3
commit 4b921e1
Show file tree

Hide file tree

Showing 6 changed files with 125 additions and 14 deletions.
diff --git a/Source/WTF/Scripts/Preferences/UnifiedWebPreferences.yaml b/Source/WTF/Scripts/Preferences/UnifiedWebPreferences.yaml
@@ -3582,6 +3582,21 @@ InputTypeColorEnabled:
       default: false
   sharedPreferenceForWebProcess: true
 
+InputTypeColorEnhancementsEnabled:
+  type: bool
+  status: unstable
+  category: html
+  condition: ENABLE(INPUT_TYPE_COLOR)
+  humanReadableName: "HTML alpha and colorspace attribute support for color inputs"
+  humanReadableDescription: "Enable HTML alpha and colorspace attribute support for input elements of type color"
+  defaultValue:
+    WebKitLegacy:
+      default: false
+    WebKit:
+      default: false
+    WebCore:
+      default: false
+
 InputTypeDateEnabled:
   type: bool
   status: embedder

diff --git a/Source/WebCore/html/ColorInputType.cpp b/Source/WebCore/html/ColorInputType.cpp
@@ -1,6 +1,6 @@
 /*
  * Copyright (C) 2010 Google Inc. All rights reserved.
- * Copyright (C) 2015-2020 Apple Inc. All rights reserved.
+ * Copyright (C) 2015-2024 Apple Inc. All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions are
@@ -37,6 +37,7 @@
 
 #include "AXObjectCache.h"
 #include "CSSPropertyNames.h"
+#include "CSSPropertyParserConsumer+Color.h"
 #include "Chrome.h"
 #include "Color.h"
 #include "ColorSerialization.h"
@@ -64,6 +65,12 @@ WTF_MAKE_TZONE_ALLOCATED_IMPL(ColorInputType);
 
 using namespace HTMLNames;
 
+using LazySlowPathColorParsingParameters = std::tuple<
+    CSSPropertyParserHelpers::CSSColorParsingOptions,
+    CSSUnresolvedColorResolutionState,
+    std::optional<CSSUnresolvedColorResolutionDelegate>
+>;
+
 // https://html.spec.whatwg.org/multipage/infrastructure.html#valid-simple-colour
 static bool isValidSimpleColor(StringView string)
 {
@@ -86,6 +93,59 @@ static std::optional<SRGBA<uint8_t>> parseSimpleColorValue(StringView string)
     return { { toASCIIHexValue(string[1], string[2]), toASCIIHexValue(string[3], string[4]), toASCIIHexValue(string[5], string[6]) } };
 }
 
+static LazySlowPathColorParsingParameters colorParsingParameters()
+{
+    return {
+        CSSPropertyParserHelpers::CSSColorParsingOptions {
+            .allowedColorTypes = { StyleColor::CSSColorType::Absolute, StyleColor::CSSColorType::Current, StyleColor::CSSColorType::System }
+        },
+        CSSUnresolvedColorResolutionState {
+            .resolvedCurrentColor = Color::black
+        },
+        std::nullopt
+    };
+}
+
+static std::optional<Color> parseColorValue(StringView string, HTMLInputElement& context)
+{
+    if (context.colorSpace().isNull())
+        return parseSimpleColorValue(string);
+
+    auto parserContext = context.document().cssParserContext();
+    parserContext.mode = HTMLStandardMode;
+    auto color = CSSPropertyParserHelpers::parseColorRaw(string.toString(), parserContext, [&] {
+        return colorParsingParameters();
+    });
+
+    if (!color.isValid())
+        return { };
+
+    return color;
+}
+
+static String serializeColorValue(Color input, HTMLInputElement& context)
+{
+    auto alpha = context.alpha();
+    auto colorSpace = context.colorSpace();
+
+    if (!alpha)
+        input = input.opaqueColor();
+
+    if (colorSpace.isNull() || colorSpace == "limited-srgb"_s) {
+        auto inputAsRGBA = input.toColorTypeLossy<SRGBA<uint8_t>>();
+        // When the alpha attribute is set the specification requires the modern color() serialization.
+        if (alpha)
+            input = { inputAsRGBA, { Color::Flags::UseColorFunctionSerialization } };
+        else
+            input = inputAsRGBA.resolved();
+    } else {
+        ASSERT(colorSpace == "display-p3"_s);
+        input = input.toColorTypeLossy<ExtendedDisplayP3<float>>().resolved();
+    }
+
+    return serializationForHTML(input);
+}
+
 ColorInputType::~ColorInputType()
 {
     endColorChooser();
@@ -124,21 +184,27 @@ bool ColorInputType::supportsRequired() const
 
 String ColorInputType::fallbackValue() const
 {
-    return "#000000"_s;
+    ASSERT(element());
+    return serializeColorValue(Color::black, *element());
 }
 
 String ColorInputType::sanitizeValue(const String& proposedValue) const
 {
-    if (!isValidSimpleColor(proposedValue))
+    ASSERT(element());
+    auto color = parseColorValue(proposedValue, *element());
+
+    if (!color)
         return fallbackValue();
 
-    return proposedValue.convertToASCIILowercase();
+    return serializeColorValue(*color, *element());
 }
 
 Color ColorInputType::valueAsColor() const
 {
     ASSERT(element());
-    return parseSimpleColorValue(element()->value()).value();
+    auto color = parseColorValue(element()->value(), *element());
+    ASSERT(!!color);
+    return *color;
 }
 
 void ColorInputType::createShadowSubtree()
@@ -231,7 +297,8 @@ bool ColorInputType::shouldRespectListAttribute()
 
 bool ColorInputType::typeMismatchFor(const String& value) const
 {
-    return !isValidSimpleColor(value);
+    ASSERT(element());
+    return !!parseColorValue(value, *element());
 }
 
 bool ColorInputType::shouldResetOnDocumentActivation()
@@ -246,13 +313,12 @@ void ColorInputType::didChooseColor(const Color& color)
     if (element()->isDisabledFormControl())
         return;
 
-    auto sRGBAColor = color.toColorTypeLossy<SRGBA<uint8_t>>().resolved();
-    auto sRGBColor = sRGBAColor.colorWithAlphaByte(255);
-    if (sRGBColor == valueAsColor())
+    auto serializedColor = serializeColorValue(color, *element());
+    if (serializedColor == element()->value())
         return;
 
     EventQueueScope scope;
-    element()->setValueFromRenderer(serializationForHTML(sRGBColor));
+    element()->setValueFromRenderer(serializedColor);
     updateColorSwatch();
     element()->dispatchFormControlChangeEvent();
 
@@ -312,7 +378,7 @@ Vector<Color> ColorInputType::suggestedColors() const
     ASSERT(element());
     if (auto dataList = element()->dataList()) {
         for (auto& option : dataList->suggestions()) {
-            if (auto color = parseSimpleColorValue(option.value()))
+            if (auto color = parseColorValue(option.value(), *element()))
                 suggestions.append(*color);
         }
     }
@@ -322,8 +388,9 @@ Vector<Color> ColorInputType::suggestedColors() const
 
 void ColorInputType::selectColor(StringView string)
 {
-    if (auto color = parseSimpleColorValue(string))
-        didChooseColor(color.value());
+    ASSERT(element());
+    if (auto color = parseColorValue(string, *element()))
+        didChooseColor(*color);
 }
 
 } // namespace WebCore

diff --git a/Source/WebCore/html/HTMLAttributeNames.in b/Source/WebCore/html/HTMLAttributeNames.in
@@ -12,6 +12,7 @@ align
 alink
 allow
 allowfullscreen
+alpha
 alt
 archive
 aria-activedescendant
@@ -103,6 +104,7 @@ code
 codebase
 codetype
 color
+colorspace
 cols
 colspan
 command

diff --git a/Source/WebCore/html/HTMLInputElement.cpp b/Source/WebCore/html/HTMLInputElement.cpp
@@ -1564,6 +1564,28 @@ void HTMLInputElement::setShowAutoFillButton(AutoFillButtonType autoFillButtonTy
         cache->autofillTypeChanged(*this);
 }
 
+bool HTMLInputElement::alpha()
+{
+    return document().settings().inputTypeColorEnhancementsEnabled() && hasAttributeWithoutSynchronization(alphaAttr);
+}
+
+String HTMLInputElement::colorSpace()
+{
+    if (!document().settings().inputTypeColorEnhancementsEnabled())
+        return nullString();
+
+    if (equalLettersIgnoringASCIICase(attributeWithoutSynchronization(colorspaceAttr), "display-p3"_s))
+        return "display-p3"_s;
+
+    return "limited-srgb"_s;
+}
+
+void HTMLInputElement::setColorSpace(const AtomString& value)
+{
+    ASSERT(document().settings().inputTypeColorEnhancementsEnabled());
+    setAttributeWithoutSynchronization(colorspaceAttr, value);
+}
+
 FileList* HTMLInputElement::files()
 {
     if (auto* fileInputType = dynamicDowncast<FileInputType>(*m_inputType))

diff --git a/Source/WebCore/html/HTMLInputElement.h b/Source/WebCore/html/HTMLInputElement.h
@@ -65,8 +65,11 @@ class HTMLInputElement final : public HTMLTextFormControlElement {
     static Ref<HTMLInputElement> create(const QualifiedName&, Document&, HTMLFormElement*, bool createdByParser);
     virtual ~HTMLInputElement();
 
+    bool alpha();
     bool checked() const { return m_isChecked; }
     WEBCORE_EXPORT void setChecked(bool, WasSetByJavaScript = WasSetByJavaScript::Yes);
+    String colorSpace();
+    void setColorSpace(const AtomString&);
     WEBCORE_EXPORT FileList* files();
     WEBCORE_EXPORT void setFiles(RefPtr<FileList>&&, WasSetByJavaScript = WasSetByJavaScript::No);
     FileList* filesForBindings() { return files(); }

diff --git a/Source/WebCore/html/HTMLInputElement.idl b/Source/WebCore/html/HTMLInputElement.idl
@@ -1,5 +1,5 @@
 /*
- * Copyright (C) 2006, 2010 Apple Inc. All rights reserved.
+ * Copyright (C) 2006-2024 Apple Inc. All rights reserved.
  * Copyright (C) 2006 Samuel Weinig <[email protected]>
  * Copyright (C) 2012 Samsung Electronics. All rights reserved.
  *
@@ -25,10 +25,12 @@
     Exposed=Window
 ] interface HTMLInputElement : HTMLElement {
     [CEReactions=NotNeeded, Reflect] attribute DOMString accept;
+    [Conditional=INPUT_TYPE_COLOR, EnabledBySetting=InputTypeColorEnhancementsEnabled, CEReactions=NotNeeded, Reflect] attribute boolean alpha;
     [CEReactions=NotNeeded, Reflect] attribute DOMString alt;
     [CEReactions=NotNeeded] attribute [AtomString] DOMString autocomplete;
     [CEReactions=NotNeeded, Reflect=checked] attribute boolean defaultChecked;
     attribute boolean checked;
+    [Conditional=INPUT_TYPE_COLOR, EnabledBySetting=InputTypeColorEnhancementsEnabled, CEReactions=NotNeeded] attribute [AtomString] DOMString colorSpace;
     [CEReactions=NotNeeded, Reflect] attribute DOMString dirName;
     [CEReactions=NotNeeded, Reflect] attribute boolean disabled;
     readonly attribute HTMLFormElement form;