Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[macOS] Fix input[type=search] rendering in vertical writing mode #20146

Merged
merged 1 commit into from
Nov 9, 2023

Conversation

pxlcoder
Copy link
Member

@pxlcoder pxlcoder commented Nov 8, 2023

64d1b1b

[macOS] Fix input[type=search] rendering in vertical writing mode
https://bugs.webkit.org/show_bug.cgi?id=248334
rdar://102658361

Reviewed by Tim Nguyen.

Native search fields are not height resizable, and have shadows,
preventing their use in vertical writing mode. Instead, fall back
to drawing native text fields, which are height resizable.

Additionally, ensure that the cancel and results buttons are displayed
correctly in vertical writing mode.

* Source/WebCore/html/shadow/TextControlInnerElements.cpp:

253691@main introduced logic to hide the cancel and results buttons when
authors specify `appearance: textfield` on search inputs. Preserve this
functionality, but also allow cases where the user agent applies
`appearance: textfield` for rendering purposes (in this case, in vertical
writing mode), by comparing `appearance` in addition to `effectiveAppearance`.

(WebCore::searchFieldStyleHasExplicitlySpecifiedTextFieldAppearance):
(WebCore::SearchFieldResultsButtonElement::resolveCustomStyle):
(WebCore::SearchFieldCancelButtonElement::resolveCustomStyle):
* Source/WebCore/rendering/RenderTheme.cpp:
(WebCore::RenderTheme::adjustStyle):

Set an effective appearance of `TextField` for search fields using a vertical
writing mode.

* Source/WebCore/rendering/RenderTheme.h:
(WebCore::RenderTheme::searchFieldShouldAppearAsTextField const):
* Source/WebCore/rendering/RenderThemeMac.h:
* Source/WebCore/rendering/RenderThemeMac.mm:
(WebCore::RenderThemeMac::searchFieldShouldAppearAsTextField const):
(WebCore::RenderThemeMac::adjustSearchFieldDecorationPartStyle const):

While the results and cancel buttons are not being rotated, ensure there is not
an excessive amount of padding at the logical top of the control in cases where
the results button is hidden.

Canonical link: https://commits.webkit.org/270415@main

2998648

Misc iOS, tvOS & watchOS macOS Linux Windows
✅ 🧪 style ✅ 🛠 ios ✅ 🛠 mac ✅ 🛠 wpe ✅ 🛠 wincairo
✅ 🧪 bindings ✅ 🛠 ios-sim ✅ 🛠 mac-AS-debug ✅ 🧪 wpe-wk2
✅ 🧪 webkitperl ⏳ 🧪 ios-wk2 ✅ 🧪 api-mac ✅ 🛠 gtk
⏳ 🧪 ios-wk2-wpt ✅ 🧪 mac-wk1 ✅ 🧪 gtk-wk2
⏳ 🧪 api-ios ✅ 🧪 mac-wk2 ✅ 🧪 api-gtk
✅ 🛠 tv ✅ 🧪 mac-AS-debug-wk2
✅ 🛠 tv-sim
✅ 🛠 watch ⏳ 🛠 jsc-mips
✅ 🛠 🧪 unsafe-merge ✅ 🛠 watch-sim ⏳ 🧪 jsc-mips-tests

@pxlcoder pxlcoder self-assigned this Nov 8, 2023
@pxlcoder pxlcoder added the Forms For bugs specific to form elements (checkboxes, buttons, text fields, etc.) label Nov 8, 2023
Comment on lines 257 to 272
auto effectiveAppearance = shadowHostStyle->effectiveAppearance();
if (effectiveAppearance == StyleAppearance::TextField && shadowHostStyle->appearance() == StyleAppearance::TextField) {
auto elementStyle = resolveStyle(resolutionContext);
elementStyle.style->setDisplay(DisplayType::None);
return elementStyle;
}
if (appearance != StyleAppearance::SearchField) {
if (effectiveAppearance != StyleAppearance::SearchField && effectiveAppearance != StyleAppearance::TextField) {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

These checks are not super pretty nor self explanatory IMO.

We should probably have a static method in this file that takes a RenderStyle and says whether the effectiveAppearance is default based on the writing mode and the effectiveAppearance.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'll add a static method with a good name for clarity. Though the method won't consider writing-mode, since that's a macOS specific behavior. It's more about the original appearance the author specified.

Comment on lines +207 to +212
if (appearance == StyleAppearance::SearchField && searchFieldShouldAppearAsTextField(style)) {
appearance = StyleAppearance::TextField;
style.setEffectiveAppearance(appearance);
}
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I somewhat wished we had all of this logic in autoAppearanceForElement

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I wanted to keep the special case separate, similar to the isControlStyled cases. Going to leave this as-is unless you feel strongly.

@pxlcoder pxlcoder added the unsafe-merge-queue Applied to send a pull request to merge-queue, but skip building and testing label Nov 9, 2023
https://bugs.webkit.org/show_bug.cgi?id=248334
rdar://102658361

Reviewed by Tim Nguyen.

Native search fields are not height resizable, and have shadows,
preventing their use in vertical writing mode. Instead, fall back
to drawing native text fields, which are height resizable.

Additionally, ensure that the cancel and results buttons are displayed
correctly in vertical writing mode.

* Source/WebCore/html/shadow/TextControlInnerElements.cpp:

253691@main introduced logic to hide the cancel and results buttons when
authors specify `appearance: textfield` on search inputs. Preserve this
functionality, but also allow cases where the user agent applies
`appearance: textfield` for rendering purposes (in this case, in vertical
writing mode), by comparing `appearance` in addition to `effectiveAppearance`.

(WebCore::searchFieldStyleHasExplicitlySpecifiedTextFieldAppearance):
(WebCore::SearchFieldResultsButtonElement::resolveCustomStyle):
(WebCore::SearchFieldCancelButtonElement::resolveCustomStyle):
* Source/WebCore/rendering/RenderTheme.cpp:
(WebCore::RenderTheme::adjustStyle):

Set an effective appearance of `TextField` for search fields using a vertical
writing mode.

* Source/WebCore/rendering/RenderTheme.h:
(WebCore::RenderTheme::searchFieldShouldAppearAsTextField const):
* Source/WebCore/rendering/RenderThemeMac.h:
* Source/WebCore/rendering/RenderThemeMac.mm:
(WebCore::RenderThemeMac::searchFieldShouldAppearAsTextField const):
(WebCore::RenderThemeMac::adjustSearchFieldDecorationPartStyle const):

While the results and cancel buttons are not being rotated, ensure there is not
an excessive amount of padding at the logical top of the control in cases where
the results button is hidden.

Canonical link: https://commits.webkit.org/270415@main
@webkit-commit-queue
Copy link
Collaborator

Committed 270415@main (64d1b1b): https://commits.webkit.org/270415@main

Reviewed commits have been landed. Closing PR #20146 and removing active labels.

@webkit-commit-queue webkit-commit-queue merged commit 64d1b1b into WebKit:main Nov 9, 2023
@webkit-commit-queue webkit-commit-queue removed the unsafe-merge-queue Applied to send a pull request to merge-queue, but skip building and testing label Nov 9, 2023
@pxlcoder pxlcoder deleted the eng/248334 branch November 9, 2023 00:58
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Forms For bugs specific to form elements (checkboxes, buttons, text fields, etc.)
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants