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

Respect safe area for "Reply to post" section on the Comments screen #22628

Merged
merged 4 commits into from
Feb 21, 2024

Conversation

justtwago
Copy link
Contributor

@justtwago justtwago commented Feb 16, 2024

Fixes #22603

This PR fixes missing padding for the reply section on the Comments screen that ignored the safe area and was overlayed by the Home indicator.

RPReplay_Final1708452812.MP4

To test:

  • Go to Reader -> Comments
  • Make sure the Reply section respects the bottom safe area
  • Tap on it to reveal the keyboard
  • Make sure that the Reply section is visible above the keyboard

Regression Notes

  1. Potential unintended areas of impact
    Comments screen.

  2. What I did to test those areas of impact (or what existing automated tests I relied on)
    Manual testing, UI tests.

  3. What automated tests I added (or what prevented me from doing so)
    Automated tests already exist.

PR submission checklist:

  • I have completed the Regression Notes.
  • I have considered adding unit tests for my changes.
  • I have considered adding accessibility improvements for my changes.
  • I have considered if this change warrants user-facing release notes and have added them to RELEASE-NOTES.txt if necessary.

Testing checklist:

  • WordPress.com sites and self-hosted Jetpack sites.
  • Portrait and landscape orientations.
  • Light and dark modes.
  • Fonts: Larger, smaller and bold text.
  • High contrast.
  • VoiceOver.
  • Languages with large words or with letters/accents not frequently used in English.
  • Right-to-left languages. (Even if translation isn’t complete, formatting should still respect the right-to-left layout)
  • iPhone and iPad.
  • Multi-tasking: Split view and Slide over. (iPad)

@dangermattic
Copy link
Collaborator

dangermattic commented Feb 16, 2024

1 Warning
⚠️ PR is not assigned to a milestone.

Generated by 🚫 Danger

@wpmobilebot
Copy link
Contributor

wpmobilebot commented Feb 16, 2024

Jetpack Alpha📲 You can test the changes from this Pull Request in Jetpack Alpha by scanning the QR code below to install the corresponding build.
App NameJetpack Alpha Jetpack Alpha
ConfigurationRelease-Alpha
Build Numberpr22628-d5e6dde
Version24.3
Bundle IDcom.jetpack.alpha
Commitd5e6dde
App Center Buildjetpack-installable-builds #7931
Automatticians: You can use our internal self-serve MC tool to give yourself access to App Center if needed.

@wpmobilebot
Copy link
Contributor

wpmobilebot commented Feb 16, 2024

WordPress Alpha📲 You can test the changes from this Pull Request in WordPress Alpha by scanning the QR code below to install the corresponding build.
App NameWordPress Alpha WordPress Alpha
ConfigurationRelease-Alpha
Build Numberpr22628-d5e6dde
Version24.3
Bundle IDorg.wordpress.alpha
Commitd5e6dde
App Center BuildWPiOS - One-Offs #8901
Automatticians: You can use our internal self-serve MC tool to give yourself access to App Center if needed.

@justtwago justtwago force-pushed the fix/22603-comments-reply-safe-area-respect branch from c8a3344 to ffa6e33 Compare February 20, 2024 18:12
@justtwago justtwago marked this pull request as ready for review February 20, 2024 18:18
attribute:NSLayoutAttributeBottom
multiplier:1.0
constant:0.0];
self.replyTextViewBottomConstraint.priority = UILayoutPriorityDefaultHigh;
Copy link
Contributor

Choose a reason for hiding this comment

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

[Nit] I think the property replyTextViewBottomConstraint is no longer needed, maybe it should be removed?

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Good catch! Thank you!

Copy link
Contributor

@salimbraksa salimbraksa left a comment

Choose a reason for hiding this comment

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

Left one minor comment. LGTM! 🚀

@@ -364,7 +363,7 @@ - (void)configureKeyboardManager
self.keyboardManager = [[KeyboardDismissHelper alloc] initWithParentView:self.view
scrollView:self.tableView
dismissableControl:self.replyTextView
bottomLayoutConstraint:self.replyTextViewBottomConstraint];
bottomLayoutConstraint:self.keyboardManager.bottomLayoutConstraint];
Copy link
Contributor

@salimbraksa salimbraksa Feb 21, 2024

Choose a reason for hiding this comment

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

⚠️ I didn't know about this KeyboardDismissHelper earlier, but it does seem this type requires a bottomLayoutConstraint. But we cannot pass its own self.keyboardManager.bottomLayoutConstraint in the initializer. This can cause crashes and unexpected behavior at runtime:

  • The property KeyboardDismissHelper.bottomLayoutConstraint is expecting a non-optional value.
  • self.keyboardManager.bottomLayoutConstraint is not initialized yet, and code like this is not possible in Swift. So although this is allowed in Objective-C, weird behavior can occur at Runtime.

I suggest to bring back the self.replyTextViewBottomConstraint property and set it to:

self.replyTextViewBottomConstraint = [self.view.keyboardLayoutGuide.topAnchor constraintEqualToAnchor:self.replyTextView.bottomAnchor];

Then activate it alongside other constraints

[NSLayoutConstraint activateConstraints:@[
  [self.replyTextView.leadingAnchor constraintEqualToAnchor:self.replyTextView.leadingAnchor],
  [self.replyTextView.trailingAnchor constraintEqualToAnchor:self.replyTextView.trailingAnchor],
  self.replyTextViewBottomConstraint
]];

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Makes sense! 💯 Tested this approach and it works slightly incorrectly because we reuse the same constraint in a few places.
image

Instead of that I reverted the replyTextViewBottomConstraint for the keyboard manager only.

@justtwago justtwago merged commit 730306f into trunk Feb 21, 2024
21 checks passed
@justtwago justtwago deleted the fix/22603-comments-reply-safe-area-respect branch February 21, 2024 17:42
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Missing safe area padding for "Reply to post" section on the Comments screen
4 participants