Summary:
Remove `defaultProps` from `Picker` of components, replace it with destructuring assignment.
## Changelog
<!-- Help reviewers and the release process by writing your own changelog entry. For an example, see:
https://github.com/facebook/react-native/wiki/Changelog
-->
[JavaScript] [Changed] - Remove defaultProps from picker
close https://github.com/facebook/react-native/issues/31603
Pull Request resolved: https://github.com/facebook/react-native/pull/31644
Test Plan: all test suite and CI passes.
Reviewed By: TheSavior
Differential Revision: D28886320
Pulled By: lunaleaps
fbshipit-source-id: d88a922dffeebe2bce019250d460b5e43a0af562
Summary:
This fixes how ES modules are handled in Jest tests in the react-native codebase.
They caused some problems before because `import` statements weren't inlined as `require` calls were, so there were some errors in tests when migrating from CommonJS to ESM.
This changes the transform that Jest uses to inline import statements the same way, so we can migrate everything without issues in tests.
Changelog: [Internal]
Reviewed By: kacieb
Differential Revision: D28899692
fbshipit-source-id: 027690f57ca3b5613c261a1089c0635af76662b2
Summary:
Since moving Switch to a function component it is no longer possible to get the native switch ref. This adds forwardRef so it is possible again.
## Changelog
[General] [Fixed] - Fix Switch ref forwarding
Pull Request resolved: https://github.com/facebook/react-native/pull/31629
Test Plan: Tested the change in an app using react-native-gesture-handler, which tries to set a ref on Switch. Also made sure flow still passes.
Reviewed By: TheSavior
Differential Revision: D28839605
Pulled By: lunaleaps
fbshipit-source-id: 1fee86145caeabb60c0010bb9062dddca419f7ca
Summary:
This pre-suppresses the 153 error diff ahead of its release, since it is large.
Changelog: [Internal]
Reviewed By: mroch
Differential Revision: D28754374
fbshipit-source-id: 1806f53bc7d804644d434583a2dcd6da63d00328
Summary:
Accessibility service does not announce "selected" on accessibilityState = {selected: true} of the Button Component.
Issue link - https://github.com/facebook/react-native/issues/30956
## Changelog
<!-- Help reviewers and the release process by writing your own changelog entry. For an example, see:
https://github.com/facebook/react-native/wiki/Changelog
-->
[General] [Added] - Add accessibilityState prop to Slider component
Pull Request resolved: https://github.com/facebook/react-native/pull/31145
Test Plan:
Verified accessibility states are read by voiceover and talkback. Some state values aren't handled by iOS and have been identified.
Added snapshot tests to test accessibilityState.disabled = disabled values
`js1 test Slider-test`
Reviewed By: yungsters
Differential Revision: D28337723
Pulled By: lunaleaps
fbshipit-source-id: 72a54d8d9dcf1fafb9785c81da99f32a21f3df00
Summary:
Changelog:
[General][Changed] Refactor ScrollViewStickyHeader to a functional component to remove unsafe lifecycles and mutations during render
Reviewed By: lunaleaps
Differential Revision: D28203776
fbshipit-source-id: 615c8e1cd9e9e26d25c7d02aee7e4a0bfc8ec6c3
Summary:
Changelog:
[General][Added] Add support for "togglebutton" accessibilityRole
# Context
The role for ToggleButton, which is needed on Android to implement toggle buttons correctly, is not currently supported.
# What does this diff do?
Adds support for accessibilityRole `"togglebutton"`.
On Android, this maps to class `"Android.widget.ToggleButton"`.
iOS does not have an equivalent trait for togglebutton, so I set it to be the same as setting `accessibilityRole="button"` for iOS.
# Caveats - checked vs selected
It seems to me like this role currently requires that you set `accessibilityState={{checked: true/false}}`. The behavior is strange when setting `selected` state, I think because on Android ToggleButtons are meant to use `checked` to indicate toggled on/off.
This is tricky because typically on iOS if you have a toggle button, you would use `selected` instead of `checked`, so RN users are likely to mess this up.
Possible solutions:
1. document that you should use `checked` state on Android for toggle buttons (and maybe throw a warning if someone passes in `selected`).
2. have RN ignore it if someone passes in accessibilityState `selected`, if this role is used.
3. Have RN convert passed in `selected` state to `checked` on the Android side.
Reviewed By: nadiia
Differential Revision: D27976046
fbshipit-source-id: 4ce202449cf2371f4bf83c4db2d53120369ee7b0
Summary:
This diff migrates RCTMultilineTextInputNativeComponent to use NativeComponentRegistry instead of requireNativeComponent. The intention is to unify the way the component is registered and enable StaticViewConfigs for this component
changelog: [internal] internal
Reviewed By: JoshuaGross
Differential Revision: D28116333
fbshipit-source-id: b245026ebcd564380d0c74bbd6d9a36c661a8e71
Summary:
This diff migrates RCTSingelineTextInputNativeComponent to use NativeComponentRegistry instead of requireNativeComponent. The intention is to unify the way the component is registered and enable StaticViewConfigs for this component
changelog: [internal] internal
Reviewed By: JoshuaGross
Differential Revision: D28116332
fbshipit-source-id: d0a1a512a1cd967608512423db3dffa7c68fd2c5
Summary:
Changelog:
[General][Changed] Convert require statements to use import from in Libraries/Components
Reviewed By: lunaleaps
Differential Revision: D27921557
fbshipit-source-id: 3f1618455a47a56c4a090f3ececfef88476c0b8a
Summary:
Sets up an experiment that enables `collapsable` in Fabric for iOS. This will enable us to validate with production data that enabling the use of this prop does not cause unexpected regressions.
Changelog:
[internal]
Reviewed By: mdvacca
Differential Revision: D27987619
fbshipit-source-id: 9b1c0ff45bed09b1e72ad7d9c782f07bb4211cc6
Summary:
Adding support for DatePickerStyles on iOS13.4+
Changelog:
[iOS][Added] - Expose UIDatePickerStyles as a prop for DatePickerIOS
Reviewed By: PeteTheHeat
Differential Revision: D27953279
fbshipit-source-id: a35adf245147467ecbacac3770b9c50836cea468
Summary:
Adding support for DatePickerStyles on iOS13.4+
Changelog:
[iOS][Added] - Expose UIDatePickerStyles as a prop for DatePickerIOS
Reviewed By: PeteTheHeat
Differential Revision: D27948608
fbshipit-source-id: fcc16c630148818d9db0c9eef8363f8592b13791
Summary:
Disable `accessibilityState` when the `TouchableWithoutFeedback` is `disabled`. This fixes https://github.com/facebook/react-native/issues/30953
## Changelog
[General] [Changed] - Disable `accessibilityState` when the `TouchableWithoutFeedback` is `disabled`.
Pull Request resolved: https://github.com/facebook/react-native/pull/31297
Test Plan: Tested the `TouchableWithoutFeedback` component on an Android device
Reviewed By: nadiia
Differential Revision: D27770689
Pulled By: kacieb
fbshipit-source-id: a317246021354ed288b093f8a5e6fbba43d3a04e
Summary:
This is a small cleanup to move initialization out of the `constructor` as it is unnecessary, and it is currently double initializing a few values.
Changelog:
[General][Changed] Clean up the initialization of instance variables in ScrollView
Reviewed By: nadiia
Differential Revision: D27631320
fbshipit-source-id: 762277e4993a9ce86d444ff2d9e845c93e94d1a8
Summary:
Changelog: [internal]
For React Native classic the behaviour is identical.
# Problem
`ScrollView.scrollResponderScrollNativeHandleToKeyboard` is broken in new React Native renderer. The behaviour depends on race between two events, `measureLayout` and `keyboardWillShow` event. In the new renderer, `measureLayout` always wins because it is a synchronous call, unlike in React Native classic.
To fix this we can just delay execution by wrapping it in `setTimeout`, which puts it on the back of the queue.
Reviewed By: JoshuaGross
Differential Revision: D27705883
fbshipit-source-id: 7556f86978ca3ccd2fddf1eef2435af26b54f585
Summary:
Changelog:
[Internal] - Update Switch to allow injected implementations
## General understanding of the component
The main flow of Switch is pretty straightforward, basically passing the props to the respective native component which uses the platform switch views on Android / iOS
The interesting parts of Switch is the fact that it's a controlled component -- meaning that this component sees the JS value prop as the source of truth about the state of this component and any time the native value of the switch is out of sync with the JS value prop, we send a command `setNativeValue` to keep those in sync.
The problems I ran into:
* Keeping native and JS in sync
* Switch skips animation occassionally on iOS simulator
## How we keep native and JS in sync
By construction, the native value of the component should be the same as JS value. Then, we know the native value has changed whenever the callback `handleChange` has been fired.
**Before**
In the handleChange callback, we'd set an [instance variable `lastNativeValue` with the updated value](https://fburl.com/diffusion/nangxzoh) and force update. Then, in `componentDidUpdate`, we'd send the native commands if we determine that `lastNativeValue` and the `value` prop were out of sync.
**After**
For our modern implementation, we store the value of the switch as reported by `handleChange` and check it against the `props.value` of the switch. If they are out of sync then we will update the native switch via the switch command.
**Why is `native` an object?**
We need to run the `useLayoutEffect` every time `handleChange` is called independent of the value of the switch.
**Why not move the logic of dispatching commands to `handleChange`?**?
This would change behavior from old implementation where we would call `onChange` handlers and then re-render. Additionally, the logic to run the native commands were on `componentDidUpdate` which would've run when any prop changed. We can simplify this down to caring only when `props.value` updates.
## Unsolved, existing issue: Switches skip animation occasionally
* This occurs both in the modern and old versions of Switch and I've only seen this on iOS simulators. It occurs most frequently in the "events" example where two switches' values are synced and most often the first transition after we navigate to the example surface. I have not been able to reproduce this behavior on device.
* Something must be triggering a re-render in the middle of native's animation..
{F564595576}
Reviewed By: nadiia, kacieb
Differential Revision: D27381306
fbshipit-source-id: 06d13c6fe1ff181443f4b8dd27fb1ac65e071962
Summary:
Unifies the platform-specific implementations of `AccessibilityInfo` to simplifying checking Flow types and making changes to the module.
Changelog:
[Internal]
Reviewed By: mdvacca
Differential Revision: D27578847
fbshipit-source-id: 84dc274a66acd22fc6f1dd2773a4e4630761e17d
Summary:
Removes `AccessibilityInfo.fetch` which had already been deprecated for a while by https://github.com/facebook/react-native/commit/0090ab32c2aeffed76ff58931930fe40a45e6ebc.
Changelog:
[General][Removed] - Removed `AccessibilityInfo.fetch`, use `isScreenReaderEnabled` instead.
Reviewed By: kacieb
Differential Revision: D27576528
fbshipit-source-id: f5df3445b4cc3bcb4ce6873c6845748109bc393d
Summary:
Refactors `AccessibilityInfo` so that it does not reimplement the event listener logic that is already implemented in `EventEmitter` (which backs the implementation of `RCTDeviceEventEmitter`).
This also means that calling `AccessibilityInfo.removeEventListener` will correctly display a deprecation error, due to `EventEmitter.removeListener` being deprecated. In a future release, both of these methods will be removed.
Changelog:
[General][Deprecated] - Deprecate `AccessibilityInfo.removeEventListener`.
Reviewed By: kacieb
Differential Revision: D27574340
fbshipit-source-id: 98c71d9c1470018df0f1526cc2f349aac842e786
Summary:
This PR aims to add test's for button.
Snapshot test for PR https://github.com/facebook/react-native/issues/31001 . This would make sure `accessibilityState` is properly set.
## Changelog
<!-- Help reviewers and the release process by writing your own changelog entry. For an example, see:
https://github.com/facebook/react-native/wiki/Changelog
-->
[General] [Added] - Test's for button
Pull Request resolved: https://github.com/facebook/react-native/pull/31189
Test Plan:
`npm test` to run the test's.
Since the disabled prop of button has precedence over `accessibilityState.disabled` the test's will make sure it remains this way.
Reviewed By: kacieb
Differential Revision: D27473082
Pulled By: lunaleaps
fbshipit-source-id: 65d82620e8c245c2a8e29c3e9a8252d3a4275b09
Summary:
Since TouchableHighlight and TouchableOpacity are being exported using `forwardRef`, it's messing up jest's snapshots and some matchers.
This commit 4b935ae95f fixed this for components being mocked on [setup.js](https://github.com/facebook/react-native/blob/master/jest/setup.js). However, these Touchables aren't being mocked.
It resolves https://github.com/facebook/react-native/issues/27721
## Changelog
[General] [Added] - Add displayName to TouchableHighlight and TouchableOpacity
Pull Request resolved: https://github.com/facebook/react-native/pull/29531
Test Plan: Check the new snapshots.
Reviewed By: kacieb
Differential Revision: D27485269
Pulled By: yungsters
fbshipit-source-id: ba2082a4ae9f97ebe93ba92971d58c9195bdf26d
Summary:
It looks like `ScrollView` still contains the remnant props for VR platform, which afaik has be discontinued a while ago (please correct me, if I'm wrong).
This PR removes `scrollBarThumbImage` prop marked as VR platform only prop from `ScrollView`.
## Changelog
<!-- Help reviewers and the release process by writing your own changelog entry. For an example, see:
https://github.com/facebook/react-native/wiki/Changelog
-->
[VR] [Removed] - remove VR platform specific `scrollBarThumbImage` prop from `ScrollView`
Pull Request resolved: https://github.com/facebook/react-native/pull/31230
Test Plan: CI
Reviewed By: javache
Differential Revision: D27367267
Pulled By: PeteTheHeat
fbshipit-source-id: b76fdb0e03c443aaf87308162bf75f8683220918
Summary:
When there are multiple sticky headers, ScrollViewStickyHeader should push up the header above it when it gets to the top.
This behavior was accidentally changed in D21948830 (https://github.com/facebook/react-native/commit/fa5d3fb6b8c561b749f3e86316d06543a52dcc1c) when this component was fixed to work in Fabric.
This diff added a new variable `_shouldRecreateTranslateY`, which determines whether the `translateY` value should be recreated on render. `_shouldRecreateTranslateY` was not being set to true during `setNextHeaderY`, so the next header's Y value was never accounted for at render.
Changelog:
[General][Fixed] Fix ScrollViewStickyHeader to push up header above it
Reviewed By: lunaleaps
Differential Revision: D27277829
fbshipit-source-id: 83c9aacd454be178649bf8d060d1a5c750f4060f
Summary:
Flow is changing the behavior of object types to no longer be valid supertypes of classes. This replaces object types when they appear as supertypes of classes to be interfaces to avoid errors when this change rolls out.
Changelog: [Internal]
Reviewed By: pieterv
Differential Revision: D27193522
fbshipit-source-id: c3e3fca8a4cacd90770a95b773ff2c659774b9a6
Summary:
https://github.com/facebook/react-native/issues/30950
automatically set `disabled` to accessibilityState when TouchableHighlight is disabled
## Changelog
<!-- Help reviewers and the release process by writing your own changelog entry. For an example, see:
https://github.com/facebook/react-native/wiki/Changelog
-->
[General] [Changed] - Set disabled accessibilityState when TouchableHighlight is disabled
Pull Request resolved: https://github.com/facebook/react-native/pull/31135
Test Plan: Tested on physical android device that pressing disabled TouchableHighlight announces "dim" when talkback is on
Reviewed By: yungsters, nadiia
Differential Revision: D27157207
Pulled By: kacieb
fbshipit-source-id: b8e24aad699c43cf02401b3ba39726a06b751995
Summary:
Issue # https://github.com/facebook/react-native/issues/30934 .When using a screen reader disabled buttons do not announce that they are disabled.
## Changelog
[Android] [Changed] - Passing accessibility state in button so it can announce disabled in talkback
Pull Request resolved: https://github.com/facebook/react-native/pull/31001
Test Plan:
I have added Button in Button Example with accessibiltyState prop that will announce button is disabled when testing with talkback.
## Ios test
I am unable to run ios project on my machine. RNTesterPods.xcworkspace gives workspace integrity error :/
Reviewed By: kacieb
Differential Revision: D26492483
Pulled By: lunaleaps
fbshipit-source-id: c4bbe8ca896b0d303976591c300ccac67a96ac73