Fix overflow:'hidden' github issue #399 (attempt 2)#457
Fix overflow:'hidden' github issue #399 (attempt 2)#457tom-un merged 3 commits intomicrosoft:masterfrom
Conversation
|
See #419 for more context on approach. |
|
Looks like the test is still flaky:
|
React/Views/RCTView.m
Outdated
| #if TARGET_OS_OSX // [TODO(macOS ISS#2323203) | ||
| // clipsToBounds is stubbed out on macOS because it's not part of NSView | ||
| self.layer.masksToBounds = self.clipsToBounds; | ||
| #endif // [TODO(macOS ISS#2323203) |
There was a problem hiding this comment.
nit: // [TODO(macOS ISS#2323203)
There was a problem hiding this comment.
I'm not sure what the nit is - can you add a code "suggestion"?
There was a problem hiding this comment.
Sorry, I meant please change the comment to // ]TODO(macOS ISS#2323203 (left bracket instead of right)
|
Isn't this relying on the exact same undefined behavior as #419 was?
https://developer.apple.com/library/archive/releasenotes/AppKit/RN-AppKit/#10_13Layer-backed%20Views It seems to me we're still modifying the |
|
The concern is that we would then be explicitly relying on undefined behavior that has been explicitly called out as undefined for years. Since we at this moment can't find a supported way to achieve the behavior we want, if Apple changes that undefined behavior as they are totally justified in doing, we have no workarounds or ideas. We would have just broken clients with no way to fix them if and when Apple changes this undefined behavior. That's why I don't think taking this change is the right approach |
This approach is practically different in two major ways. First, it modifies the layer provided by |
The code in this review does seem to explicitly call
I had not been aware of these other spots in the project where we're explicitly relying on undefined behavior, but those are definitely of concern. I'm concerned this debt will continue to be pushed off until the day Apple releases an OS version that changes this undefined behavior, at which point we will be unable to support existing behaviors on new OSs, breaking existing clients and apps. |
lol, that's a typo! Let me fix that... |
But how is that different? It's still the same layer that Apple has documented that we shouldn't mess with, whether we're grabbing it from our ivar or using it from the layer drawing callback? Or is it a different layer and I'm missing the subtlety? |
I debugged it and the As @sahrens has pointed out, there are several places in react-native-macos where we are modifying a layer backed view. The current implementation relies on several layer prop changes for several features: z-order, rotation, shadows, and clipping. All of these features are critical for react-native platform parity. I propose that I open a new issue to track a larger refactoring of all these undefined behavior layer changes and annotate the points where we violate it, including this new contribution. I opened this issue: #466 . |
Please select one of the following
Summary
Fixes
overflow:'hidden'#399 by settinglayer.masksToBounds = self.clipsToBounds;in thedisplayLayer:methodoverflow: 'hidden'doesn't work in macOS, but it does work in iOS and Android (not sure about Windows). This change brings functional parity with minimal complexity/conflict.This also fixes borderRadius on
<Image>which broke recently because the implementation ofRCTImagechanges from subclass to composition with the image view being a subview and thus now relies on functional clipping behavior.Note we don't mutate
self.layer.masksToBoundsinsidesetClipsToBoundsbecause modifyingself.layeris undefined behavior on macOS and we have seen issues (e.g. with transforms) where the backing layer gets replaced by the system and mutations are not transferred over.Changelog
[MacOS] [Fixed] - Fix
overflow:'hidden'#399Test Plan
Microsoft Reviewers: Open in CodeFlow
Microsoft Reviewers: Open in CodeFlow