Commit Graph

576 Commits

Author SHA1 Message Date
Ramanpreet Nara a997c0ac16 Implement 'onShouldStartLoadWithRequest' prop
Summary:
@public

This diff introduces the native backend for a new WKWebView prop: `onShouldStartLoadWithRequest`.

In the final component, the behaviour will be as follows: Whenever the user navigates around in the web view, we call `onShouldStartLoadWithRequest` with the navigation event. If `onShouldStartLoadWithRequest` returns `true`, we continue the navigation. Otherwise, we abort it.

Reviewed By: shergin

Differential Revision: D6370317

fbshipit-source-id: e3cdd7e2a755125aebdb6df67e7b39116228bdfb
2018-08-16 16:52:44 -07:00
Ramanpreet Nara 1584108805 Implement 'reload' and 'stopLoading' methods
Summary:
@public

This diff implements the `reload` and `stopLoading` methods for `WKWebView`. Their functionality is self-explanatory.

Reviewed By: shergin

Differential Revision: D6369292

fbshipit-source-id: ba176f4406e0a67606406f36dd66f7615f4796c3
2018-08-16 16:52:44 -07:00
Ramanpreet Nara 03b57d9db6 Implement 'goForward' and 'goBack' methods
Summary:
@public

This diff implements the `goForward` and `goBack` methods on `WKWebView`.
1. `goForward` moves the web view one screen forward in the browser history.
1. `goBack` moves the web view one screen back in the browser history.

Reviewed By: shergin

Differential Revision: D6367495

fbshipit-source-id: e100ca00e92a6eaa30d2af1af642ba79a9c9feae
2018-08-16 16:52:43 -07:00
Ramanpreet Nara 0022354525 Implement 'injectJavaScript' method
Summary:
@public

This diff introduces a method called `injectJavaScript(script)` on the React Native `<WKWebView/>` component. When called with a string, it evaluates that string as JavaScript within the web view.

Reviewed By: shergin

Differential Revision: D6367445

fbshipit-source-id: f68afeff42535dc991747f96a63f3c956faf13d3
2018-08-16 16:52:43 -07:00
Ramanpreet Nara 90e85a4adc Implement 'decelerationRate' prop
Summary:
@public

The content that renders within the `WKWebView` instance actually renders inside a `UIScrollView`. On that scroll view, we can adjust the `decelerationRate`, which controls how fast the view stops scrolling after the user lets go while scrolling.

In this diff, I implemented the `decelerationRate` prop for `WKWebView`, which gets forwarded to the `UIScrollView` instance underlying the web view.

**Note:** Even though we accept a floating point value for the deceleration rate, the native `UIScrollView` component only allows two inputs:
1. `UIScrollViewDecelerationRateNormal`: 0.998
2. `UIScrollViewDecelerationRateFast`: 0.99

As far as I know, it seems to just round up to the nearest valid `CGFloat` (or down if number > 0.998), for any invalid numbers.

Reviewed By: mmmulani

Differential Revision: D6307262

fbshipit-source-id: 98c4395702415aa36519f9e9bd84f043be3a5881
2018-08-16 16:52:43 -07:00
Ramanpreet Nara 1741fe9571 Implement 'scrollEnabled' prop
Summary:
@public

The content of `WKWebView` renders within a scrollview. In this diff, I'm introducing the prop `scrollEnabled` to allow developers to control whether scrolling is enabled within the scroll view, or not.

Reviewed By: mmmulani

Differential Revision: D6307001

fbshipit-source-id: 5a199c6c3b8535e45a5a3cb6041e822bb7af2362
2018-08-16 16:52:43 -07:00
Ramanpreet Nara e5f95aba9b Implement 'bounces' prop
Summary:
@public

The content that loads inside `WKWebView` renders within a `ScrollView`. Suppose the user pulls the page down when its top edge hits the top edge of the web view. Then, one of two things can happen as the user continues to pull the page down:
1. We let the page be pulled past the top edge of the web view.
1. We fix the page's vertical offset to 0 so that it doesn't move past the top edge of the web view.

The property that controls this behaviour is `<WKWebView bounces={true|false}/>`. In this diff, I implement it.

Reviewed By: mmmulani

Differential Revision: D6306866

fbshipit-source-id: 7763df78676215c3dd0bd7a029497a6eca1873ab
2018-08-16 16:52:43 -07:00
Ramanpreet Nara 7a6dd9807c Implement message passing!
Summary:
@public

This diff implements message passing between the `WKWebView` and React Native. As with `<WebView/>`, we can only send/receive strings.

**Usage:**
1. Set `messagingEnabled` to `true`.
1. To send data from the web view to React Native, call `postMessage(data)` within the web view. This forces React Native to execute the `onMessage` prop on the `WKWebView` component. `onMessage` will be called with an event `e`, where `e.nativeEvent.data` will be the data you passed into `postMessage`.
1. To send data from React Native to the web view, call `UIManager.dispatchViewManagerCommand` to dispatch the `UIManager.RCTWKWebView.Commands.postMessage` command. Look at [[ https://fburl.com/u1wusf2f | this part of the existing `<WebView/>` ]] component for more details. After you make the call, React Native will dispatch a `'message'` event to the `document` object within the webview. You can listen to the event by doing `document.addEventListener('message', callback)`. Let the event dispatched be `e`. Then, `e.data` is the data you sent over from React Native.

[[ P58627181 | This Playground.js ]] illustrates the usage.

Reviewed By: shergin

Differential Revision: D6304850

fbshipit-source-id: 29075ef753296e9fb5a9cddeb1ad0f4ff7e28650
2018-08-16 16:52:43 -07:00
Ramanpreet Nara 3703927e7e Implement onLoading(Start|Finish|Error) and injectedJavaScript props
Summary:
@public

This diff includes four very straightforward changes:
1. Whenever the WebView starts loading, the `onLoadingStart` hook should be executed. The event passed into this hook should be decorated with the `navigationType`.
1. Whenever the WebView errors out while loading, the `onLoadingError` hook should be executed.
1. Whenever the WebView finishes loading (without any errors), the `onLoadingFinish` hook should be executed.
1. The serialized JavaScript passed into the `injectedJavaScript` prop should be executed when the WebView finishes loading. After execution finishes, the `onLoadingFinish` prop should be called with the serialized completion value of this JavaScript.

Reviewed By: shergin

Differential Revision: D6293532

fbshipit-source-id: 21407c766f73413046823ae605afc21e85cf9db6
2018-08-16 16:52:43 -07:00
Ramanpreet Nara 1442c265da Implement WKWebView to replace WebView
Summary:
@public

`UIWebView` has been deprecated and replaced by `WKWebView`. This diff introduces a new component `WKWebView` that simply renders a `WKWebView` on iOS.

This is the first in the stack of many diffs that'll be required to fully replace `UIWebView` with `WKWebView` in the `<WebView/>` React Native component. Eventually, I hope to introduce a prop called `useWebKitImplementation`, which, when true, will force RN to use `WKWebView` instead of `UIWebView` for the `<WebView/>` component.

The only thing that's been implemented so far is the `source` property.

Reviewed By: mmmulani

Differential Revision: D6266100

fbshipit-source-id: 65862e34bd98db7fff0349cf26888afee43a56e4
2018-08-16 16:52:43 -07:00
Steven Cable b21d4914de Check return code from malloc (#20173)
Summary:
Calls abort() in cases where malloc returns NULL.

Checking the return value from malloc is good practice and is
required to pass a [Veracode security scan](https://www.veracode.com/). This will let
developers who are required to submit their software to Veracode
use React Native.
Pull Request resolved: https://github.com/facebook/react-native/pull/20173

Differential Revision: D9235096

Pulled By: hramos

fbshipit-source-id: 9fdc97f9e84f8d4d91ae59242093907f7a81d286
2018-08-08 18:32:19 -07:00
Mats Byrkeland 253b29dbd8 Add accessibilityHint for iOS (#18093)
Summary:
This adds the accessibilityHint for View, Text and Touchable* on iOS.
The accessibilityHint provides some more information about an element
when the accessibilityLabel is not enough.

The accessibilityHint is a core accessibility property on iOS.

From https://developer.apple.com/documentation/objectivec/nsobject/1615093-accessibilityhint:
> An accessibility hint helps users understand what will happen when they perform an action on the accessibility element when that result is not obvious from the accessibility label.

Related issue: https://github.com/facebook/react-native/issues/14706

The npm scripts `test`, `flow`, `lint` and `prettier` are satisfied.

I added a couple of examples to the RNTester app. The Accessibility Inspector on Mac helps debugging accessibility stuff on a simulator, but it does not show the accessibilityHint. Therefore I tested the RNTester app on an iPhone 8 device using VoiceOver to verify the hint functionality. It works fine, and I've tested disabling and enabling "read hints" in the VoiceOver settings on the phone.

https://github.com/facebook/react-native-website/pull/222

[IOS][FEATURE][Accessibility] - Add accessibilityHint for View, Text, Touchable* on iOS
Closes https://github.com/facebook/react-native/pull/18093

Reviewed By: hramos

Differential Revision: D7230780

Pulled By: ziqichen6

fbshipit-source-id: 172ad28dc9ae2b67ea256100f6acb939f2466d0b
2018-07-25 17:47:42 -07:00
Peter Argany fab5fffbb3 Fixed OSS scroll view bug caused by FBPullToRefresh
Summary:
When I bridged FBPullToRefresh to RN, the integration with ScrollView caused a bug on OSS

TLDR; assuming that a scrollview subview that implemented UIScrollViewDelegate protocol was a custom PTR was a bad idea. This caused some scrollviews to break in OSS. The solution is to define a more explicit protocol.

Further details here:
https://github.com/facebook/react-native/issues/20324

Reviewed By: mmmulani

Differential Revision: D8953893

fbshipit-source-id: 98cdc7fcced41d9e98e77293a03934f10c798665
2018-07-23 13:33:28 -07:00
Valentin Schlattinger e592d6f8c7 fix missing selection indicator lines (#18885)
Summary:
This PR is based on https://github.com/facebook/react-native/pull/13342 by pvinis and fixes https://github.com/facebook/react-native/issues/14442.

As suggested in the discussion on the PR mentioned above, I moved the code from `React/Views/RCTPickerManager.m` to the `initWithFrame` function in `React/Views/RCTPicker.m` and verified that it still fixes the problem.

Before the change in this PR the selection indicator lines are missing when the Picker is initially added to the View and only appear after changing to a different Tab and back. This happens both in the Simulator and my real device (iPhone 6S on iOS 11.3).

![beforechange](https://user-images.githubusercontent.com/7568362/38824104-7b294cae-41a8-11e8-8609-7a647ab3adb8.png)

After the change, the indicator lines always appear. I did not notice any side effects of this change when playing around with the Picker in different configurations.

![afterchange](https://user-images.githubusercontent.com/7568362/38824109-82a5b382-41a8-11e8-8af3-ca07c8b2c30e.png)

https://github.com/facebook/react-native/pull/13342 also fixes this issue but appears to be inactive.

[IOS] [BUGFIX] [PickerIOS] - Fixed missing selection indicator lines
Pull Request resolved: https://github.com/facebook/react-native/pull/18885

Differential Revision: D8945483

Pulled By: hramos

fbshipit-source-id: 2b6c6f42559691530b062503feb24bc305f4a8af
2018-07-20 19:01:32 -07:00
Ziqi Chen ca01290d8e changed prop name currentViewStates to AccessibilityStates on iOS (3/3)
Summary:
Context:
After discussing with yungsters, `currentViewStates` is a very ambiguous name for a prop, especially because there are only two possible values. From a developer's perspective, it makes more sense to just call them `accessibilityStates` because the main use for them is to add states to Talkback and Voiceover.
Also, the actual implementation of what we're changing under the hood in Native Code is abstracted away from developers using React Native, so as long as behavior is as they would expect, it makes more sense to change the name into a clear one.

Changes in this Diff:
Renamed the view property exposed to native iOS code from `currentViewStates`  to `accessibilityStates`
Also deleted setting the userInteractionEnabled view property, because we want to keep it as just an accessibility property.

Reviewed By: PeteTheHeat

Differential Revision: D8896821

fbshipit-source-id: 95674c9b7295f5b9e60994c297acdee83f6226d7
2018-07-19 14:13:01 -07:00
Ziqi Chen 679bff2658 added native iOS functionality for prop currentViewStates
Summary:
Added Native iOS functionality for prop currentViewStates.

On iOS, this property modifies both the view property userInteractionEnabled and also adds corresponding UIAccessibilityTraits to the view.

If disabled is passed in, userInteractionEnabled of the view will be set to false.

The value that is passed into currentviewStates is converted to a UIAccessibilityTrait Enum and masked in with existing UIAccessibilityTraits on that native view.

The native implementation for accessibilityRole is also changed to also mask new UIAccessibilityTraits with existing ones.

Reviewed By: PeteTheHeat

Differential Revision: D8842691

fbshipit-source-id: 919267300c70efed93a7a92377a0178bd8885eb5
2018-07-17 16:06:21 -07:00
Ziqi Chen d9eeae91a0 added image button role on iOS
Summary:
Because we're now separating accessibilityTraits into accessibilityRole and accessibilityState, we're going to only allow one role to be set, and allow on preset combinations of roles that make sense.

This change adds iOS functionality to the role image button because a popular accessibilityTrait combination is image and button.

Reviewed By: ikenwoo

Differential Revision: D8847012

fbshipit-source-id: da386dbf82cb3854d14c228a1116da9f4067fe93
2018-07-16 18:48:15 -07:00
Ziqi Chen f39d0923c7 removed tabbar for iOS 9 compatibility issues
Summary: Removed Accessibility Trait TabBar for iOS compatibility Issues, since tabbar is only available on iOS 10+

Reviewed By: PeteTheHeat

Differential Revision: D8822469

fbshipit-source-id: 34bf00eb930f631a5a4effa0a4159da07c1573f6
2018-07-12 12:32:03 -07:00
Ziqi Chen c27b495a89 added accessibilityRole Prop, added functionality support for role on android
Summary:
Added a new property to View for Accessibility called `accessibilityRole`. This property merges functionality of existing properties: `accessibilityTraits` (iOS) and `accessibilityComponentType` (android).

Currently, nine values are supported with equivalent behavior as `accessibilityTraits` (iOS) when `accessibilityRole` is set on iOS Voiceover and Android TalkBack

```
  | 'none'
  | 'button'
  | 'link'
  | 'search'
  | 'image'
  | 'keyboardkey'
  | 'text'
  | 'adjustable'
  | 'tabbar'
```
They currently support similar behavior on talkback on Android and voice over on iOS
Does not break functionality of existing properties, but have not tested for behavior of setting both this one and the old one.

* iOS - I added a property accessibilityRoles, and basically remapped it to the same thing as accessibilityTraits. I also added in enum mappings for keyboardkey and tabbar.
* Android - Also added a property accessibilityRoles, from the Android side. For the underlying native functionality, I built a helper class that is based off of AccessibilityRolesUtil.java from the accessibility team. Biggest changes made are that I defined my own enums if needed, and also set some properties to match the functionality of iOS Accessibility Traits. I also handled the logic for switch/case statements of setting roles for the android side on this file. Also, I currently haven't localized strings for setRoleDescription, but plan to.
* Javascript - I added a view property accessibilityRoles in ViewPropTypes.

Reviewed By: blavalla

Differential Revision: D8756225

fbshipit-source-id: e03eec40cce86042551764f433e1defe7ee41b35
2018-07-10 12:18:27 -07:00
Ziqi Chen 5f8b44fd22 added check for iOS 11 on ignore inverted colors
Summary:
Added Check for iOS 11 before setting property for `accessibilityIgnoreInvertColor`

Builds on top of
https://our.intern.facebook.com/intern/diff/D8549084/

Reviewed By: shergin

Differential Revision: D8599698

fbshipit-source-id: c5cc26b4c1c20fb9cca5bfe7143fa9dcb217a2d7
2018-06-28 12:09:58 -07:00
Peter Argany 22d068a108 Revert D8549084: Added Accessibility Feature for RN to support Smart Inversion for photos
Differential Revision:
D8549084

Original commit changeset: 82a3bc73c9e6

fbshipit-source-id: 8dca4efe701058710187828d64a055278ff585ab
2018-06-24 10:46:02 -07:00
Ziqi Chen af226078e7 Added Accessibility Feature for RN to support Smart Inversion for photos
Summary:
@public
Added a property `accessibilityIgnoresInvertColors (boolean)`  to Views which allows the Apple API `accessibilityIgnoresInvertColors` to be used in React Native.
Now, when a user has Display: Smart Invert enabled, you can set the property to be true, and things like photos and views with the property set to true will no longer be inverted when Smart Invert is enabled.

This property can also be applied to the Image Component.

Example Use Case:

```
<Image accessibilityIgnoresInvertColors={true} />
```
```
<View accessibilityIgnoresInvertColors={true} />
```

| Before | After |
| ------ | ----- |
| ![original](https://user-images.githubusercontent.com/165856/41738737-b62c6ebc-7547-11e8-8ea3-f82239998071.jpg) | ![feeditem](https://user-images.githubusercontent.com/165856/41738749-beef6de2-7547-11e8-9771-b44e513de0fd.jpg)

Reviewed By: PeteTheHeat

Differential Revision: D8549084

fbshipit-source-id: 82a3bc73c9e6d75d6b50ba013b88127f07692641
2018-06-21 15:31:55 -07:00
Hoa Dinh adb6929b36 Fixed build eats
Reviewed By: skotchvail

Differential Revision: D8529938

fbshipit-source-id: 6a97d2c54757d7e75fe8731efe24704cf7fdf87c
2018-06-20 10:04:22 -07:00
Sean Nicolay b8f30db0ae Fix or mark enum conversions
Reviewed By: adamjernst

Differential Revision: D8077375

fbshipit-source-id: 804ef985a773c7e1af6b7aa690790f57b10368f7
2018-05-22 09:53:54 -07:00
Kevin Gozali f50df4f5ec iOS OSS: deployment target 8.0 => 9.0
Summary: Moving target deployment to iOS 9.0+ from now on, removing customization for iOS 8.

Reviewed By: shergin

Differential Revision: D8053439

fbshipit-source-id: 292c58f15c6e6caf8b28d15c1521812d6ed675c5
2018-05-22 01:16:45 -07:00
Kevin Gozali 6611fefef7 iOS: Exposes the RCTFont size overrides so unit tests can use the same values
Summary:
`RCTFontTests` test in RNTester is broken if the target deployment is <= OS 8.2. This is because RCTFont.mm overrides the OS-defined values, but the override is only visible to RCTFont.mm internals. As the result, when the Unit test tries to create UIFont of the "same" weight, it got a different font - most likely due to internal floating rounding errors.

To mitigate, code that wants to test out internals of RCTFont should import RCTFontConstantsOverride.h

Reviewed By: mmmulani

Differential Revision: D7900954

fbshipit-source-id: e5814ef059a8afdfb5205ca1af46c41b3cfd4318
2018-05-07 17:31:12 -07:00
Jerry Horton 37c820f16e Fix for issue #19086 RCTHasFontHandlerSet(); This function definition…
Summary:
… is not a protoype #19086

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.

<!--
  Required: Write your motivation here.
  If this PR fixes an issue, type "Fixes #issueNumber" to automatically close the issue when the PR is merged.
-->

Fixes #19086

Related to react-native-navigation issue #3019

<!--
  Required: Write your test plan here. If you changed any code, please provide us with
  clear instructions on how you verified your changes work. Bonus points for screenshots and videos!
-->

Created a fresh react native >= 0.55.2 project and only install React Native Navigation. The error "This function declaration is not a prototype" message occurs.

Downgrading to React Native 0.54.4 builds fine.

![screen shot 2018-05-01 at 3 17 51 pm](https://user-images.githubusercontent.com/5680239/39491718-ddfdd6a0-4d52-11e8-937f-7ed9702a2e30.png)

<!--
  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.
-->

No documentation change

<!--
  Required.
  Help reviewers and the release process by writing your own release notes. See below for an example.
-->
[iOS] [BUGFIX] [react-native-navigation] - For compatibility with react-native-navigation >= 2.0.2237 https://github.com/facebook/react-native/issues/19086
<!--
  **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/19089

Differential Revision: D7841198

Pulled By: shergin

fbshipit-source-id: 31638274055c3f143342d2d6dde6d4af7a2ac304
2018-05-01 19:32:07 -07:00
Valentin Shergin f6f7d0484c Fixed typo in RCTShadowView
Summary: Trivial.

Reviewed By: PeteTheHeat

Differential Revision: D7503382

fbshipit-source-id: 0c553553bcde5c2f32bace0fa047aee6a106619b
2018-04-10 12:59:51 -07:00
Peter Argany f96d7ae648 Bridged FBPullToRefresh to JS
Reviewed By: shergin

Differential Revision: D6875099

fbshipit-source-id: 00bbad7569ff047a77f198ad2bf4d77fccbaa2e9
2018-03-27 18:19:30 -07:00
Valentin Shergin c194c18126 Fixed performance regression in `ShadowView`s layout process
Summary:
This fixes perf regression which was introduced by recent refactoring of the layout process.
That is how it used to be:
114c258045/React/Views/RCTShadowView.m (L160-L166)
Note: We have to resert this flag in indication that we already applied those changes and we don't need to traverse this subtree until it is changed again.

Reviewed By: fkgozali

Differential Revision: D7343564

fbshipit-source-id: ba7e00bc5fe4992d777eed20ba0d959fd8f6c037
2018-03-21 11:04:35 -07:00
Sahil Ohri 8466db0fd3 Revert #17927
Summary:
This change is a revert of [#17927](https://github.com/facebook/react-native/pull/17927) pull-request.
The pull-request caused an issue with the keyboard covering the text field at the bottom of the scroll view.

Reviewed By: shergin

Differential Revision: D7246609

fbshipit-source-id: 149f825274c4fa79ab593f1bae3602667d16ddee
2018-03-13 19:27:33 -07:00
Julien K 6c353fd7e9 onPress animation with magnification
Summary:
Related to: #15454

Motivation: Improve tvOS feeling for TouchableHighlight

![changewithaniamtion](https://user-images.githubusercontent.com/7658664/29193477-b99b4a10-7e25-11e7-8b31-e0e4ca9d7720.gif)

- When you select the button he is focus and the underlay is show
- When you press the button, there is an animation, but after the animation, the focus is on the button and the underlay is show

Play with tvParallaxProperties on tvOS, test with and without patch just to see the actual behaviour
```
			<TouchableHighlight
						tvParallaxProperties={{
							enabled: true,
							shiftDistanceX: 0,
							shiftDistanceY: 0,
							tiltAngle: 0,
							magnification: 1.1,
                                                        pressMagnification: 1.0,
							pressDuration: 0.3,
						}}
						underlayColor="black"
						onShowUnderlay={() => (console.log("onShowUnderlay")}
						onHideUnderlay={() =>  (console.log("onHideUnderlay")}
						onPress={() =>  (console.log("onPress")}
					>
						<Image
							style={styles.image}
							source={ uri: 'https://www.facebook.com/images/fb_icon_325x325.png' }
						/>
					</TouchableHighlight>
```
Closes https://github.com/facebook/react-native/pull/15455

Differential Revision: D6887437

Pulled By: hramos

fbshipit-source-id: e18b695068bc99643ba4006fb3f39215b38a74c1
2018-02-27 13:10:02 -08:00
Manman Ren ebbd4371c9 Mark ObjC methods that are called from React Native as dynamic.
Reviewed By: mmmulani

Differential Revision: D7087100

fbshipit-source-id: 18e5726e5b48e7b71fcaab19f6fe73be0cad6233
2018-02-26 12:24:17 -08:00
siddhantsoni 16c9e5b715 Fix: Added scroll Bounds check in scrollToOffset method in RCTScrollView on iOS
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.

You can learn more about contributing to React Native here: http://facebook.github.io/react-native/docs/contributing.html

Happy contributing!

-->

The scrollToOffset method of RCTScrollView for iOS does not include bound check for the scroll offset provided to the method. This can cause the whole view to scroll out of screen if the offset provided is greater than the bounds of the View.
The same does not happen on Android, where the scroll halts once the last item of the scrollView is in the viewport.
I have added bounds check so the offset resets to the MaxOffset which makes sure the view does not scroll out of the viewport.

The issue can be observed in the following snack:
https://snack.expo.io/H1363Uo8f

![ezgif com-optimize 1](https://user-images.githubusercontent.com/16662518/36068270-2437ae88-0ef7-11e8-96dd-819b4ae0fd67.gif)

To test my changes I ran the code provided in the snack above with the react-native dependency pointing to my branch. As can be see in the video attached below, the scroll halts once it hits the end of the ScrollView even if the scroll offset provided is higher than the bounds of the ScrollView. It also does not scroll up for negative scroll offset.

![ezgif com-optimize](https://user-images.githubusercontent.com/16662518/36068130-9ae4f918-0ef3-11e8-8728-af7b2888bdb8.gif)

[IOS] [BUGFIX] [ScrollView] - Added bounds check to prevent ScrollView from scrolling to an offset which is out of bounds of the ScrollView for iOS.
Closes https://github.com/facebook/react-native/pull/17927

Differential Revision: D7014466

Pulled By: shergin

fbshipit-source-id: a817738d08e1057a4c70f43373132f88fa1461c4
2018-02-25 22:18:31 -08:00
Sophie Alpert 1490ab12ef Update license headers for MIT license
Summary:
Includes React Native and its dependencies Fresco, Metro, and Yoga. Excludes samples/examples/docs.

find: ^(?:( *)|( *(?:[\*~#]|::))( )? *)?Copyright (?:\(c\) )?(\d{4})\b.+Facebook[\s\S]+?BSD[\s\S]+?(?:this source tree|the same directory)\.$
replace: $1$2$3Copyright (c) $4-present, Facebook, Inc.\n$2\n$1$2$3This source code is licensed under the MIT license found in the\n$1$2$3LICENSE file in the root directory of this source tree.

Reviewed By: TheSavior, yungsters

Differential Revision: D7007050

fbshipit-source-id: 37dd6bf0ffec0923bfc99c260bb330683f35553e
2018-02-16 18:31:53 -08:00
Mehdi Mulani f96dfb9468 Disable font scaling when an explicit font handler is set
Reviewed By: sahrens

Differential Revision: D7003464

fbshipit-source-id: f36ff344c50a9c63af6c852138041c1c918259c8
2018-02-16 12:37:51 -08:00
Valentin Shergin f91f7d91a1 Reimagining of RCTShadowView layout API
Summary:
This is reimagining of interoperability layer between Yoga and ShadowViews (at least in Yoga -> RN part).
Goals:
 * Make it clear and easy.
 * Make clear separation between "what layout what", now parent always layout children, noone layout itself.
 * Make possible to interleave Yoga layout with custom imperative layout (may be used in SafeAreaView, Text, Modal, InputAccessoryView and so on).

Reviewed By: mmmulani

Differential Revision: D6863654

fbshipit-source-id: 5a6a933874f121d46f744aab99a31ae42ddd4a1b
2018-02-12 00:32:43 -08:00
Valentin Shergin 114c258045 Enabling round-to-pixel Yoga feature for RN (iOS)
Summary:
This change enables built-in Yoga mechanism which rounds producing layout metrics to closest "pixel" values.
See previous diff for more context.

Reviewed By: fkgozali

Differential Revision: D6889762

fbshipit-source-id: bc2eea44704db4b377e2e14fab9f67be8c935719
2018-02-05 22:17:22 -08:00
Valentin Shergin ceb1d1ca5b Removing our own implementation of round-to-pixel algorithm
Summary:
> Okay, I don't remember where we first met
> But hey, admitting is the first step

This issue has a looong history.
The original algorithm was introduced by Nick Lockwood (nicklockwood Hey Nick! We miss you!) a while ago and from the very beginning this has one small error that basically makes it useless (try to find it yourself, it's fun!)
The problem was discovered and fixed twice (D4133643, D4983054), but every time we found that our <Text> infra was not ready for this, so we reverted and abandoned the change. As part of the last attempt to finally solve the issue, I ported the algorithm to Yoga where it lives today and works very well for Lytho and CK.
For now, the vision is clear:
 * The basic algorithm should live in Yoga for unification and performance reasons.
 * We still have to have `absolutePostion` as part of this API because it might be useful for some components which implement its own custom/non-Yoga-based layout.
 * We have to enable it in RN eventually.

So, this is the first step: Removing old, broken code which we don't plan to fix and use.

Make React Native crisp again!

Reviewed By: fkgozali

Differential Revision: D6888662

fbshipit-source-id: 2e5098d9935dcbe05d66c777dad3a9ec8ac87ec3
2018-02-05 22:17:22 -08:00
Valentin Shergin c19bc79688 `[RCTShadowView isHidden]` was removed
Summary:
It's unused.
Use `display` prop instead to control visiblity of the view.

Reviewed By: fkgozali

Differential Revision: D6888104

fbshipit-source-id: dd37a365033ec36bdfcfa305ec6a965a10dec2cd
2018-02-05 22:17:22 -08:00
Valentin Shergin 9dfa2e7f3c Removed `[ShadowView collectUpdatedFrames:]`
Summary: Another juicy leftover from old Text implementation.

Reviewed By: fkgozali

Differential Revision: D6887942

fbshipit-source-id: d0363d06d566554c03d0ae3293597daf9c387028
2018-02-05 22:17:22 -08:00
Valentin Shergin 0f9fc4b295 `processUpdatedProperties` & `collectUpdatedProperties` was removed from RCTShadowView
Summary: This is leftovers from last <Text> reimplementation; nobody uses it and it does not hooked up with UIManager.

Reviewed By: fkgozali

Differential Revision: D6887795

fbshipit-source-id: 9e2e29af4ba959270096eeb494666d1cacaeba32
2018-02-05 22:17:22 -08:00
Mehdi Mulani a9c684a0ff Allow substituting a default font handler
Reviewed By: nscoding

Differential Revision: D6798995

fbshipit-source-id: 541b4391428d1ee9c0b394033182dc232536c864
2018-01-30 13:51:19 -08:00
Semen Zhydenko 8ffc16c6e7 Typos in code
Summary:
To fix typos

No testing required, changed only internal things names

No

addtionalStyles -> additionalStyles
occured -> occurred
recomendedType -> recommendedType
markDirtyAndPropogate -> markDirtyAndPropagate
targetting -> targeting
RCTApplyTranformationAccordingLayoutDirection -> RCTApplyTransformationAccordingLayoutDirection (tranform -> transform)
Closes https://github.com/facebook/react-native/pull/17587

Differential Revision: D6832696

Pulled By: shergin

fbshipit-source-id: 452287e5ce82df5c6b87126cb21889b7bd9d73c1
2018-01-29 19:17:33 -08:00
Adam Putinski 31288161e1 Add accessibilityElementsHidden prop
Summary:
Allow iOS to have similar accessibility functionality to Android. This PR exposes the `accessibilityElementsHidden` property on iOS which is similar to Android's `importantForAccessibility="no-hide-descendants"`

I didn't see any existing examples for testing native props being passed through, but I did add an example to the RNTester app. I've attached some screenshots using the Accessibility Inspector to verify the property was correctly passed through.

![a](https://user-images.githubusercontent.com/603528/34998153-50e66776-faac-11e7-826d-1445a6813929.png)
![b](https://user-images.githubusercontent.com/603528/34998158-535a7420-faac-11e7-80d4-992fb7cd82dd.png)

I've updated the website with appropriate documentation.

https://github.com/facebook/react-native-website/pull/141

![screen shot 2018-01-16 at 10 23 50](https://user-images.githubusercontent.com/603528/34998202-6f2f39a6-faac-11e7-8651-0cfe8e037a30.png)
![screen shot 2018-01-16 at 10 23 59](https://user-images.githubusercontent.com/603528/34998205-711d6f94-faac-11e7-974d-54340c72fce4.png)

[IOS] [FEATURE] [View] - Added accessibilityElementsHidden property
Closes https://github.com/facebook/react-native/pull/17627

Differential Revision: D6806444

Pulled By: hramos

fbshipit-source-id: 50d31fdb92f4c59ae9355b019c422418b2e6cc24
2018-01-29 14:44:11 -08:00
Valentin Shergin e3ff3cf6cb Removed outdated assertion in RCTShadowView related to breaking change in Yoga
Summary: It's been more than two years; I think everyone already migrated and learned the new behavior.

Reviewed By: emilsjolander

Differential Revision: D6829885

fbshipit-source-id: a86d56fb7235a137e9ce6e360d7ae2224b047313
2018-01-29 10:47:14 -08:00
Vojtech Novak ed5872e2cc Make sure refreshControl shows up on initial render if specified
Summary:
[this commit](2e1707d0e6) which was just a small refactor broke refreshControl behavior - if we render FlatList with refreshing=true, the refreshControl won't be visible on initial render.

The problem is, the [previous beginRefreshing method](2e1707d0e6 (diff-cfafa8d7e42ab87ab863f917e187a4aeL51)) was renamed to `beginRefreshingProgramatically` and the old call was left in one place [here](2e1707d0e6 (diff-cfafa8d7e42ab87ab863f917e187a4aeR47)).

Now, I am not sure what kind of jumping the mentioned commit was fixing, but since this fix only concerns the initial render, I believe it will not influence the jumping fix.

I have tested this locally in my app, can provide a video if needed.

none

 [IOS] [BUGFIX] [RefreshControl] - Make sure refreshControl shows up on initial render if specified
Closes https://github.com/facebook/react-native/pull/17727

Differential Revision: D6827402

Pulled By: shergin

fbshipit-source-id: 25849244e87af54f25d636b6ade7adcf88958980
2018-01-28 22:29:51 -08:00
Valentin Shergin 2716f53220 The New <Text> on iOS
Summary:
This is a complete rewrite of RCTText, the part of React Native which manages Text and TextInput components.

Key points:

* It's understandable now. It follows a simple architectural pattern, and it's easy to debug and iterate. Text flow layout is a first-class citizen in React Native layout system now, not just a wired special case. It also brings entirely new possibilities such as nested interleaving <Text> and <View> components.
* All <Text>-specific APIs were removed from UIManager and co (it's about ~16 public methods which were used exclusively only by <Text>).
* It relies on new Yoga measurement/cloning API and on-dirty handler. So, it removes built-in dirty propagation subsystem from RN completely.
* It caches string fragments properly and granularly on a per-node basis which makes updating text-containing components more performant.
* It does not instantiate UIView for virtual components which reduces memory utilization.
* It drastically improves <TextInput> capabilities (e.g. rich text inside single line <TextInput> is now supported).

Screenshots:
https://cl.ly/2j3r1V0L0324
https://cl.ly/3N2V3C3d3q3R

Reviewed By: mmmulani

Differential Revision: D6617326

fbshipit-source-id: 35d4d81b35c9870e9557d0211c0e934e6072a41e
2018-01-24 00:03:01 -08:00
Spencer Ahrens 65184ec6b0 rename and extend new maintain visible content position feature
Summary:
Builds off of cae7179c94

- Make the prop a dictionary for more configuration options
- Rename `maintainPositionAtOrBeyondIndex` -> `maintainVisibleContentPosition` + `minIndexForVisible`
- Add autoscroll threshold feature

Given the async native of RN JS and background layout, there is no way to trigger the scrollTo from JS without risking a delay, so we add the feature in native code.

== Test Plan ==
ScrollViewExample:
https://youtu.be/pmY8pxC9PRs

Reviewed By: shergin

Differential Revision: D6729160

fbshipit-source-id: 70f9bae460ce84567857a4f696da78ce9b3b834c
2018-01-18 14:01:50 -08:00
Valentin Shergin 6882132421 Introduced -[RCTShadowView contentFrame]
Summary:
Another trivial sugar/helper to access computed by Yoga layout metrics.
We will use it soon in the new Text render/layout engine.

Reviewed By: mmmulani

Differential Revision: D6671979

fbshipit-source-id: d36933415c2fa50bae5cc171434d8f0b281955b7
2018-01-16 12:57:46 -08:00