Summary:
This makes JSTimers actively register a callback for callImmediates.
Besides being generally tricky, circular dependency prevent compiling React Native code with bundlers that rely on concatenating module sources rather that evaluating code at the time of requiring, like Google Closure Compiler.
Sadly, Google Closure Compiler setup that prompted this change is complicated and brittle. And there are no good public tools to find circular dependencies among Haste-style modules (with unqualified require paths).
So some advice on a good test plan would be useful. Does Facebook have any tools to find circular dependencies with Haste-style requires?
FWIW, a check that worked for me was to replace all import paths in React Native from Haste style to normal relative paths (which I needed anyway) and then run [`madge`](https://www.npmjs.com/package/madge) on the code base:
```
$ ~/node_modules/.bin/madge --circular react-native/Libraries
Processed 390 files (7.4s) (81 warnings)
✖ Found 2 circular dependencies!
1) BatchedBridge/NativeModules.js > BatchedBridge/BatchedBridge.js > BatchedBridge/MessageQueue.js > Core/Timers/JSTimers.js
2) StyleSheet/flattenStyle.js > StyleSheet/StyleSheet.js
```
(The second cycle is already eliminated in a8e3c7f578).
[GENERAL] [MINOR] [MessageQueue] - MessageQueue implementation doesn't have a circular dependency on JSTimers.
Closes https://github.com/facebook/react-native/pull/19526
Reviewed By: hramos
Differential Revision: D8458755
Pulled By: yungsters
fbshipit-source-id: e753139b920ba1ad1a6db10f974c03ca195340c7
Summary:
Follow up to #18470, which has not yet landed in a release so we may want to hold off merging this until it has so that people receive the deprecation warning.
***
This PR removes the previously deprecated behavior of touchableHandleActivePressIn/Out (as well as onPressIn/Out being called on TV platforms for focus/blur. Instead, users should utilize the new `onFocus` and `onBlur` for these events.
This was because on TV platforms onPressIn/Out was overloaded to trigger for not only presses but these focus events as well. The normal behavior of true presses will still defer to touchableHandleActivePressIn/Out (which defers to onPressIn/Out).
<!--
Required.
Help reviewers and the release process by writing your own release notes. See below for an example.
-->
[TV] [BREAKING] [Touchable] - On TV platforms `onPressIn` and `onPressOut` on Touchables will now only be triggered for press events, not for focus/blur. Instead, you can use `onFocus` and `onBlur`.
<!--
**INTERNAL and MINOR tagged notes will not be included in the next version's final release notes.**
CATEGORY
[----------] TYPE
[ CLI ] [-------------] LOCATION
[ DOCS ] [ BREAKING ] [-------------]
[ GENERAL ] [ BUGFIX ] [ {Component} ]
[ INTERNAL ] [ ENHANCEMENT ] [ {Filename} ]
[ IOS ] [ FEATURE ] [ {Directory} ] |-----------|
[ ANDROID ] [ MINOR ] [ {Framework} ] - | {Message} |
[----------] [-------------] [-------------] |-----------|
EXAMPLES:
[IOS] [BREAKING] [FlatList] - Change a thing that breaks other things
[ANDROID] [BUGFIX] [TextInput] - Did a thing to TextInput
[CLI] [FEATURE] [local-cli/info/info.js] - CLI easier to do things with
[DOCS] [BUGFIX] [GettingStarted.md] - Accidentally a thing/word
[GENERAL] [ENHANCEMENT] [Yoga] - Added new yoga thing/position
[INTERNAL] [FEATURE] [./scripts] - Added thing to script that nobody will see
-->
Cc/ matthargett
Closes https://github.com/facebook/react-native/pull/19718
Differential Revision: D8450514
Pulled By: hramos
fbshipit-source-id: 818e85a338a451834b54d8965602699fc9b24e87
Summary:
Potential fixes for 18890. The issue was that when the setAttributedText method in RCTBaseTextInputView.m is called it does two main things:
Check that the attributed text that it receives is equal to the existing attributed text in the underlying backed up view ( backedTextInputView)
If not set the attributed text of the backed up view to the value passed into the method. This kills the dictation as it is effectively the equivalent of typing in the backed up text view.
self.backedTextInputView.attributedText = attributedText;
is the problem. It kills the dictation. It may have other effects as well.
In all cases I have seen the underlying text of the attributed string that is passed in the same as the text in the backedTextInputView, what was said to the dictation; however the attributes are different, which causes the isEqualToAttributedString: check to fail and thus the update happens, and the keyboard is killed.
Fix is to test for the underlying string equality not the attributed string equality when the input mode is dictation.
By necessity this had to be an integration test on an existing application. To test I enabled the keyboard and started the dictation. It worked with this fixes and not without. Will upload videos later.
This might break attributes on dictation, as it is happening. However anything set on the existing underlying text view should hold.
[IOS] [BUG] [Textinput] fixed an issue where the keyboard dictation ended abruptly.
Closes https://github.com/facebook/react-native/pull/19687
Differential Revision: D8450590
Pulled By: hramos
fbshipit-source-id: f97084131f98e9e0ed1f32111afc0f9f510f3b3b
Summary:
The bug #18374 was caused by the loose condition to execute `stringByReplacingCharactersInRange` in the method `textInputShouldChangeTextInRange` . As a result, `findMismatch` wrongly returning `true` which ends up the Backspace event being fired in another `textInputShouldChangeTextInRange` call in `textInputDidChange`.
<!--
Required: Write your motivation here.
If this PR fixes an issue, type "Fixes #issueNumber" to automatically close the issue when the PR is merged.
-->
1. Pass all the tests by `yarn run test`
2. Run the following code and type any text. (This code is brought from #18374. Thank you michalpetrov!!) And then verify that 'Backspace' events are not emitted after clearing text
and entering any letters.
```javascript
type Props = {};
type State = {
text: string,
keys: string
};
export default class App extends Component<Props, State> {
state = {text: '', keys: ''}
render() {
return (
<View style={styles.container}>
<TextInput style={styles.textInput} value={this.state.text} onChangeText={this.onChangeText} onKeyPress={this.onKeyPress}/>
<Button title="Clear" onPress={this.onClear}/>
<Text>Text: {this.state.text}</Text>
<Text>Keys: {this.state.keys}</Text>
</View>
);
}
onChangeText = (text: string) => {
this.setState({text})
}
onKeyPress = ({ nativeEvent }: Object) => {
this.setState({keys: this.state.keys + nativeEvent.key + ', '})
}
onClear = () => {
this.setState({text: '', keys: ''})
}
}
```
<!--
Does this PR require a documentation change?
Create a PR at https://github.com/facebook/react-native-website and add a link to it here.
-->
<!--
Required.
Help reviewers and the release process by writing your own release notes. See below for an example.
-->
[IOS] [BUGFIX] [TextInput] - Fixed the bug where Backspace event was emitted when entering a character after clearing a text in TextInput by an empty string
<!--
**INTERNAL and MINOR tagged notes will not be included in the next version's final release notes.**
CATEGORY
[----------] TYPE
[ CLI ] [-------------] LOCATION
[ DOCS ] [ BREAKING ] [-------------]
[ GENERAL ] [ BUGFIX ] [ {Component} ]
[ INTERNAL ] [ ENHANCEMENT ] [ {Filename} ]
[ IOS ] [ FEATURE ] [ {Directory} ] |-----------|
[ ANDROID ] [ MINOR ] [ {Framework} ] - | {Message} |
[----------] [-------------] [-------------] |-----------|
EXAMPLES:
[IOS] [BREAKING] [FlatList] - Change a thing that breaks other things
[ANDROID] [BUGFIX] [TextInput] - Did a thing to TextInput
[CLI] [FEATURE] [local-cli/info/info.js] - CLI easier to do things with
[DOCS] [BUGFIX] [GettingStarted.md] - Accidentally a thing/word
[GENERAL] [ENHANCEMENT] [Yoga] - Added new yoga thing/position
[INTERNAL] [FEATURE] [./scripts] - Added thing to script that nobody will see
-->
Closes https://github.com/facebook/react-native/pull/18627
Differential Revision: D8436331
Pulled By: hramos
fbshipit-source-id: ec75a6ca926061cbf7cb106db652f2b4a71c9a0c
Summary:
This PR makes sure that changing the `keyboardType` props of `<TextInput>` is reflected while the text field has focus. It is something that is also discusses in #13782. The workaround mentioned in that issue using `key` causes the TextInput to re-render itself which has some undesired side-effects.
Fixes#13782
```javascript
export default class KeyboardTypeApp extends Component {
state = { keyboardType: 'default' };
toggleKeyboardType = () => {
this.setState({
keyboardType: this.state.keyboardType === 'default' ? 'numeric' : 'default'
});
}
render() {
return (
<View style={{ padding: 40 }}>
<TextInput autoFocus value="Press Toggle :)" keyboardType={this.state.keyboardType} />
<Button title="Toggle" onPress={this.toggleKeyboardType} />
</View>
);
}
}
```
![video](https://user-images.githubusercontent.com/706368/39268429-3e331440-48d0-11e8-947c-7d334e3cec50.gif)
<!--
Does this PR require a documentation change?
Create a PR at https://github.com/facebook/react-native-website and add a link to it here.
-->
[IOS] [ENHANCEMENT] [TextInput] - Keyboard layout now updates when changing `keyboardType` while it has focus
<!--
**INTERNAL and MINOR tagged notes will not be included in the next version's final release notes.**
CATEGORY
[----------] TYPE
[ CLI ] [-------------] LOCATION
[ DOCS ] [ BREAKING ] [-------------]
[ GENERAL ] [ BUGFIX ] [ {Component} ]
[ INTERNAL ] [ ENHANCEMENT ] [ {Filename} ]
[ IOS ] [ FEATURE ] [ {Directory} ] |-----------|
[ ANDROID ] [ MINOR ] [ {Framework} ] - | {Message} |
[----------] [-------------] [-------------] |-----------|
EXAMPLES:
[IOS] [BREAKING] [FlatList] - Change a thing that breaks other things
[ANDROID] [BUGFIX] [TextInput] - Did a thing to TextInput
[CLI] [FEATURE] [local-cli/info/info.js] - CLI easier to do things with
[DOCS] [BUGFIX] [GettingStarted.md] - Accidentally a thing/word
[GENERAL] [ENHANCEMENT] [Yoga] - Added new yoga thing/position
[INTERNAL] [FEATURE] [./scripts] - Added thing to script that nobody will see
-->
Closes https://github.com/facebook/react-native/pull/19027
Differential Revision: D8416007
Pulled By: PeteTheHeat
fbshipit-source-id: c4f89ab3dc0819bca52feddbc9c7a9f62fd96794
Summary: This makes it so that `YellowBox` and its dependencies are completely stripped from production bundles.
Reviewed By: sahrens
Differential Revision: D8402545
fbshipit-source-id: 6993521280a02dfe5eab8863d12c46781f35444f
Summary:
The flow types for these were too restrictive.
Fixes https://github.com/facebook/react-native/issues/19093
Reviewed By: yungsters
Differential Revision: D8409550
fbshipit-source-id: e4774e8856efc998ff1fa6cdcbe7b0cb6db2c4e3
Summary: Uses `SafeAreaView` in the YellowBox inspector header so that it does not collide with the status bar.
Reviewed By: sahrens
Differential Revision: D8374861
fbshipit-source-id: e67358ac9268db8291cacf79df402f3bd5a2173d
Summary:
Thank you for sending the PR! We appreciate you spending the time to work on these changes.
Help us understand your motivation by explaining why you decided to make this change.
React Native provides an implementation of the Web "Console" API, which is a powerful mechanism for debugging and analyzing RN apps. However, one subset of the Console API that RN does not provide is the "grouping" functions, namely `console.group` and `console.groupEnd`. These functions provide a useful way to see how an application behaves within a different parts of an application hierarchy.
I modified the "RNTester" app to create a console group each time an example is tapped, and the group is ended when the "Back" button is tapped. Here is an example of the grouping as seen in the Xcode console.
<img width="651" alt="console grouping" src="https://user-images.githubusercontent.com/445421/37882070-d2ae7860-306d-11e8-8cf4-be843a864f43.png">
https://github.com/facebook/react-native-website/pull/270
[GENERAL] [ENHANCEMENT] [console.js] - Add `console.group()` and `console.groupEnd()` APIs, matching the Web Console API.
Closes https://github.com/facebook/react-native/pull/18555
Differential Revision: D7992131
Pulled By: hramos
fbshipit-source-id: 0d28896292563922240ae2100ed49e35b6d1f102
Summary: `width` and `height` are required for this style prop, for the sake of consistency (and Fabric). Callsites should set one of them to 0 instead of not specifying it.
Reviewed By: TheSavior, shergin
Differential Revision: D8371064
fbshipit-source-id: b0ffd6b6543ac5456a3708382966e7b3df241f7e
Summary:
Replaces the existing `YellowBox` with a modern one.
Here are the notable changes:
- Sort warnings by recency (with most recent on top).
- Group warnings by format string if present.
- Present stack traces similar to RedBox.
- Show status of loading source maps.
- Support inspecting each occurrence of a warning.
- Fixed a bunch of edge cases and race conditions.
Reviewed By: TheSavior
Differential Revision: D8345180
fbshipit-source-id: b9e10d526b262c3985bbea639ba2ea0e7cad5081
Summary:
Currently on iOS and Android focus/blur events trigger onPressIn/onPressOut. Based on discussions with people are several companies who use react-native we're proposing instead triggering new events onFocus/onBlur. Initial discussion on Slack with some from the core team on Slack seemed positive.
Couple reasons:
* The current API behavior overloads onPressIn/onPressOut. That means on platforms like react-native-web, if focus/blur support was added (as we're hoping for), even though onPressIn/onPressOut would be useful as the name describes, you wouldn't be able to distinguish between it and browser element focus/blur events.
* The names aren't as self-documenting/intuitive as onFocus/onBlur, especially for react-dom users.
There aren't any current tests around this, but I intend to add them if we solidify the API.
There's also an option question on the transition--do we deprecate the existing API with a warning? This PR just deprecates them, though it will on any TV platform when something becomes focused regardless of whether they use the API or not. This isn't ideal. It's not clear if there are alternatives or if just right away breaking the API for TV users is the correct solution, if we can get consensus between the few parties who are using it.
***
I'm interested to hear counter points or prior discussions.
Cc/ matthargett dlowder-salesforce rozele
Closes https://github.com/facebook/react-native/pull/18470
Differential Revision: D8368109
Pulled By: hramos
fbshipit-source-id: 22587b82e091645e748b6c2d721fdff06d54837f
Summary: When a third party library is vendored, both the original copyright header as well as React Native's header are required.
Reviewed By: fkgozali
Differential Revision: D8284116
fbshipit-source-id: 1748eb011c843a87e9ed421597571b66334edfd2
Summary:
This PR fixes a bug in `deepFreezeAndThrowOnMutationInDev` which did not take into account that objects passed to it may have been created with `Object.create(null)` and thus may not have a prototype. Such objects don't have the methods `hasOwnProperty`, `__defineGetter__`, or `__defineSetter__` on the instance.
I ran into an unrecoverable error in React Native when passing this type of object across the bridge because `deepFreezeAndThrowOnMutationInDev` attempts to call `object.hasOwnProperty(key)`, `object.__defineGetter__` and `object__defineSetter__` on objects passed to it. But my object instance does not have these prototype methods.
Changes:
* Defined `Object.prototype.hasOwnProperty` as a `const` (pattern used elsewhere in React Native)
* Modified calls to `object.hasOwnProperty(key)` to use `hasOwnProperty.call(object, key)` (Per ESLint rule [here](https://eslint.org/docs/rules/no-prototype-builtins))
* Modified calls to deprecated methods `object.__defineGetter__` and `object.__defineSetter__` to instead use `Object.defineProperty` to define get and set methods on the object. (Per guidance on [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/__defineGetter__))
* Added a new test to `deepFreezeAndThrowOnMutationInDev-test` to verify the fix.
I tried to create a reproducible example to post to Snack by passing prototype-less objects to a `Text` component, in various ways, but they appear to be converted to plain objects before crossing the bridge and therefore they do not throw an error.
However, I was able to create a new test to reproduce the issue. I added the following test to `deepFreezeAndThrowOnMutationInDev-test`:
```JavaScript
it('should not throw on object without prototype', () => {
__DEV__ = true;
var o = Object.create(null);
o.key = 'Value';
expect(() => deepFreezeAndThrowOnMutationInDev(o)).not.toThrow();
});
```
The changes in this PR include this new test.
ESLint test produced no change in Error count (3) or Warnings (671)
N/A
Other areas with _possibly_ the same issue:
c6b96c0df7/Libraries/vendor/core/mergeInto.js (L50)8dc3ba0444/Libraries/ReactNative/requireNativeComponent.js (L134)
[GENERAL] [BUGFIX] [Libraries/Utilities/deepFreezeAndThrowOnMutationInDev] -Fix for compatibility with objects without a prototype.
Closes https://github.com/facebook/react-native/pull/19598
Differential Revision: D8310845
Pulled By: TheSavior
fbshipit-source-id: 020c414a1062a637e97f9ee99bf8e5ba2d1fcf4f
Summary:
Change message in Animated.Interpolation to "inputRange must be monotonically non-decreasing" as it's allowed to give the same x's like in the test [example](4435f08771/Libraries/Animated/src/__tests__/Interpolation-test.js (L71))
Simply giving improper value of interpolation input
[GENERAL] [MINOR] [AnimatedInterpolation.js] - Change error message on interpolation improper range error
Closes https://github.com/facebook/react-native/pull/19571
Differential Revision: D8310791
Pulled By: TheSavior
fbshipit-source-id: 803ef55104ad2a36231c5f18c0c089bd14822bf3
Summary:
Bump Prettier to use version 1.13.4
All code changes are caused by running Prettier and should only affect files that have an `format` header.
All other changes caused by yarn.
Reviewed By: ryanmce
Differential Revision: D8251255
fbshipit-source-id: 0b4445c35f1269d72730f2000002a27c1bc35914
Summary:
This uses the reference for `libfishhook.a` from the Products, rather than
the reference from the Frameworks group.
This fixes the build for the new Xcode build system, on both Xcode 9 and
Xcode 10.
Fixes#19569
- Using Xcode 10:
- Open `RNTester/RNTester.xcodeproj`
- Build RNTester, noting build errors
- Using Xcode 9:
- Open `RNTester/RNTester.xcodeproj`
- Switch to using new build system in `File > Project Settings > Build System`, selecting `New Build System (Preview)`
- Build RNTester, noting build errors
none
[IOS] [BUGFIX] [RCTWebSocket] - Fix build for new Xcode build system
Closes https://github.com/facebook/react-native/pull/19579
Differential Revision: D8287487
Pulled By: hramos
fbshipit-source-id: 5bfc9decb09ebc763824df8474b5897099d39ad7
Summary:
This pr makes a little bit simpler to dismiss all warnings (1 click instead of 2)
Sometimes you don't want to use `YellowBox.ignoreWarnings` to remember.
RNTester sceenshot:
<img width="322" alt="screen shot 2018-05-30 at 09 51 25" src="https://user-images.githubusercontent.com/1488195/40701475-1142506a-63ef-11e8-8fc9-ea1696d9cb65.png">
Or RNTester -> Native Animation Example -> Force JS Stalls (in the end of the list) also cause warning to test.
[GENERAL][ENHANCEMENT][YellowBox] - Move `Dismiss All` yellow box button to another place which makes a little bit simpler to dismiss warnings.
Closes https://github.com/facebook/react-native/pull/19501
Differential Revision: D8243823
Pulled By: hramos
fbshipit-source-id: 31887469cddb4adfd7b889ae0c29a3bf41e87b7b
Summary:
As we migrate over to static typing solutions for props, we cannot rely on always having `propTypes` available at runtime.
This gets us started on that journey by removing the native prop validation that happens when we require native components.
bypass-lint
Reviewed By: TheSavior
Differential Revision: D7976854
fbshipit-source-id: f3ab579a7f0f8cfb716b0eb7fd4625f8168f3d96