-
Notifications
You must be signed in to change notification settings - Fork 1.3k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
[iOS] Refactor date/time form controls on iOS to use a popover presen…
…tation https://bugs.webkit.org/show_bug.cgi?id=261627 rdar://115581849 Reviewed by Aditya Keerthi. Change date and time inputs on iOS to use a `UIDatePicker` view hosted inside of `UIPopoverPresentationController`, rather than `_UIDatePickerOverlayPresentation`. This also changes the behavior and appearance of the form accessory view, such that it presents with an arrow pointing to the source rect in the content view, instead of a context-menu-like appearance. See comments below for more information. * LayoutTests/fast/forms/ios/input-peripherals-with-validation-message.html: Adjust this test to use the new `UIHelper.isShowingFormValidationBubble()` method; this is necessary because the current method, `isShowingPopover()`, returns `true` when *either* the date picker or validation bubble is presented (due to adopting `UIPopoverPresentationController`), but the test expects it to be `true` only when the validation bubble is presented. * LayoutTests/resources/ui-helper.js: (window.UIHelper.isShowingFormValidationBubble): (window.UIHelper.isShowingPopover): Deleted. See above for more details; we can also just remove `isShowingPopover()` here, since the test above was the only caller. * Source/WTF/wtf/PlatformHave.h: Remove the now-unnecessary `HAVE(UIDATEPICKER_OVERLAY_PRESENTATION)` compile-time flag. * Source/WebKit/Platform/spi/ios/UIKitSPI.h: * Source/WebKit/SourcesCocoa.txt: * Source/WebKit/UIProcess/API/ios/WKWebViewIOS.h: * Source/WebKit/UIProcess/ios/forms/WKDatePickerPopoverController.h: Added. * Source/WebKit/UIProcess/ios/forms/WKDatePickerPopoverController.mm: Added. (-[WKDatePickerPopoverView initWithDatePicker:]): (-[WKDatePickerPopoverView datePicker]): Add a `WKDatePickerPopoverView` to encapsulate and help manage the toolbar (accessory view), date picker view, and backdrop view in the background. (-[WKDatePickerPopoverView accessoryView]): (-[WKDatePickerPopoverController initWithDatePicker:delegate:]): (-[WKDatePickerPopoverController resetDatePicker]): (-[WKDatePickerPopoverController dismissDatePicker]): (-[WKDatePickerPopoverController viewDidLoad]): (-[WKDatePickerPopoverController presentInView:sourceRect:interactionBounds:completion:]): (-[WKDatePickerPopoverController adaptivePresentationStyleForPresentationController:traitCollection:]): (-[WKDatePickerPopoverController presentationControllerDidDismiss:]): Add a new `WKDatePickerPopoverController` that takes a date picker and delegate, knows how to present the date picker, and also calls back into the `WKDateTimePicker` via delegate methods. * Source/WebKit/UIProcess/ios/forms/WKDateTimeInputControl.mm: (-[WKDateTimePicker initWithView:datePickerMode:]): (-[WKDateTimePicker datePickerPopoverControllerDidDismiss:]): (-[WKDateTimePicker datePickerPopoverControllerDidReset:]): (-[WKDateTimePicker handleDatePickerPresentationDismissal]): (-[WKDateTimePicker removeDatePickerPresentation]): (-[WKDateTimePicker showDateTimePicker]): Replace `_UIDatePickerOverlayPresentation` with this new `WKDatePickerPopoverController`. (-[WKDateTimePicker dateFormatterForPicker]): (-[WKDateTimePicker _dateChanged]): (-[WKDateTimePicker controlBeginEditing]): Make a slight adjustment here for Catalyst, so that we always relinquish first responder to the imminently-presenting popover when focusing a date/time input. With the new popover (but without this change), we'll immediately dismiss the popover upon focus because the popover causes the web view to resign first responder, which would otherwise cause us to hide the popover. Note that this new design *also* generally fixes date time inputs in Catalyst; while we don't run into the problem described above, we currently have a different serious bug, wherein the contents of the date picker don't respond to clicks until switching to a different window and switching back. This patch makes date pickers work without this weird caveat. (-[WKDateTimePicker controlEndEditing]): (-[WKDateTimeInputControl initWithView:]): (-[WKDateTimePicker datePickerChanged:]): Deleted. (-[WKDateTimePicker reset:]): Deleted. (-[WKDateTimePicker done:]): Deleted. Replace these action selectors with `WKDatePickerPopoverControllerDelegate` method implementations instead. * Source/WebKit/UIProcess/mac/WKImmediateActionController.h: Fix a unified-source build failure that's surfaced by the new file in this patch. * Source/WebKit/WebKit.xcodeproj/project.pbxproj: * Tools/TestRunnerShared/UIScriptContext/Bindings/UIScriptController.idl: * Tools/TestRunnerShared/UIScriptContext/UIScriptController.h: (WTR::UIScriptController::isShowingFormValidationBubble const): Add support for a new testing hook; see above for more details. * Tools/WebKitTestRunner/cocoa/TestRunnerWKWebView.h: * Tools/WebKitTestRunner/cocoa/TestRunnerWKWebView.mm: (-[TestRunnerWKWebView initWithFrame:configuration:]): (-[TestRunnerWKWebView _willPresentPopover:]): (-[TestRunnerWKWebView _didDismissPopover]): Adjust the test harness to set `showingFormValidationBubble` when observing a popover presentation notification, only if the object's delegate is a `WebValidationBubbleDelegate`. While a bit hacky, I opted for this approach since it keeps all the testing code within the test harness, and doesn't require additional (intrusive) test-only code in the engine itself. (-[TestRunnerWKWebView _willPresentPopover]): Deleted. * Tools/WebKitTestRunner/ios/UIScriptControllerIOS.h: * Tools/WebKitTestRunner/ios/UIScriptControllerIOS.mm: (WTR::UIScriptControllerIOS::isShowingFormValidationBubble const): Canonical link: https://commits.webkit.org/268069@main
- Loading branch information
Showing
17 changed files
with
334 additions
and
129 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
44 changes: 44 additions & 0 deletions
44
Source/WebKit/UIProcess/ios/forms/WKDatePickerPopoverController.h
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,44 @@ | ||
| /* | ||
| * Copyright (C) 2023 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 met: | ||
| * 1. Redistributions of source code must retain the above copyright | ||
| * notice, this list of conditions and the following disclaimer. | ||
| * 2. Redistributions in binary form must reproduce the above copyright | ||
| * notice, this list of conditions and the following disclaimer in the | ||
| * documentation and/or other materials provided with the distribution. | ||
| * | ||
| * THIS SOFTWARE IS PROVIDED BY APPLE INC. AND ITS CONTRIBUTORS ``AS IS'' | ||
| * AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, | ||
| * THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR | ||
| * PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL APPLE INC. OR ITS CONTRIBUTORS | ||
| * BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR | ||
| * CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF | ||
| * SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS | ||
| * INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN | ||
| * CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) | ||
| * ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF | ||
| * THE POSSIBILITY OF SUCH DAMAGE. | ||
| */ | ||
|
|
||
| #pragma once | ||
|
|
||
| #if PLATFORM(IOS_FAMILY) | ||
|
|
||
| #import <UIKit/UIKit.h> | ||
|
|
||
| @class WKDatePickerPopoverController; | ||
|
|
||
| @protocol WKDatePickerPopoverControllerDelegate <NSObject> | ||
| - (void)datePickerPopoverControllerDidDismiss:(WKDatePickerPopoverController *)controller; | ||
| - (void)datePickerPopoverControllerDidReset:(WKDatePickerPopoverController *)controller; | ||
| @end | ||
|
|
||
| @interface WKDatePickerPopoverController : UIViewController | ||
| - (instancetype)initWithDatePicker:(UIDatePicker *)datePicker delegate:(id<WKDatePickerPopoverControllerDelegate>)delegate; | ||
| - (void)presentInView:(UIView *)view sourceRect:(CGRect)rect interactionBounds:(CGRect)interactionBounds completion:(void(^)())completion; | ||
| @end | ||
|
|
||
| #endif // PLATFORM(IOS_FAMILY) |
221 changes: 221 additions & 0 deletions
221
Source/WebKit/UIProcess/ios/forms/WKDatePickerPopoverController.mm
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,221 @@ | ||
| /* | ||
| * Copyright (C) 2023 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 met: | ||
| * 1. Redistributions of source code must retain the above copyright | ||
| * notice, this list of conditions and the following disclaimer. | ||
| * 2. Redistributions in binary form must reproduce the above copyright | ||
| * notice, this list of conditions and the following disclaimer in the | ||
| * documentation and/or other materials provided with the distribution. | ||
| * | ||
| * THIS SOFTWARE IS PROVIDED BY APPLE INC. AND ITS CONTRIBUTORS ``AS IS'' | ||
| * AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, | ||
| * THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR | ||
| * PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL APPLE INC. OR ITS CONTRIBUTORS | ||
| * BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR | ||
| * CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF | ||
| * SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS | ||
| * INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN | ||
| * CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) | ||
| * ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF | ||
| * THE POSSIBILITY OF SUCH DAMAGE. | ||
| */ | ||
|
|
||
| #import "config.h" | ||
| #import "WKDatePickerPopoverController.h" | ||
|
|
||
| #if PLATFORM(IOS_FAMILY) | ||
|
|
||
| #import "UIKitSPI.h" | ||
| #import <WebCore/LocalizedStrings.h> | ||
| #import <wtf/BlockPtr.h> | ||
| #import <wtf/RetainPtr.h> | ||
| #import <wtf/text/WTFString.h> | ||
|
|
||
| @interface WKDatePickerPopoverView : UIView | ||
|
|
||
| @property (readonly, nonatomic) UIDatePicker *datePicker; | ||
| @property (readonly, nonatomic) UIToolbar *accessoryView; | ||
|
|
||
| @end | ||
|
|
||
| @implementation WKDatePickerPopoverView { | ||
| RetainPtr<UIVisualEffectView> _backgroundView; | ||
| __weak UIDatePicker *_datePicker; | ||
| RetainPtr<UIToolbar> _accessoryView; | ||
| } | ||
|
|
||
| - (instancetype)initWithDatePicker:(UIDatePicker *)datePicker | ||
| { | ||
| if (!(self = [super initWithFrame:CGRectZero])) | ||
| return nil; | ||
|
|
||
| _backgroundView = adoptNS([[UIVisualEffectView alloc] initWithEffect:[UIBlurEffect effectWithStyle:UIBlurEffectStyleSystemMaterial]]); | ||
| _datePicker = datePicker; | ||
| _accessoryView = adoptNS([UIToolbar new]); | ||
|
|
||
| [_backgroundView setTranslatesAutoresizingMaskIntoConstraints:NO]; | ||
| [self addSubview:_backgroundView.get()]; | ||
|
|
||
| static constexpr auto marginSize = 16; | ||
| _datePicker.translatesAutoresizingMaskIntoConstraints = NO; | ||
| _datePicker.layoutMargins = UIEdgeInsetsMake(marginSize, marginSize, marginSize, marginSize); | ||
| [[_backgroundView contentView] addSubview:_datePicker]; | ||
|
|
||
| [_accessoryView setTranslatesAutoresizingMaskIntoConstraints:NO]; | ||
| [_accessoryView setStandardAppearance:^{ | ||
| auto appearance = adoptNS([UIToolbarAppearance new]); | ||
| [appearance setBackgroundEffect:nil]; | ||
| return appearance.autorelease(); | ||
| }()]; | ||
| [_accessoryView sizeToFit]; | ||
| [[_backgroundView contentView] addSubview:_accessoryView.get()]; | ||
|
|
||
| CGFloat toolbarBottomMargin = _datePicker.datePickerMode == UIDatePickerModeDateAndTime ? 10 : 2; | ||
| [NSLayoutConstraint activateConstraints:@[ | ||
| [[_backgroundView leadingAnchor] constraintEqualToAnchor:self.leadingAnchor], | ||
| [[_backgroundView trailingAnchor] constraintEqualToAnchor:self.trailingAnchor], | ||
| [[_backgroundView topAnchor] constraintEqualToAnchor:self.topAnchor], | ||
| [[_backgroundView bottomAnchor] constraintEqualToAnchor:self.bottomAnchor], | ||
| [[_datePicker leadingAnchor] constraintEqualToAnchor:self.leadingAnchor], | ||
| [[_datePicker trailingAnchor] constraintEqualToAnchor:self.trailingAnchor], | ||
| [[_datePicker topAnchor] constraintEqualToAnchor:self.topAnchor], | ||
| [[_datePicker bottomAnchor] constraintEqualToSystemSpacingBelowAnchor:[_accessoryView topAnchor] multiplier:1], | ||
| [[_accessoryView leadingAnchor] constraintEqualToAnchor:self.leadingAnchor], | ||
| [[_accessoryView trailingAnchor] constraintEqualToAnchor:self.trailingAnchor], | ||
| [[_accessoryView bottomAnchor] constraintEqualToAnchor:self.bottomAnchor constant:-toolbarBottomMargin], | ||
| ]]; | ||
|
|
||
| return self; | ||
| } | ||
|
|
||
| - (UIDatePicker *)datePicker | ||
| { | ||
| return _datePicker; | ||
| } | ||
|
|
||
| - (UIToolbar *)accessoryView | ||
| { | ||
| return _accessoryView.get(); | ||
| } | ||
|
|
||
| @end | ||
|
|
||
| @interface WKDatePickerPopoverController () <UIPopoverPresentationControllerDelegate> | ||
|
|
||
| @end | ||
|
|
||
| @implementation WKDatePickerPopoverController { | ||
| RetainPtr<WKDatePickerPopoverView> _contentView; | ||
| __weak id<WKDatePickerPopoverControllerDelegate> _delegate; | ||
| } | ||
|
|
||
| - (instancetype)initWithDatePicker:(UIDatePicker *)datePicker delegate:(id<WKDatePickerPopoverControllerDelegate>)delegate | ||
| { | ||
| if (!(self = [super init])) | ||
| return nil; | ||
|
|
||
| _contentView = adoptNS([[WKDatePickerPopoverView alloc] initWithDatePicker:datePicker]); | ||
| _delegate = delegate; | ||
| self.modalPresentationStyle = UIModalPresentationPopover; | ||
| self.popoverPresentationController.delegate = self; | ||
| return self; | ||
| } | ||
|
|
||
| - (void)resetDatePicker | ||
| { | ||
| [_delegate datePickerPopoverControllerDidReset:self]; | ||
| } | ||
|
|
||
| - (void)dismissDatePicker | ||
| { | ||
| [self.presentingViewController dismissViewControllerAnimated:YES completion:[strongSelf = retainPtr(self)] { | ||
| #if PLATFORM(MACCATALYST) | ||
| [strongSelf->_delegate datePickerPopoverControllerDidDismiss:strongSelf.get()]; | ||
| #endif | ||
| }]; | ||
| } | ||
|
|
||
| - (void)viewDidLoad | ||
| { | ||
| [super viewDidLoad]; | ||
|
|
||
| auto resetButton = adoptNS([[UIBarButtonItem alloc] initWithTitle:WEB_UI_STRING_KEY("Reset", "Reset Button Date/Time Context Menu", "Reset button in date input context menu") style:UIBarButtonItemStylePlain target:self action:@selector(resetDatePicker)]); | ||
| auto doneButton = adoptNS([[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemDone target:self action:@selector(dismissDatePicker)]); | ||
|
|
||
| [_contentView setTranslatesAutoresizingMaskIntoConstraints:NO]; | ||
| [_contentView accessoryView].items = @[ resetButton.get(), UIBarButtonItem.flexibleSpaceItem, doneButton.get() ]; | ||
|
|
||
| [self.view addSubview:_contentView.get()]; | ||
|
|
||
| [NSLayoutConstraint activateConstraints:@[ | ||
| [[_contentView leadingAnchor] constraintEqualToAnchor:self.view.leadingAnchor], | ||
| [[_contentView trailingAnchor] constraintEqualToAnchor:self.view.trailingAnchor], | ||
| [[_contentView topAnchor] constraintEqualToAnchor:self.view.topAnchor], | ||
| [[_contentView bottomAnchor] constraintGreaterThanOrEqualToAnchor:self.view.layoutMarginsGuide.bottomAnchor] | ||
| ]]; | ||
|
|
||
| self.preferredContentSize = [_contentView systemLayoutSizeFittingSize:UILayoutFittingCompressedSize]; | ||
| } | ||
|
|
||
| - (void)presentInView:(UIView *)view sourceRect:(CGRect)rect interactionBounds:(CGRect)interactionBounds completion:(void(^)())completion | ||
| { | ||
| RetainPtr controller = [UIViewController _viewControllerForFullScreenPresentationFromView:view]; | ||
|
|
||
| while ([controller isBeingDismissed]) { | ||
| // When tabbing between date pickers, it's possible for the view controller for fullscreen presentation | ||
| // to be the previously focused input's popover. To ensure that we don't try to present our new | ||
| // `WKDatePickerPopoverController` out of the previous `WKDatePickerPopoverController`, march up the | ||
| // -presentingViewController chain until we find a view controller that isn't being dismissed. | ||
| controller = [controller presentingViewController]; | ||
| } | ||
|
|
||
| if (!controller) | ||
| return completion(); | ||
|
|
||
| // Specifying arrow directions is necessary here because UIKit will prefer to show the popover below the | ||
| // source rect and cover the source rect with the arrow, even if `-canOverlapSourceViewRect` is `NO`. | ||
| // To prevent the popover arrow from covering the element, we force UIKit to choose the direction that | ||
| // has the most available space, so won't cover the element with the popover arrow unless we really have | ||
| // no other choice. | ||
| auto presentationController = self.popoverPresentationController; | ||
| auto distanceFromTop = CGRectGetMinY(rect) - CGRectGetMinY(interactionBounds); | ||
| auto distanceFromLeft = CGRectGetMinX(rect) - CGRectGetMinX(interactionBounds); | ||
| auto distanceFromRight = CGRectGetMaxX(interactionBounds) - CGRectGetMaxX(rect); | ||
| auto distanceFromBottom = CGRectGetMaxY(interactionBounds) - CGRectGetMaxY(rect); | ||
| auto maxDistance = std::max<CGFloat>({ distanceFromTop, distanceFromLeft, distanceFromRight, distanceFromBottom }); | ||
| UIPopoverArrowDirection permittedDirections = 0; | ||
| if (distanceFromTop >= maxDistance) | ||
| permittedDirections |= UIPopoverArrowDirectionDown; | ||
| if (distanceFromLeft >= maxDistance) | ||
| permittedDirections |= UIPopoverArrowDirectionRight; | ||
| if (distanceFromRight >= maxDistance) | ||
| permittedDirections |= UIPopoverArrowDirectionLeft; | ||
| if (distanceFromBottom >= maxDistance) | ||
| permittedDirections |= UIPopoverArrowDirectionUp; | ||
| if (!permittedDirections) | ||
| permittedDirections = UIPopoverArrowDirectionAny; | ||
| presentationController.permittedArrowDirections = permittedDirections; | ||
| presentationController.sourceView = view; | ||
| presentationController.sourceRect = rect; | ||
| presentationController.canOverlapSourceViewRect = NO; | ||
| [controller presentViewController:self animated:YES completion:completion]; | ||
| } | ||
|
|
||
| #pragma mark - UIPopoverPresentationControllerDelegate | ||
|
|
||
| - (UIModalPresentationStyle)adaptivePresentationStyleForPresentationController:(UIPresentationController *)controller traitCollection:(UITraitCollection *)traitCollection | ||
| { | ||
| return UIModalPresentationNone; | ||
| } | ||
|
|
||
| - (void)presentationControllerDidDismiss:(UIPresentationController *)presentationController | ||
| { | ||
| [_delegate datePickerPopoverControllerDidDismiss:self]; | ||
| } | ||
|
|
||
| @end | ||
|
|
||
| #endif // PLATFORM(IOS_FAMILY) |
Oops, something went wrong.