Commit Graph

200 Commits

Author SHA1 Message Date
Tadeu Zagallo 4fc15dbf17 [ReactNative] Implement proper event coalescing 2015-05-27 20:41:20 -08:00
Nick Lockwood acc42e193d Big reduction in blending 2015-05-27 16:10:54 -08:00
Nick Lockwood 455281e44d Fixed crash in RCTContextExecutor when requireJSRef == undefined 2015-05-27 08:50:03 -08:00
Nick Lockwood 8d992262ed Fixed loading flicker on RCTRootView 2015-05-27 02:51:32 -08:00
Spencer Ahrens a4442e4576 [ReactNative] rename nativeProps const to NativeProps 2015-05-26 19:28:07 -08:00
Nick Lockwood 0689c0790e Fixed crash in RCTText due to NSTextContainer/NSLayoutManager being accessed concurrently from main and shadow queues 2015-05-26 18:52:46 -08:00
Brent Vatne 95517fca41 [RCTScrollView] Make ScrollView detect taps on sticky headers
Summary:
As per discussion with @nicklockwood in #875, make `RCTScrollView` check its sticky headers for hitTests first.

Closes https://github.com/facebook/react-native/pull/1415
Github Author: Brent Vatne <brent.vatne@madriska.com>

Test Plan:
 Have a sticky header in a ScrollView with a Touchable onPress action, scroll a bit after it docks and try tapping, should respond to tap.
2015-05-26 18:30:22 -08:00
Stan Chollet 76ea00483d TabBarIOS tintColor
Summary:
[Origin Pull request](https://github.com/facebook/react-native/pull/961) from [cmcewen](https://github.com/cmcewen)

All the work have been done by @cmcewen, I just rebased his work with the master.
Closes https://github.com/facebook/react-native/pull/1337
Github Author: Stan Chollet <stanislas.chollet@gmail.com>

Test Plan: Imported from GitHub, without a `Test Plan:` line.
2015-05-26 17:21:36 -08:00
Nick Lockwood e5b134368b Fixed crash due to nil backgroundColor 2015-05-26 12:59:24 -08:00
Alex Kotliarskyi cfa4b13472 [ReactNative] Element Inspector
Summary:
This adds new development feature to React Native that provides information
about selected element (see the demo in Test Plan).

This is how it works:

App's root component is rendered to a container that also has a hidden layer called
`<InspectorOverlay/>`. When activated, it shows full screen view and captures all
touches. On every touch we ask UIManager to find a view for given {x,y} coordinates.

Then, we use React's internals to find corresponding React component. `setRootInstance`
is used to remember the top level component to start search from, lmk if you have a
better idea how to do this. Given a component, we can climb up its owners tree
to provice more context on how/where the component is used.

In future we could use the `hierarchy` array to inspect and print their props/state.

Known bugs and limitations:
* InspectorOverlay sometimes receives touches with incorrect coordinates (wtf)
* Not integrated with React Chrome Devtools (maybe in followup diffs)
* Doesn't work with popovers (maybe put the element inspector into an `<Overlay/>`?)

@public

Test Plan:
https://www.facebook.com/pxlcld/mn5k
Works nicely with scrollviews
2015-05-26 11:19:49 -08:00
Nick Lockwood b7c669aa73 Fixed root view background color propagation 2015-05-26 04:18:55 -08:00
Alex Akers 81401064e5 [React Native] Fix view clipping when border radius is set 2015-05-26 02:17:07 -08:00
Tadeu Zagallo 9062bda79b [ReactNative] Add RCTAssertThread and restrict -[UIManager addUIBlock:] to _shadowQueue
Summary:
@public

Add `RCTAssertThread` to `RCTAssert.h` for convenience when checking the current/queue,
it accepts either a `NSString *`, `NSThread *` or `dispatch_queue_t` as the object to be checked

Also add a check to `-[RCTUIManager addUIBlock:]` - There was a discussion on github (https://github.com/facebook/react-native/issues/1365)
due to the weird behavior caused by calling it from a different thread/queue (it might be added after `batchDidComplete` has been called
and will just be dispatched on the next call from JS to objc)

Test Plan:
Change `-[RCTAnimationExperimentalManager methodQueue]` to return `dispatch_get_main_queue()` and run the 2048 example,
it should dispatch with a helpful message (screenshot on the comments)
2015-05-25 05:23:27 -08:00
Robert Payne c91e2eb567 Use JSC C API for better invocation speed
Summary:
This converts the existing JSEvaluateScript call for `require('<ModuleName>').<MethodName>.apply(null, <args>);` to native JSC C API methods which shaves off about 10-15% of invocation time on average, I used pretty primitive profiling methods to track the minimum, maximum and average invocation time so would appreciate any extra eyes on the performance.

If the argument count is zero the method is invoked directly with no arguments, if the argument count is 1 it's invoked directly with just that argument. If there is more than 1 argument then apply is used and the arguments are passed as the second parameter.

Ensured all existing tests pass and instruments leaks shows nothing is leaking.
Closes https://github.com/facebook/react-native/pull/1037
Github Author: Robert Payne <robertpayne@me.com>

Test Plan: Imported from GitHub, without a `Test Plan:` line.
2015-05-22 19:37:18 -08:00
Jared Forsyth aad54006e3 Observing "MemoryWarningNotification" and proxying it up to the DeviceEventEmitter 2015-05-22 13:09:56 -08:00
Nick Lockwood fe4b4c2d83 Optimised blending for translucent images with opaque background color + fixed cropping for images in cover/contain mode.
Summary:
@public

Our background color propagation mechanism is designed to make rendering of translucent content more efficient by pre-blending against an opaque background. Currently this only works for text however, because images are not composited into their background even if the background color is opaque.

This diff precomposites network images with their background color when the background is opaque, allowing them to take advantage of this performance optimization.

I've also added some logic to correctly crop the downloaded image when the resizeMode is "cover" or "contain" - previously it was only correct for "stretch".

Before:{F22437859}
After:{F22437862}

Test Plan: Run the UIExplorer "<ListView> - Paging" example with "color blended layers" enabled and observe that the images appear in green now, instead of red as they did before.
2015-05-22 07:19:06 -08:00
Tadeu Zagallo 08844e3ddc [ReactNative] Add fps monitor
Summary:
@public

Add basic JS and UI thread FPS monitor

Test Plan: Launch the UIExplorer, open the Dev Menu with cmd+D, and select `Show FPS Monitor`
2015-05-20 18:26:36 -08:00
Nick Lockwood 0d227c0eb2 Eliminated redundant border drawing 2015-05-20 12:19:24 -08:00
Georgiy Kassabli d211359aeb Added ability to set custom accessibility tap handler to React Native 2015-05-20 08:32:15 -08:00
Alex Akers a4f92ba3db [React Native] Add magic tap accessibility gesture 2015-05-19 06:28:01 -08:00
Georgiy Kassabli 6ef7eaf663 Added accessibility traits support to View class 2015-05-18 07:30:29 -08:00
Tadeu Zagallo a4e89d71a3 [ReactNative] Fix RCTBatchedBridge main thread invalidation
Summary:
D2052669 introduced a block for objects that had to be invalidated on the main
thread, but after the JS thread objects, but the block was being dispatched on
the JS thread.

@public

Test Plan:
I added `RCTAssertMainThread()` to the `mainThreadInvalidate` block, it was
crashing on reload, but now it should work as expected.
2015-05-17 18:27:20 -08:00
Christopher Chedeau 723e988416 [ReactNative] Redbox if JSC syntax errors 2015-05-15 15:33:17 -08:00
James Ide 2497c02e38 [RCTBridge] Have RCTBridge.loading return RCTBatchedBridge.loading
Summary:
The parent RCTBridge no longer tracks the JS loading since that has been handed off to the RCTBatchedBridge. To make the `loading` property accurate again, just expose the batch bridge's loading property from the parent bridge (note: I didn't make it KVO-compliant).

Fixes #1199
Closes https://github.com/facebook/react-native/pull/1200
Github Author: James Ide <ide@jameside.com>

Test Plan: Imported from GitHub, without a `Test Plan:` line.
2015-05-14 16:00:18 -08:00
Tadeu Zagallo e467fb7202 [ReactNative] Add console.profile hooks to systrace
Summary:
Add console.profile sync hooks compliant with the chrome API
https://developer.chrome.com/devtools/docs/console-api#consoleprofilelabel

@public

Test Plan:
Add a `console.profile()` and a `console.profileEnd()` in the JavaScript,
and record a systrace-like profile via DevMenu
2015-05-14 15:59:20 -08:00
Harrison Harnisch babdc21614 WebSocket polyfill
Summary:
- Added as a library in /Libraries/WebSocket
- Drag and drop to add to project (similar to adding Geolocation polyfill)
- Exposed as `window.WebSocket` which conforms with https://developer.mozilla.org/en-US/docs/Web/API/WebSocket specs
Closes https://github.com/facebook/react-native/pull/890
Github Author: Harrison Harnisch <hharnisc@gmail.com>

Test Plan: Imported from GitHub, without a `Test Plan:` line.
2015-05-14 09:37:02 -08:00
Dave Sibiski f865da26ba [NavigatorIOS] Fixes #1268 - Bug causing the leftButtonIcon to not appear
Summary:
Closes https://github.com/facebook/react-native/pull/1269
Github Author: Dave Sibiski <dsibiski@gmail.com>

Test Plan: Imported from GitHub, without a `Test Plan:` line.
2015-05-14 09:01:57 -08:00
Spencer Ahrens 81ad810186 [ReactNative] differentiate fatal and soft exceptions 2015-05-13 13:24:37 -07:00
Spencer Ahrens 1497e42fc5 [ReactNative] Properly support overflow: 'visible' on ScrollView
Summary:
We need to unset `clipsToBounds` on both the wrapper and the inner custom
scroll view

@public

Test Plan:
`overflow: 'visible'` actually shows content outside the `ScrollView`
(e.g. for full-bleed horizontal scrollers/carousels).  It doesn't pick up
touches though, which is a wider issue.
2015-05-13 13:24:37 -07:00
Alex Akers 86709c15cb [React Native] Support variable corner radii on RCTView 2015-05-13 13:24:37 -07:00
James Ide f40a7b4609 [Bridge] Make RCTJavaScriptDidFailToLoadNotification match DidLoad notif
Summary:
Add the RCTBatchedBridge object to the notification's userInfo for consistency with RCTJavaScriptDidLoadNotification, and set the target object to `_parentBridge`.

cc @nicklockwood @tadeuzagallo
Closes https://github.com/facebook/react-native/pull/1243
Github Author: James Ide <ide@jameside.com>

Test Plan: Imported from GitHub, without a `Test Plan:` line.
2015-05-13 13:24:37 -07:00
James Ide ba9ef00ab9 [RCTBridge] Clean up reload notification observer
Summary:
After the RCTBatchedBridge refactor, the `-[NSNotificationCenter addObserver]` and `[removeObserver]` calls got divided between RCTBridge and RCTBatchedBridge. This diff does two things:

 - Moved `removeObserver` out of RTCBatchedBridge and into `-[RCTBridge invalidate]`
 - Moved `addObserver` from `bindKeys` to `setUp`. This is so that `-[RCTBridge reload]` will re-add the observer after invalidating and removing the observer

cc @tadeuzagallo
Closes https://github.com/facebook/react-native/pull/1212
Github Author: James Ide <ide@jameside.com>

Test Plan: Imported from GitHub, without a `Test Plan:` line.
2015-05-13 13:24:37 -07:00
Nick Lockwood 6c812c8124 Fixed layout bug 2015-05-13 13:24:36 -07:00
Tadeu Zagallo d230629e61 [ReactNative] Add test to check RootContentView and BatchedBridge are deallocated 2015-05-13 13:24:36 -07:00
Tadeu Zagallo 92d7324f15 [ReactNative] Fix RootContentView release when the top-level bridge is held
Summary:
The RCTRootView creates a underlying RCTRootContentView that was deallocated when
the bridge modules were deallocated. That doesn't work when the bridge is held.

@public

Test Plan:
Launch Groups, put a breakpoint on `-[RCTRootContentView dealloc]`, enter and
leave a group page. It should be called now.
2015-05-13 13:24:36 -07:00
Tadeu Zagallo ef339250b5 [ReactNative] Add prompt to AlertIOS
Summary:
Add `AlertIOS.prompt`

It's compatible with the js spec, with the exception that I had to add
a callback param since it's async. Also supports the same button configuration
as `AlertIOS.alert`.

@public

Test Plan:
I've updated the `AlertIOS` example on UIExplorer with every
valid combination of
parameters, so just going through it should be fine.
2015-05-13 13:24:36 -07:00
Ben Alpert f8b36491d7 [react-native] Fix spelling of "cancelled"
Summary:
Apparently British spelling is "cancelled", American is "canceled"? Picking "cancelled" for consistency with UIKit.

@public

Test Plan: landcastle
2015-05-13 13:24:36 -07:00
Andrew Rasmussen 709aa5f259 Revert "[ReactNative] update Layout" 2015-05-13 13:24:35 -07:00
Krzysztof Magiera ff00e1496c [ReactNative] Rename ReactIOS JS module (and relatives) to ReactNative. 2015-05-13 13:24:35 -07:00
Alex Kotliarskyi 320208f4f7 Updates from Fri 8 May 2015-05-08 10:29:59 -07:00
Tadeu Zagallo ec9015d005 [ReactNative] Disable event deduping 2015-05-07 19:49:03 -08:00
Tadeu Zagallo 736d860571 [ReactNative] Fix RCTScrollView setContentInset 2015-05-07 16:56:02 -08:00
Jiajie Zhu 7b4ea51bf0 [madman] map - fix bug that onRegionChangeComplete stopped emitting 2015-05-07 16:16:27 -08:00
Spencer Ahrens 1ef4e00fba [ReactNative] Introduce onLayout events
Summary:
Simply add an `onLayout` callback to a native view component, and the callback
will be invoked with the current layout information when the view is mounted and
whenever the layout changes.

The only limitation is that scroll position and other stuff the layout system
isn't aware of is not taken into account.  This is because onLayout events
wouldn't be triggered for these changes and if they are desired they should be
tracked separately (e.g. with `onScroll`) and combined.

Also fixes some bugs with LayoutAnimation callbacks.

@public

Test Plan:
- Run new LayoutEventsExample in UIExplorer and see it work correctly.
- New integration test passes internally (IntegrationTest project seems busted).
- New jest test case passes.

{F22318433}

```
2015-05-06 15:45:05.848 [info][tid:com.facebook.React.JavaScript] "Running application "UIExplorerApp" with appParams: {"rootTag":1,"initialProps":{}}. __DEV__ === true, development-level warning are ON, performance optimizations are OFF"
2015-05-06 15:45:05.881 [info][tid:com.facebook.React.JavaScript] "received text layout event
", {"target":27,"layout":{"y":123,"x":12.5,"width":140.5,"height":18}}
2015-05-06 15:45:05.882 [info][tid:com.facebook.React.JavaScript] "received image layout event
", {"target":23,"layout":{"y":12.5,"x":122,"width":50,"height":50}}
2015-05-06 15:45:05.883 [info][tid:com.facebook.React.JavaScript] "received view layout event
", {"target":22,"layout":{"y":70.5,"x":20,"width":294,"height":204}}
2015-05-06 15:45:05.897 [info][tid:com.facebook.React.JavaScript] "received text layout event
", {"target":27,"layout":{"y":206.5,"x":12.5,"width":140.5,"height":18}}
2015-05-06 15:45:05.897 [info][tid:com.facebook.React.JavaScript] "received view layout event
", {"target":22,"layout":{"y":70.5,"x":20,"width":294,"height":287.5}}
2015-05-06 15:45:09.847 [info][tid:com.facebook.React.JavaScript] "layout animation done."
2015-05-06 15:45:09.847 [info][tid:com.facebook.React.JavaScript] "received image layout event
", {"target":23,"layout":{"y":12.5,"x":82,"width":50,"height":50}}
2015-05-06 15:45:09.848 [info][tid:com.facebook.React.JavaScript] "received view layout event
", {"target":22,"layout":{"y":110.5,"x":60,"width":214,"height":287.5}}
2015-05-06 15:45:09.862 [info][tid:com.facebook.React.JavaScript] "received text layout event
", {"target":27,"layout":{"y":206.5,"x":12.5,"width":120,"height":68}}
2015-05-06 15:45:09.863 [info][tid:com.facebook.React.JavaScript] "received image layout event
", {"target":23,"layout":{"y":12.5,"x":55,"width":50,"height":50}}
2015-05-06 15:45:09.863 [info][tid:com.facebook.React.JavaScript] "received view layout event
", {"target":22,"layout":{"y":128,"x":60,"width":160,"height":337.5}}
```
2015-05-07 12:27:44 -08:00
Tadeu Zagallo 6b38fad219 [ReactNative] Fix ref to eventDispatcher on RCTBridge 2015-05-07 09:05:29 -08:00
James Ide b97ce93cea [Nav] Add support for bar button icons and left buttons
Summary:
NavigatorIOS supports four new properties:

  - **rightButtonImageSource:** The source of an image to display in the top right. This must be a static image since UINavigationController only supports UIImages. Adding support for UIImageViews (or arbitrary views) is more complicated because custom views do not fade on touch and do not have hit slop the same way that UIImage buttons do. Usage: `rightButtonImageSource: ix('ImageName')`
  - **backButtonImageSource:** Use a custom image for the back button. This does not replace the back caret (`<`) but instead replaces the text next to it.
  - **leftButtonTitle**: Text for the left nav button, which supersedes the previous nav item's back button when specified. The main use case for this is your initial screen/UIVC which has nothing to go back to (since it is the first VC on the stack) but need to display a left button. This does hide the back button if there would have been one otherwise.
  - **leftButtonImageSource:** Image source for the left button, super
Closes https://github.com/facebook/react-native/pull/263
Github Author: James Ide <ide@jameside.com>

Test Plan: Imported from GitHub, without a `Test Plan:` line.
2015-05-07 08:03:21 -08:00
James Ide b8bf4d0957 [Loader] Post a notification when the JS fails to load
Summary:
This provides a way to get notified when a bridge fails to load JS, allowing apps to handle the error.

Closes https://github.com/facebook/react-native/pull/1085
Github Author: James Ide <ide@jameside.com>

Test Plan: run the UIExplorer app with the packager server not running, and verify that the notification is posted.
2015-05-07 04:26:24 -08:00
Nick Lockwood 205c22b915 Fixed dev menu loop 2015-05-07 03:55:43 -08:00
Nick Lockwood 47164baaec Fixed redbox error loop when camera access is disabled 2015-05-06 17:21:10 -08:00
Tadeu Zagallo 8d83b7ff63 [ReactNative] RCTWebViewExecutor - Fix string containing script tag support 2015-05-06 17:08:33 -08:00