Log Message
[macOS] Color wells should appear rounded and textured https://bugs.webkit.org/show_bug.cgi?id=189039
Reviewed by Tim Horton. Source/WebCore: Color wells should have a rounded and textured appearance on macOS. We can use NSBezelStyleTexturedSquare to achieve this appearance. Also updated the user-agent stylesheet to match the system appearance. Rebaselined existing test: fast/forms/color/input-appearance-color.html * css/html.css: (input[type="color"]::-webkit-color-swatch-wrapper): (input[type="color"]::-webkit-color-swatch): * platform/mac/ThemeMac.mm: (WebCore::setUpButtonCell): * rendering/RenderThemeMac.h: Build fix. Source/WebKit: * UIProcess/mac/WebColorPickerMac.mm: Build fix. LayoutTests: Rebaseline tests to match new color-well appearance. * platform/mac/fast/forms/color/input-appearance-color-expected.png: * platform/mac/fast/forms/color/input-appearance-color-expected.txt:
Modified Paths
- trunk/LayoutTests/ChangeLog
- trunk/LayoutTests/platform/mac/fast/forms/color/input-appearance-color-expected.png
- trunk/LayoutTests/platform/mac/fast/forms/color/input-appearance-color-expected.txt
- trunk/Source/WebCore/ChangeLog
- trunk/Source/WebCore/css/html.css
- trunk/Source/WebCore/platform/mac/ThemeMac.mm
- trunk/Source/WebCore/rendering/RenderThemeMac.h
- trunk/Source/WebKit/ChangeLog
- trunk/Source/WebKit/UIProcess/mac/WebColorPickerMac.mm
Diff
Modified: trunk/LayoutTests/ChangeLog (235434 => 235435)
--- trunk/LayoutTests/ChangeLog 2018-08-28 18:37:46 UTC (rev 235434)
+++ trunk/LayoutTests/ChangeLog 2018-08-28 18:56:37 UTC (rev 235435)
@@ -1,3 +1,15 @@
+2018-08-28 Aditya Keerthi <[email protected]>
+
+ [macOS] Color wells should appear rounded and textured
+ https://bugs.webkit.org/show_bug.cgi?id=189039
+
+ Reviewed by Tim Horton.
+
+ Rebaseline tests to match new color-well appearance.
+
+ * platform/mac/fast/forms/color/input-appearance-color-expected.png:
+ * platform/mac/fast/forms/color/input-appearance-color-expected.txt:
+
2018-08-28 Youenn Fablet <[email protected]>
WebKitMediaSession should be GC collectable when its document is being stopped
Modified: trunk/LayoutTests/platform/mac/fast/forms/color/input-appearance-color-expected.png
(Binary files differ)
Modified: trunk/LayoutTests/platform/mac/fast/forms/color/input-appearance-color-expected.txt (235434 => 235435)
--- trunk/LayoutTests/platform/mac/fast/forms/color/input-appearance-color-expected.txt 2018-08-28 18:37:46 UTC (rev 235434)
+++ trunk/LayoutTests/platform/mac/fast/forms/color/input-appearance-color-expected.txt 2018-08-28 18:56:37 UTC (rev 235435)
@@ -12,10 +12,10 @@
RenderBR {BR} at (456,14) size 1x0
RenderBlock {INPUT} at (0,18) size 44x23 [bgcolor=#FFFFFF] [border: none (2px inset #000000) none (2px inset #000000)]
RenderFlexibleBox {DIV} at (3,1) size 38x21
- RenderBlock {DIV} at (2,4) size 34x13 [bgcolor=#000000] [border: (1px solid #8A8A8A)]
+ RenderBlock {DIV} at (2,4) size 34x12 [bgcolor=#000000]
RenderBlock {INPUT} at (44,18) size 44x23 [bgcolor=#FFFFFF] [border: none (2px inset #000000) none (2px inset #000000)]
RenderFlexibleBox {DIV} at (3,1) size 38x21
- RenderBlock {DIV} at (2,4) size 34x13 [bgcolor=#000000] [border: (1px solid #8A8A8A)]
+ RenderBlock {DIV} at (2,4) size 34x12 [bgcolor=#000000]
RenderText {#text} at (0,0) size 0x0
RenderBlock {H3} at (0,100) size 784x23
RenderText {#text} at (0,0) size 162x22
@@ -26,32 +26,32 @@
RenderBR {BR} at (589,14) size 1x0
RenderBlock {INPUT} at (0,18) size 44x23 [bgcolor=#FFFFFF] [border: none (2px inset #000000) none (2px inset #000000)]
RenderFlexibleBox {DIV} at (3,1) size 38x21
- RenderBlock {DIV} at (2,4) size 34x13 [bgcolor=#00FF00] [border: (1px solid #8A8A8A)]
+ RenderBlock {DIV} at (2,4) size 34x12 [bgcolor=#00FF00]
RenderText {#text} at (44,21) size 4x18
text run at (44,21) width 4: " "
RenderBlock {INPUT} at (48,18) size 44x23 [bgcolor=#FFFFFF] [border: none (2px inset #000000) none (2px inset #000000)]
RenderFlexibleBox {DIV} at (3,1) size 38x21
- RenderBlock {DIV} at (2,4) size 34x13 [bgcolor=#00FF00] [border: (1px solid #8A8A8A)]
+ RenderBlock {DIV} at (2,4) size 34x12 [bgcolor=#00FF00]
RenderText {#text} at (92,21) size 4x18
text run at (92,21) width 4: " "
RenderBlock {INPUT} at (96,18) size 44x23 [bgcolor=#FFFFFF] [border: none (2px inset #000000) none (2px inset #000000)]
RenderFlexibleBox {DIV} at (3,1) size 38x21
- RenderBlock {DIV} at (2,4) size 34x13 [bgcolor=#00FF00] [border: (1px solid #8A8A8A)]
+ RenderBlock {DIV} at (2,4) size 34x12 [bgcolor=#00FF00]
RenderText {#text} at (140,21) size 4x18
text run at (140,21) width 4: " "
RenderBlock {INPUT} at (144,18) size 44x23 [bgcolor=#FFFFFF] [border: none (2px inset #000000) none (2px inset #000000)]
RenderFlexibleBox {DIV} at (3,1) size 38x21
- RenderBlock {DIV} at (2,4) size 34x13 [bgcolor=#00FF00] [border: (1px solid #8A8A8A)]
+ RenderBlock {DIV} at (2,4) size 34x12 [bgcolor=#00FF00]
RenderText {#text} at (188,21) size 4x18
text run at (188,21) width 4: " "
RenderBlock {INPUT} at (192,18) size 44x23 [bgcolor=#FFFFFF] [border: none (2px inset #000000) none (2px inset #000000)]
RenderFlexibleBox {DIV} at (3,1) size 38x21
- RenderBlock {DIV} at (2,4) size 34x13 [bgcolor=#00FF00] [border: (1px solid #8A8A8A)]
+ RenderBlock {DIV} at (2,4) size 34x12 [bgcolor=#00FF00]
RenderText {#text} at (236,21) size 4x18
text run at (236,21) width 4: " "
RenderBlock {INPUT} at (240,18) size 44x23 [bgcolor=#FFFFFF] [border: none (2px inset #000000) none (2px inset #000000)]
RenderFlexibleBox {DIV} at (3,1) size 38x21
- RenderBlock {DIV} at (2,4) size 34x13 [bgcolor=#00FF00] [border: (1px solid #8A8A8A)]
+ RenderBlock {DIV} at (2,4) size 34x12 [bgcolor=#00FF00]
RenderText {#text} at (0,0) size 0x0
RenderBlock {H3} at (0,200) size 784x23
RenderText {#text} at (0,0) size 122x22
@@ -59,52 +59,52 @@
RenderBlock (anonymous) at (0,241) size 784x24
RenderBlock {INPUT} at (0,0) size 44x23 [bgcolor=#FFFFFF] [border: none (2px inset #000000) none (2px inset #000000)]
RenderFlexibleBox {DIV} at (3,1) size 38x21
- RenderBlock {DIV} at (2,4) size 34x13 [bgcolor=#FF0000] [border: (1px solid #8A8A8A)]
+ RenderBlock {DIV} at (2,4) size 34x12 [bgcolor=#FF0000]
RenderText {#text} at (44,3) size 4x18
text run at (44,3) width 4: " "
RenderBlock {INPUT} at (48,0) size 44x23 [bgcolor=#FFFFFF] [border: none (2px inset #000000) none (2px inset #000000)]
RenderFlexibleBox {DIV} at (3,1) size 38x21
- RenderBlock {DIV} at (2,4) size 34x13 [bgcolor=#00FF00] [border: (1px solid #8A8A8A)]
+ RenderBlock {DIV} at (2,4) size 34x12 [bgcolor=#00FF00]
RenderText {#text} at (92,3) size 4x18
text run at (92,3) width 4: " "
RenderBlock {INPUT} at (96,0) size 44x23 [bgcolor=#FFFFFF] [border: none (2px inset #000000) none (2px inset #000000)]
RenderFlexibleBox {DIV} at (3,1) size 38x21
- RenderBlock {DIV} at (2,4) size 34x13 [bgcolor=#0000FF] [border: (1px solid #8A8A8A)]
+ RenderBlock {DIV} at (2,4) size 34x12 [bgcolor=#0000FF]
RenderText {#text} at (140,3) size 4x18
text run at (140,3) width 4: " "
RenderBlock {INPUT} at (144,0) size 44x23 [bgcolor=#FFFFFF] [border: none (2px inset #000000) none (2px inset #000000)]
RenderFlexibleBox {DIV} at (3,1) size 38x21
- RenderBlock {DIV} at (2,4) size 34x13 [bgcolor=#EC008C] [border: (1px solid #8A8A8A)]
+ RenderBlock {DIV} at (2,4) size 34x12 [bgcolor=#EC008C]
RenderText {#text} at (188,3) size 4x18
text run at (188,3) width 4: " "
RenderBlock {INPUT} at (192,0) size 44x23 [bgcolor=#FFFFFF] [border: none (2px inset #000000) none (2px inset #000000)]
RenderFlexibleBox {DIV} at (3,1) size 38x21
- RenderBlock {DIV} at (2,4) size 34x13 [bgcolor=#40E0D0] [border: (1px solid #8A8A8A)]
+ RenderBlock {DIV} at (2,4) size 34x12 [bgcolor=#40E0D0]
RenderText {#text} at (236,3) size 4x18
text run at (236,3) width 4: " "
RenderBlock {INPUT} at (240,0) size 44x23 [bgcolor=#FFFFFF] [border: none (2px inset #000000) none (2px inset #000000)]
RenderFlexibleBox {DIV} at (3,1) size 38x21
- RenderBlock {DIV} at (2,4) size 34x13 [bgcolor=#FF0000] [border: (1px solid #8A8A8A)]
+ RenderBlock {DIV} at (2,4) size 34x12 [bgcolor=#FF0000]
RenderText {#text} at (284,3) size 4x18
text run at (284,3) width 4: " "
RenderBlock {INPUT} at (288,0) size 44x23 [bgcolor=#FFFFFF] [border: none (2px inset #000000) none (2px inset #000000)]
RenderFlexibleBox {DIV} at (3,1) size 38x21
- RenderBlock {DIV} at (2,4) size 34x13 [bgcolor=#00FF00] [border: (1px solid #8A8A8A)]
+ RenderBlock {DIV} at (2,4) size 34x12 [bgcolor=#00FF00]
RenderText {#text} at (332,3) size 4x18
text run at (332,3) width 4: " "
RenderBlock {INPUT} at (336,0) size 44x23 [bgcolor=#FFFFFF] [border: none (2px inset #000000) none (2px inset #000000)]
RenderFlexibleBox {DIV} at (3,1) size 38x21
- RenderBlock {DIV} at (2,4) size 34x13 [bgcolor=#0000FF] [border: (1px solid #8A8A8A)]
+ RenderBlock {DIV} at (2,4) size 34x12 [bgcolor=#0000FF]
RenderText {#text} at (380,3) size 4x18
text run at (380,3) width 4: " "
RenderBlock {INPUT} at (384,0) size 44x23 [bgcolor=#FFFFFF] [border: none (2px inset #000000) none (2px inset #000000)]
RenderFlexibleBox {DIV} at (3,1) size 38x21
- RenderBlock {DIV} at (2,4) size 34x13 [bgcolor=#EC008C] [border: (1px solid #8A8A8A)]
+ RenderBlock {DIV} at (2,4) size 34x12 [bgcolor=#EC008C]
RenderText {#text} at (428,3) size 4x18
text run at (428,3) width 4: " "
RenderBlock {INPUT} at (432,0) size 44x23 [bgcolor=#FFFFFF] [border: none (2px inset #000000) none (2px inset #000000)]
RenderFlexibleBox {DIV} at (3,1) size 38x21
- RenderBlock {DIV} at (2,4) size 34x13 [bgcolor=#40E0D0] [border: (1px solid #8A8A8A)]
+ RenderBlock {DIV} at (2,4) size 34x12 [bgcolor=#40E0D0]
RenderText {#text} at (0,0) size 0x0
RenderBlock {H3} at (0,283) size 784x23
RenderText {#text} at (0,0) size 118x22
@@ -112,4 +112,4 @@
RenderBlock (anonymous) at (0,324) size 784x31
RenderBlock {INPUT} at (0,0) size 100x30 [bgcolor=#FFFFFF] [border: none (2px inset #000000) none (2px inset #000000)]
RenderFlexibleBox {DIV} at (3,1) size 94x28
- RenderBlock {DIV} at (2,4) size 90x20 [bgcolor=#FF0000] [border: (1px solid #8A8A8A)]
+ RenderBlock {DIV} at (2,4) size 90x19 [bgcolor=#FF0000]
Modified: trunk/Source/WebCore/ChangeLog (235434 => 235435)
--- trunk/Source/WebCore/ChangeLog 2018-08-28 18:37:46 UTC (rev 235434)
+++ trunk/Source/WebCore/ChangeLog 2018-08-28 18:56:37 UTC (rev 235435)
@@ -1,3 +1,24 @@
+2018-08-28 Aditya Keerthi <[email protected]>
+
+ [macOS] Color wells should appear rounded and textured
+ https://bugs.webkit.org/show_bug.cgi?id=189039
+
+ Reviewed by Tim Horton.
+
+ Color wells should have a rounded and textured appearance on macOS. We can use
+ NSBezelStyleTexturedSquare to achieve this appearance.
+
+ Also updated the user-agent stylesheet to match the system appearance.
+
+ Rebaselined existing test: fast/forms/color/input-appearance-color.html
+
+ * css/html.css:
+ (input[type="color"]::-webkit-color-swatch-wrapper):
+ (input[type="color"]::-webkit-color-swatch):
+ * platform/mac/ThemeMac.mm:
+ (WebCore::setUpButtonCell):
+ * rendering/RenderThemeMac.h: Build fix.
+
2018-08-28 Youenn Fablet <[email protected]>
WebKitMediaSession should be GC collectable when its document is being stopped
Modified: trunk/Source/WebCore/css/html.css (235434 => 235435)
--- trunk/Source/WebCore/css/html.css 2018-08-28 18:37:46 UTC (rev 235434)
+++ trunk/Source/WebCore/css/html.css 2018-08-28 18:56:37 UTC (rev 235435)
@@ -896,7 +896,7 @@
input[type="color"]::-webkit-color-swatch-wrapper {
display: flex;
- padding: 4px 2px;
+ padding: 4px 2px 5px;
box-sizing: border-box;
width: 100%;
height: 100%;
@@ -904,7 +904,7 @@
input[type="color"]::-webkit-color-swatch {
background-color: #000000;
- border: 1px solid #8A8A8A;
+ border-radius: 2px;
flex: 1;
}
Modified: trunk/Source/WebCore/platform/mac/ThemeMac.mm (235434 => 235435)
--- trunk/Source/WebCore/platform/mac/ThemeMac.mm 2018-08-28 18:37:46 UTC (rev 235434)
+++ trunk/Source/WebCore/platform/mac/ThemeMac.mm 2018-08-28 18:56:37 UTC (rev 235435)
@@ -496,16 +496,20 @@
{
// Set the control size based off the rectangle we're painting into.
const std::array<IntSize, 3>& sizes = buttonSizes();
- if (part == SquareButtonPart
+ switch (part) {
+ case SquareButtonPart:
+ [cell setBezelStyle:NSBezelStyleShadowlessSquare];
+ break;
#if ENABLE(INPUT_TYPE_COLOR)
- || part == ColorWellPart
+ case ColorWellPart:
+ [cell setBezelStyle:NSBezelStyleTexturedSquare];
+ break;
#endif
- || zoomedSize.height() > buttonSizes()[NSControlSizeRegular].height() * zoomFactor) {
- // Use the square button
- if ([cell bezelStyle] != NSBezelStyleShadowlessSquare)
- [cell setBezelStyle:NSBezelStyleShadowlessSquare];
- } else if ([cell bezelStyle] != NSBezelStyleRounded)
- [cell setBezelStyle:NSBezelStyleRounded];
+ default:
+ NSBezelStyle style = (zoomedSize.height() > buttonSizes()[NSControlSizeRegular].height() * zoomFactor) ? NSBezelStyleShadowlessSquare : NSBezelStyleRounded;
+ [cell setBezelStyle:style];
+ break;
+ }
setControlSize(cell, sizes, zoomedSize, zoomFactor);
Modified: trunk/Source/WebCore/rendering/RenderThemeMac.h (235434 => 235435)
--- trunk/Source/WebCore/rendering/RenderThemeMac.h 2018-08-28 18:37:46 UTC (rev 235434)
+++ trunk/Source/WebCore/rendering/RenderThemeMac.h 2018-08-28 18:56:37 UTC (rev 235435)
@@ -157,7 +157,7 @@
#if ENABLE(DATALIST_ELEMENT)
void paintListButtonForInput(const RenderObject&, GraphicsContext&, const FloatRect&);
- void adjustListButtonStyle(StyleResolver&, RenderStyle&, const Element*) const;
+ void adjustListButtonStyle(StyleResolver&, RenderStyle&, const Element*) const final;
#endif
#if ENABLE(VIDEO)
Modified: trunk/Source/WebKit/ChangeLog (235434 => 235435)
--- trunk/Source/WebKit/ChangeLog 2018-08-28 18:37:46 UTC (rev 235434)
+++ trunk/Source/WebKit/ChangeLog 2018-08-28 18:56:37 UTC (rev 235435)
@@ -1,5 +1,14 @@
2018-08-28 Aditya Keerthi <[email protected]>
+ [macOS] Color wells should appear rounded and textured
+ https://bugs.webkit.org/show_bug.cgi?id=189039
+
+ Reviewed by Tim Horton.
+
+ * UIProcess/mac/WebColorPickerMac.mm: Build fix.
+
+2018-08-28 Aditya Keerthi <[email protected]>
+
[Datalist] Pressing enter without a selected option shouldn't change the input
https://bugs.webkit.org/show_bug.cgi?id=189010
Modified: trunk/Source/WebKit/UIProcess/mac/WebColorPickerMac.mm (235434 => 235435)
--- trunk/Source/WebKit/UIProcess/mac/WebColorPickerMac.mm 2018-08-28 18:37:46 UTC (rev 235434)
+++ trunk/Source/WebKit/UIProcess/mac/WebColorPickerMac.mm 2018-08-28 18:56:37 UTC (rev 235435)
@@ -63,7 +63,7 @@
@interface WKColorPopoverMac : NSObject<WKColorPickerUIMac, WKPopoverColorWellDelegate, NSWindowDelegate> {
@private
BOOL _lastChangedByUser;
- WebColorPickerMac *_picker;
+ WebKit::WebColorPickerMac *_picker;
RetainPtr<WKPopoverColorWell> _popoverWell;
}
- (id)initWithFrame:(const WebCore::IntRect &)rect inView:(NSView *)view;
_______________________________________________ webkit-changes mailing list [email protected] https://lists.webkit.org/mailman/listinfo/webkit-changes
