Skip to content

Conversation

staskus
Copy link
Contributor

@staskus staskus commented Sep 11, 2025

Ignoring a safe area at the root of the POS modal removes the safe area for the whole POS

Description

As a regression after #16104, POS headers and the floating button appeared too close to the edges due to the removal of the safe area at the root of the POS modal code.

For now, I just removed this ignore, which will make the modal window only expand up until the top and bottom safe areas. I spent some time trying to find the solution, but it looks like just setting .cornerRadius is enough to trigger safe area. Putting cornerRadius on the background worked on card-present payment modals, but broke other modals in the process.

Here are various fixes that I tried if interested:

modal.attempts.mov

Steps to reproduce

The payment modals should behave as in #16104, but don't grow past the top and bottom of safe area.

Payment modals:

  1. Open POS on an iPad 26.0 device or simulator
  2. Start card reader connection
  3. Change window sizes
  4. Confirm the modal view adapts to different view widths and heights, and can be scrolled when needed

Regression:

  1. Try opening barcode scanning or product restriction modals and confirm they continue to work

Testing information

  • Tested on iPad Air 26 simulator
  • Added previews to facilitate development and testing

Screenshots

Simulator.Screen.Recording.-.iPad.Air.13-inch.M3.-.2025-09-11.at.20.09.10.mov

  • I have considered if this change warrants user-facing release notes and have added them to RELEASE-NOTES.txt if necessary.

Ignoring a safe area at the root of POS modal removes safe area for the whole POS
@staskus staskus added this to the 23.3 milestone Sep 11, 2025
@wpmobilebot
Copy link
Collaborator

App Icon📲 You can test the changes from this Pull Request in WooCommerce iOS Prototype by scanning the QR code below to install the corresponding build.

App NameWooCommerce iOS Prototype
Build Numberpr16121-313c367
Version23.2
Bundle IDcom.automattic.alpha.woocommerce
Commit313c367
Installation URL28chvve06844o
Automatticians: You can use our internal self-serve MC tool to give yourself access to those builds if needed.

@jaclync jaclync self-assigned this Sep 12, 2025
@jaclync
Copy link
Contributor

jaclync commented Sep 12, 2025

Hi @staskus, could you share the testing steps? Like if the focus is on iOS 26 window resizing as in the screencast, and what to look out for. Is this fix for the regression you mentioned in p1757590716100649-slack-C070SJRA8DP?

Unassigning myself for now as I'm running a bit short on time today, but will pick it up if I get some time later.

@jaclync jaclync removed their assignment Sep 12, 2025
@staskus
Copy link
Contributor Author

staskus commented Sep 12, 2025

@jaclync sorry for not including that, updated! It's no rush, it can be reviewed next week to get into 23.3

@joshheald joshheald self-assigned this Sep 15, 2025
Copy link
Contributor

@joshheald joshheald left a comment

Choose a reason for hiding this comment

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

Thanks for fixing this.

@staskus staskus merged commit 36740d1 into trunk Sep 15, 2025
24 of 26 checks passed
@staskus staskus deleted the fix/ignore-safe-area branch September 15, 2025 12:05
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.

4 participants