Commit Graph

2176 Commits

Author SHA1 Message Date
Héctor Ramos 1151c096da Update copyright headers to yearless format
Summary: This change drops the year from the copyright headers and the LICENSE file.

Reviewed By: yungsters

Differential Revision: D9727774

fbshipit-source-id: df4fc1e4390733fe774b1a160dd41b4a3d83302a
2018-09-11 15:33:07 -07:00
Kevin Gozali 6052e97ba7 Added RCTJSINativeModule protocol to allow enabling JSI-bound nativemodule
Summary:
Instead of asking existing modules to implement `+allowJSIBinding`, introduce a temporary "empty" protocol so modules can just adopt it for migration purpose.

Eventually this protocol may just go away.

Modules need to adopt both `RCTBridgeModule` and `RCTJSINativeModule` for time being for backward compatibility.

p.s. the entire system isn't enabled yet, this is just some of the pre-reqs for NativeModule improvements.

Reviewed By: mmmulani

Differential Revision: D9762913

fbshipit-source-id: 470f640f11a5991e5cfa9c48a1931da660ebfcd2
2018-09-11 12:17:26 -07:00
Lindsay Winkler 0bf56e0746 Add the new RCTWKWebView* files to build target on iOS (#21031)
Summary:
These files support backing a `WebView` component with the WebKit-based
`WKWebView` on iOS.  These files need to be included in the Xcode
build target so that they are compiled, linked and ultimately available
to the UIManager at runtime, so that the correct views can be instantiated
when a `WebView` is passed the prop `useWebKit={true}`.
Pull Request resolved: https://github.com/facebook/react-native/pull/21031

Differential Revision: D9762185

Pulled By: hramos

fbshipit-source-id: 0d699e40afd56041cbbb76d77f11ba6932403d6d
2018-09-10 18:17:30 -07:00
Valentin Shergin 37d19aaae3 Fabric: Unification of props management in RCTViewComponentView and subclasses
Summary:
* Now all `RCTViewComponentView` subclasses are required to set `_props` instance variable in the constructor with a default value;
* `RCTViewComponentView`'s `_props` instance variable now has `ShadredViewProps` type (that enforced by `static_assert` in `ConcreteViewShadowNode` template);
* New we use `static_pointer_cast` instead of `dynamic_pointer_cast` for casting props.

Reviewed By: mdvacca

Differential Revision: D9734199

fbshipit-source-id: b0a0939c936f8b5b540fa5fa1e4a2f1037346fc5
2018-09-10 16:50:02 -07:00
Ramanpreet Nara 7eb82f32a2 Implement onPress for Virtual Text nodes
Summary:
When text nodes are nested, as below, `onPress` handlers need to be correctly invoked:
```
render() {
  return (
    <Text onPress={() => console.warn('hi')}>
      hi
      <Text onPress={() => console.warn('ramanpreet')}>ramanpreet</Text>
    </Text>
  );
}
```

In the above example, clicking on "hi" should warn "hi", and clicking on "ramanpreet" should warn "ramanpreet". This diff implements that behaviour.

Reviewed By: shergin

Differential Revision: D9696905

fbshipit-source-id: 2daf24e76c3b3c37aa36cd1540e54876a367faf7
2018-09-10 11:41:36 -07:00
Ramanpreet Nara 74c24147e2 Modify `RCTTouchableComponentViewProtocol` to get touch event emitter at point
Summary:
This diff includes two changes:
1. Even though `RCTViewComponentView` conforms to `RCTTouchableComponentViewProtocol`, it never implemented this protocol. This diff makes the correction.
2. Make the necessary changes to `RCTSurfaceTouchHandler` required by the changes in `RCTTouchableComponentViewProtocol`. This means modifying the `ActiveTouch` struct to hold `SharedTouchEventEmitter`s. It also means passing in the touch point to the `componentView`'s `touchEventEmitterAtPoint` method.

Reviewed By: shergin

Differential Revision: D9696909

fbshipit-source-id: 3d4a833f7dbae6d0238a0807eb2220250ccbae3d
2018-09-10 11:41:33 -07:00
Valentin Shergin db9b468dd1 Fabric: `[RCTViewComponentView betterHitTest:]` proper support for `clipToBounds` and `zIndex`
Summary:
@public
Besides `pointerEvents` there are other two props that affect hit-testing mechanism: `zIndex` and `clipToBounds`.
The default UIKit implementation does not take this into an account (it always assume that `clipToBounds` is true and `zIndex` is same). `betterHitTest` does it right.

Reviewed By: sahrens

Differential Revision: D9688876

fbshipit-source-id: dadfd5e5541ddd1a744fbd8c6b10949c0e266069
2018-09-07 23:48:03 -07:00
Valentin Shergin dbf5bea3c1 Fabric: Custom `[RCTViewComponentView hitTest:]` that takes `pointerEvents` into an account
Summary:
@public
In RN we have special `pointerEvents` prop that controls whether the View can be the target of touch events.
This is a pretty straight-forward implementation of that.

Reviewed By: sahrens

Differential Revision: D9688877

fbshipit-source-id: 1524647b0a33e4dd14563f531d636469bf3bdef7
2018-09-07 23:48:02 -07:00
Valentin Shergin ff1b950e29 Fabric: Proper way to stop Fabric Surfaces
Summary:
@public
Apparently, we have to call `ReactFabric.unmountComponentAtNode(tag)` instead of `AppRegistry.unmountApplicationComponentAtRootTag(tag)`.

Reviewed By: sahrens

Differential Revision: D9652730

fbshipit-source-id: f56dba7dbe5421a7d939b91178db5104476fe550
2018-09-07 23:48:02 -07:00
Valentin Shergin d2186081b3 Fabric: RCTSurfaceRegistry now stores Surfaces as weak references
Summary:
@public
RCTSurfaceRegistry always promised this in the documentation but never actually did.

Reviewed By: sahrens

Differential Revision: D9652732

fbshipit-source-id: f3d06b95192e024273dc0e3a1c2753ca92370338
2018-09-07 23:48:02 -07:00
Kevin Gozali ce8125e434 iOS: update React.xcodeproj to remove NavigatorIOS
Summary: Follow up for 0df92afc1c -- the file refences need to be removed from Xcode project.

Reviewed By: shergin

Differential Revision: D9728433

fbshipit-source-id: ed4e69ff14413b1c4e64250c3f9716375d95fbc2
2018-09-07 15:32:18 -07:00
Valentin Shergin 2c3e4ec06b Fabric: `borderWidths` field was removed from ViewProps
Summary:
@public
Apperently, we don't need to store and parse this because we are already doing this for `yogaStyle` field.

Reviewed By: sahrens

Differential Revision: D9649549

fbshipit-source-id: a84a5518674f4c2d574a060cdbebb9562121f5f4
2018-09-07 11:17:53 -07:00
Valentin Shergin b960512a5e Fabric: Complete border drawing implementation in RCTViewComponentView
Summary:
@public
Now all configurations or border styles are supported by RCTViewComponentView (and all subclasses).

Reviewed By: sahrens

Differential Revision: D9631868

fbshipit-source-id: 3a5b141ac5ffa9c28f4ebb0718f2fc935b8f1a75
2018-09-07 11:17:53 -07:00
Valentin Shergin 16bd95b689 Expose `RCTBorderDrawing.h` as a public header
Summary:
@public
We will use that in RCTFabric module.

Reviewed By: sahrens

Differential Revision: D9631866

fbshipit-source-id: a8e4074189359ad6014d0506d6a1e020b5d0d330
2018-09-07 11:17:52 -07:00
Valentin Shergin ca1e9032a4 Fabric: Proper way to represent (and parse) borders in ViewProps
Summary:
@public
Previously, ViewProps class coundn't represent whole spectre of possible values of border metrics (e.g. the border color was unified).
Now it's complete and direction-specific.

Reviewed By: sahrens

Differential Revision: D9628361

fbshipit-source-id: 6d3b3d4d7e3008e2168cbca732ff99fe5ea595e8
2018-09-07 11:17:52 -07:00
Kevin Gozali 0df92afc1c Remove NavigatorIOS
Summary:
Legacy navigator impl. There are other alternatives that should be used instead.

Part of the slimmening effort as described here: https://github.com/react-native-community/discussions-and-proposals/issues/6

Reviewed By: TheSavior

Differential Revision: D9677824

fbshipit-source-id: 24ae500751d2a8c398f246d36604a58f0b3c113b
2018-09-07 10:26:20 -07:00
Zack Gomez 5eaa2d29c0 Fix inability to remove 'Disabled' state from AccessibilityStates
Summary:
D8842691 split AccessibilityTraits into multiple RN properties.  However, the accessor code did not support REMOVING traits.
This results in buttons that were disabled (AccessibilityTraits & NotEnabled === true) never being enabled.

Fix the issue by making the split accessors properly mask in the bits, allowing you unset them without disturbing bits managed by the other accessor.

NOTE: setting AccessibilityTraits and AccessibilityRole or AccessibilityStates will still result in bugs.

Reviewed By: shergin

Differential Revision: D9661970

fbshipit-source-id: 77d70dd0754f2eaf8cbf895bfc13757c697a76d8
2018-09-07 10:26:19 -07:00
Valentin Shergin 0792fba63f Fabric: Using ShadowView instead of ShadowNode in Mutations
Summary:
@public
This is quite a big diff but the actual meaningful change is simple: now we use ShadowView class instead of ShadowNode in mutation instructions.
Note:
 * In some places (especially during diffing) we have to operate with ShadowNodeViewPair objects (which represents a pair of ShadowNode and ShadowView). The reason for that is that we cannot construct child ShadowViews from parent ShadowViews because they don't have any information about children.
 * `ShadowTree::emitLayoutEvents` is now much simpler because ShadowView better represents the specifics of this kind of object.
 * The code in RCTMountingManager also became simpler.

This change will allow us to implement more cool tricks soon.

Reviewed By: mdvacca

Differential Revision: D9403564

fbshipit-source-id: dbc7c61af250144d6c7335a01dc30df0005559a2
2018-09-03 23:04:20 -07:00
Oleg Lokhvitsky 5f48d28119 ScrollView snapToStart/snapToEnd
Summary: Added `snapToStart` and `snapToEnd` props to ScrollView which work together with `snapToOffsets` and determine whether the beginning and end of the list automatically count as snap offsets or not. If not, the list is allowed to free-scroll between its start/end and the first/last snap offset.

Reviewed By: sahrens

Differential Revision: D9442386

fbshipit-source-id: 47a5fdb20f884542434b01b1f0a486ed2b478c6e
2018-08-30 13:04:50 -07:00
Oleg Lokhvitsky fd744dd56c ScrollView snapToOffsets
Summary:
* Added snapToOffsets prop to ScrollView. Allows snapping at arbitrary points.

* Fixed pagingEnabled not being overridden by snapToInterval on iOS.

* Fixed Android *requiring* pagingEnabled to be defined alongside snapToInterval.
* Added support for decelerationRate on Android.

* Fixed snapping implementation. It was not calculating end position correctly at all (velocity is not a linear offset).
  * Resolves https://github.com/facebook/react-native/issues/20155
* Added support for new content being added during scroll (mirrors existing functionality in vertical ScrollView).

* Added support for snapToInterval.
  * Resolves https://github.com/facebook/react-native/issues/19552

Reviewed By: yungsters

Differential Revision: D9405703

fbshipit-source-id: b3c367b8079e6810794b0165dfdbcff4abff2eda
2018-08-30 13:04:50 -07:00
Kevin Gozali 6a1f48e06d TM iOS: rollout strategy 1 - added RCTEnableJSINativeModule(BOOL)
Summary:
To be able to test out new approach for NativeModules, introduce a simple runtime flag to enable the new system (doesn't exist yet). In addition, each module should declare a static `+ (BOOL)allowJSIBinding` in the objc class to be considered for the new approach. Doing so skips the processing of the module during bridge startup.

Note: this doesn't do anything special for `- (NSArray *)extraModulesForBridge:(RCTBridge *)bridge` impl yet.

Differential Revision: D9554296

fbshipit-source-id: 3508db6589e9f72367f62aa7ca15fce3d3adda72
2018-08-29 15:48:59 -07:00
Valentin Shergin 961b6aceca Fabric: Unified event pipeline: connecting the dots
Summary:
@public
This diff basically wires everything up.

Reviewed By: mdvacca

Differential Revision: D8886227

fbshipit-source-id: fb1a1e3222b3d693a8c28ed780b14f7315b7c019
2018-08-27 07:32:38 -07:00
Valentin Shergin 26d0b05c80 Fabric: MessageQueueEventBeat
Summary:
@public
MessageQueueEventBeat implements particular Event Beat synchronized with Message Queue and calling a callback on the JS thread (aka Message Queue thread). The actual beat is synchronized with the main run loop.

Reviewed By: mdvacca

Differential Revision: D8886230

fbshipit-source-id: 97ef7d10f705789b4b0cd3a12389db960159f289
2018-08-27 07:32:34 -07:00
Valentin Shergin 57bbce9bd9 Fabric: Introducing EventBeat concept (and MainRunLoopEventBeat)
Summary:
@public
EventBeat is an abstraction around proper event scheduling combining proper timing and proper threading. Event Queues use Event Beat to ensure that events are delivered on proper threads and in proper timing (probably batched). Consumers can `request` the next beat and `induce` immediatly beat.
MainRunLoopEventBeat implements particular Event Beat synchronized with the main event loop and calling a callback on the main thread.

Reviewed By: mdvacca

Differential Revision: D8886229

fbshipit-source-id: 1a42fcbf4cd61c6cb4c502890566c98b00226f31
2018-08-27 07:32:34 -07:00
Vladimir Zdravkovic 3b688ae6b2 Updated the glog library version from 0.3.4 to 0.3.5 (#20811)
Summary:
While the original reason for this change was because of an issue #20780, with further investigation I concluded that the issue is till present for this combo of versions:
glog - 0.3.5
google-cast-sdk - 4.3.1

Downgrading google-cast-sdk to 4.3.0 fixed the build issue.

Release Notes:
--------------
Updated glog version from 0.3.4 to 0.3.5 for iOS

[IOS] [ENHANCEMENT] [GLOG]
Pull Request resolved: https://github.com/facebook/react-native/pull/20811

Differential Revision: D9485221

Pulled By: hramos

fbshipit-source-id: 65caf0839588384a5229a6165506dc6ef62e5fc5
2018-08-23 14:17:18 -07:00
Vladimir Timofeev 3949e937cc Make SafeAreaView to work on iOS < 11 (#18534)
Summary:
Currently `SafeAreaView` works only on iOS 11, because implemented in terms of native safeArea API, that not exists in older iOS versions. But this make it hard to use the component in real applications, because content will be under top bars on older versions of iOS and no reliable way to workaround this in js. More motivation in #17638

This changeset emulate safe area in terms of `UIViewController` layout guides API if safeArea not available.

Fixes #17638, #18255

I run RNTester with these simulators: iPhone6 (9.3), iPhone6 (10.0), iPhone6 (11.2), iPhoneX (11.2)
- Start RNTester application
- Look on top header, it should not overlap status bar
- Go to the `<SafeAreaView>` example, open modal
- Modal area should not overlap status bar

<img src="http://vovkasm.skitch.vovkasm.org/iPhone6_10_20662C5B.png" width="40%"> <img src="http://vovkasm.skitch.vovkasm.org/iPhone6_11_20662CC8.png" width="40%">

<img src="http://vovkasm.skitch.vovkasm.org/iPhone6_10_pr_20662DE6.png" width="40%"> <img src="http://vovkasm.skitch.vovkasm.org/iPhone6_11_pr_20662DA8.png" width="40%">

[IOS] [BUGFIX] [SafeAreaView] - Make SafeAreaView to work on iOS < 11
Pull Request resolved: https://github.com/facebook/react-native/pull/18534

Reviewed By: PeteTheHeat, shergin

Differential Revision: D9166052

Pulled By: hramos

fbshipit-source-id: c086e1ae4af13110a7453b770ca75b6e0d5321ea
2018-08-23 12:02:35 -07:00
Caleb (Rojuinex) Bartholomew 8103c431c8 Removing development team from Xcode project. (#20054)
Summary:
Fixes #16881

Removing development team from Xcode project.
Pull Request resolved: https://github.com/facebook/react-native/pull/20054

Differential Revision: D9440144

Pulled By: hramos

fbshipit-source-id: 5cb4cf24c5f7562632006f0d0143f762fed04295
2018-08-22 23:19:43 -07:00
Jeff Thomas 5c160e5ded Way to register RCT_MODULE in Plugin2.0 instead of +load
Summary:
[RFC] WIP: Way to register RCT_MODULE in Plugin2.0 instead of +load

This seemed like the simplest way to do this to register in the existing
didNotFindModule callback so that we don't have to touch any opensource code.

NOTE: The new version of this fixes the problems with dylibs, but not the -ObjC flag removal. This seems like the right call to avoid users having to implement c-functions to return their classes; instead we used objc_getClass.

Reviewed By: dshahidehpour

Differential Revision: D9112719

fbshipit-source-id: cf8df97d7c443cafa0e06a1e61bdf2612944ed87
2018-08-18 10:01:57 -07:00
Héctor Ramos bfa62d4bfb Fix old license that snuck into repo (#20702)
Summary:
Quick trivial PR to add back a necessary header. Fixes CI as well.
Pull Request resolved: https://github.com/facebook/react-native/pull/20702

Differential Revision: D9374430

Pulled By: hramos

fbshipit-source-id: dba0f1d4fc80e39242d8c3e6d1e0007492d2860d
2018-08-16 19:03:38 -07:00
Ramanpreet Nara 33b353c97c Gate usage of WebKit 10.0 APIs
Reviewed By: mmmulani

Differential Revision: D9362001

fbshipit-source-id: 62cde6bcc1f190c168973b173ce55c029328bfbf
2018-08-16 16:52:45 -07:00
Ramanpreet Nara 28b058c341 Dynamically load WebKit
Summary:
@public

We can't dynamically link `WebKit` because doing so will impact cold start of all our Apps.

This diff includes a few changes:
 1. Weakly link the `WebKit` framework in the `ReactInternal` library, so that the compiler doesn't die when it encounters a WebKit symbol.
 2. Undo dynamic linking of WebKit in Catalyst.
 3. Undo dynamic linking of WebKit in AdsManager
 4. Before the first `WKWebView` is instantiated, dynamically load the `WebKit` framework.

The end result of these changes is that WebKit will be loaded only when it's going to be used.

Reviewed By: mmmulani

Differential Revision: D6564328

fbshipit-source-id: a45a44e774d0c61c1fb578a6fa3d16bb08f68ac9
2018-08-16 16:52:45 -07:00
Ramanpreet Nara bacfd92976 Implement 'automaticallyAdjustContentInsets' and 'contentInset' props
Summary:
@public

This diff introduces two new props:
1. **automaticallyAdjustContentInsets**: Controls whether to adjust the content inset for web views that are placed behind a navigation bar, tab bar, or toolbar. The default value is true.
1. **contentInset**: The amount by which the web view content is inset from the edges of the scroll view. Defaults to {top: 0, left: 0, bottom: 0, right: 0}.

**Note:** There're some inconsistencies between how `UIWebView` and `WKWebView` render web pages with respect to the `contentInset` property. These two videos illustrate the problem:

**UIWebView**
[[ P58674349 | Playground.js ]]
https://pxl.cl/9R9V

**WKWebView**
[[ P58674348 | Playground.js ]]
https://pxl.cl/9R9W

Here's a stack overflow answer describing the problem: https://stackoverflow.com/a/35472603.

Reviewed By: shergin

Differential Revision: D6432181

fbshipit-source-id: aee6dac65d28435381ebec90519474b4707c7bab
2018-08-16 16:52:44 -07:00
Ramanpreet Nara 215fa14efc Implement 'backgroundColor' style
Summary:
@public

This diff implements background colors for the `RCTWKWebView` component by proxying the background color prop to the underlying `WKWebView` and its underlying `UIScrollView`.

There's few differences between `backgroundColor` in `RCTWebView` and `RCTWKWebView` implementations:
1. With `UIWebView,` the background color gets applied after the page loads. With `WKWebView`, this isn't necessarily true. This results in a white flicker on solid backgrounds because sometimes, the background color is set before the page loads. This video illustrates the problem: https://our.intern.facebook.com/intern/px/p/9QBH
1. As far as I can tell, `WKWebView` doesn't handle transparent backgrounds correctly. Either that, or I could be setting the background color incorrectly. I set the background color to `rgba(1, 1, 1, 0.5)` and recorded how both `RCTWebView` and `RCTWKWebView` render. These two videos indicate the differences:
**RCTWebView: Lighter background**
https://pxl.cl/9R13
**RCTWKWebView: Darker background**
https://pxl.cl/9R1b

I tried to replicate this on the web. According to [[ https://our.intern.facebook.com/intern/fiddle/zCHu/ | this fiddle ]], `RCTWebView` is correct. Clearly, RCTWKWebView is rendering transparent backgrounds a bit darker than necessary. This doesn't seem simple to debug, so I've created a task to document this work: T23815343. I'll get to it eventually.

Reviewed By: shergin

Differential Revision: D6398209

fbshipit-source-id: 1812cb68133bc18a3278f6b328d7b085362528b0
2018-08-16 16:52:44 -07:00
Ramanpreet Nara 1af17f1648 Implement 'dataDetectorTypes' prop
Summary:
When text is rendered in `WKWebView` WebKit component, the component itself can detect things like phone numbers, flight numbers, links, etc. and render them with additional functionality.

For example, when the text `apple.com` is detected, if the `link` data detector type is enabled, the web view will actually render a link that takes the user to the Apple home page.

In this diff, I implement the `dataDetectorTypes` prop. The data detector types supported are:
1. phoneNumber
1. link
1. address
1. calendarEvent
1. trackingNumber
1. flightNumber
1. lookupSuggestion

These enums are documented in the [[ https://developer.apple.com/documentation/webkit/wkdatadetectortypes | WKDataDetectorTypes docs ]].

Reviewed By: shergin

Differential Revision: D6392546

fbshipit-source-id: 4dd373f0ac52f898163cd959eeef6672e55b42a6
2018-08-16 16:52:44 -07:00
Ramanpreet Nara 721763020a Implement 'mediaPlaybackRequiresUserAction' prop
Summary:
HTML video elements can have the `autoplay` attribute, which forces them to play automatically whenever they load on the page.

In this diff, I introduce a new prop `mediaPlaybackRequiresUserAction`, which allows us to control whether video or audio element autoplays even when `autoplay` is set.

Reviewed By: shergin

Differential Revision: D6382256

fbshipit-source-id: 617508653910d600bc43f7f68c6dfd17ab1b6dd8
2018-08-16 16:52:44 -07:00
Ramanpreet Nara 4ca949b46e Implement 'allowsInlineMediaPlayback` prop
Summary:
For iPhones with small screen sizes (e.g: iPhone 5s), inside the `<WKWebView/>` component, videos will play in fullscreen mode. In this diff, I introduce a prop called `allowsInlineMediaPlayback` that when set to true, will allow videos to play inline.

**Note:** For videos to play inline, the HTML video element must also have a `playsinline` attribute on it.

Reviewed By: shergin

Differential Revision: D6379770

fbshipit-source-id: a0130720ffede6c24a90cad0c97a75b657d77017
2018-08-16 16:52:44 -07:00
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
Kevin Gozali f945212447 iOS downgrade error to warning when invoking native module with invalid bridge
Summary: A bunch of flows including JS reload and e2e tests seem to hit the race condition, causing redbox. For now, make it a warning to unblock.

Differential Revision: D9327418

fbshipit-source-id: a72b378d88f7566268fd9415fbd34225c8b931e7
2018-08-14 18:19:01 -07:00
Mehdi Mulani 66089bf150 Correctly find rootView when RCTTouchHandler is in a RCTSurface
Summary:
@public
I'm surprised this hasn't caused an issue earlier.
RCTTouchHandler is hooked up to RCTSurfaceView which itself contains a rootView. Thus when this calculation happens, a root view is never found.
We can't assign to the root view since it created and destroyed frequently, so it makes the most sense to look for the RCTSurfaceView here and treat it as a root view.

Reviewed By: fkgozali

Differential Revision: D9296840

fbshipit-source-id: ba5320583201f9d5c0176847cc6e6087b6a6459b
2018-08-13 11:32:17 -07:00
Alex Dvornikov 1cd9aa2dea Add REGISTER_JS_SEGMENT perf markers
Reviewed By: cwdick

Differential Revision: D9244289

fbshipit-source-id: 9004a0405f9622cbd0bbb837b99df32454f35bb8
2018-08-10 09:37:42 -07:00
Dexter eb1ce2816c Fix memory usage display in Perf Monitor (#19664)
Summary:
According to: https://github.com/apple/darwin-xnu/blob/master/osfmk/kern/bsd_kern.c#L420
The result is the same as Xcode app memory uesd.

Before Fix:

<img width="250" alt="before" src="https://user-images.githubusercontent.com/22233256/41394508-ce810362-6fdc-11e8-8d40-73703ec93bc3.png">
<img width="266" alt="before1" src="https://user-images.githubusercontent.com/22233256/41394511-d00a9a0e-6fdc-11e8-9f18-2198e8de2410.png">

After Fix:
<img width="270" alt="after" src="https://user-images.githubusercontent.com/22233256/41394517-d5a56ff2-6fdc-11e8-8d19-41e046c4b511.png">
<img width="267" alt="after1" src="https://user-images.githubusercontent.com/22233256/41394520-d7a3c600-6fdc-11e8-98c4-e3024a4532ec.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.
-->

[IOS] [BUGFIX] [Monitor] - fix memory perf monitor. Make sure the memory footprint is the same as Jetsam.

<!--
  **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
-->
Pull Request resolved: https://github.com/facebook/react-native/pull/19664

Differential Revision: D9246307

Pulled By: hramos

fbshipit-source-id: f85efc54cdcb0c19677594d465752c666d5af18b
2018-08-09 12:46:47 -07:00