diff --git a/.ado/apple-pr.yml b/.ado/apple-pr.yml index 4c08133b46b5eb..8d269bddd1b272 100644 --- a/.ado/apple-pr.yml +++ b/.ado/apple-pr.yml @@ -7,6 +7,14 @@ pr: - master jobs: + - job: JavaScriptRNPR + displayName: JavaScript React Native PR + pool: + vmImage: macOS-10.14 + demands: ['xcode', 'sh', 'npm'] + steps: + - template: templates/apple-job-javascript.yml + - job: AppleRNPR displayName: Apple React Native PR strategy: diff --git a/.ado/templates/apple-job-javascript.yml b/.ado/templates/apple-job-javascript.yml new file mode 100644 index 00000000000000..9b94c7b0af543e --- /dev/null +++ b/.ado/templates/apple-job-javascript.yml @@ -0,0 +1,23 @@ +steps: + - script: 'brew bundle' + displayName: 'brew bundle' + + - script: brew link node@10 --overwrite --force + displayName: 'ensure node 10' + + - template: apple-xcode-select.yml + + - script: 'yarn install' + displayName: 'yarn install' + + - script: 'yarn test-ci' + displayName: 'yarn test-ci' + + - script: 'yarn flow' + displayName: 'yarn flow' + + - script: 'yarn lint' + displayName: 'yarn lint' + + - script: 'yarn format-check' + displayName: 'yarn format-check' \ No newline at end of file diff --git a/.flowconfig b/.flowconfig index dc6ca1f4724f9c..254d70da817444 100644 --- a/.flowconfig +++ b/.flowconfig @@ -1,7 +1,6 @@ [ignore] ; We fork some components by platform .*/*[.]android.js -.*/*[.]macos.js ; Ignore templates for 'react-native init' /template/.* diff --git a/Libraries/Components/ScrollView/ScrollView.js b/Libraries/Components/ScrollView/ScrollView.js index 52177f32bcc72f..51801537fcd816 100644 --- a/Libraries/Components/ScrollView/ScrollView.js +++ b/Libraries/Components/ScrollView/ScrollView.js @@ -31,7 +31,6 @@ import type { PressEvent, ScrollEvent, LayoutEvent, - KeyboardEvent, } from '../../Types/CoreEventTypes'; import type {EdgeInsetsProp} from '../../StyleSheet/EdgeInsetsPropType'; import type {NativeMethodsMixinType} from '../../Renderer/shims/ReactNativeTypes'; @@ -883,58 +882,61 @@ class ScrollView extends React.Component { } // [TODO(macOS ISS#2323203) - _handleKeyDown = (e: KeyboardEvent) => { - if (this.props.onKeyDown) { - this.props.onKeyDown(e); + _handleKeyDown = (event: ScrollEvent) => { + if (this.props.onScrollKeyDown) { + this.props.onScrollKeyDown(event); } else { - const event = e.nativeEvent; - const key = event.key; - const kMinScrollOffset = 10; - if (Platform.OS === 'macos') { + const nativeEvent = event.nativeEvent; + const key = nativeEvent.key; + const kMinScrollOffset = 10; if (key === 'PAGE_UP') { this._handleScrollByKeyDown(event, { - x: event.contentOffset.x, - y: event.contentOffset.y + -event.layoutMeasurement.height, + x: nativeEvent.contentOffset.x, + y: + nativeEvent.contentOffset.y + + -nativeEvent.layoutMeasurement.height, }); } else if (key === 'PAGE_DOWN') { this._handleScrollByKeyDown(event, { - x: event.contentOffset.x, - y: event.contentOffset.y + event.layoutMeasurement.height, + x: nativeEvent.contentOffset.x, + y: + nativeEvent.contentOffset.y + + nativeEvent.layoutMeasurement.height, }); } else if (key === 'LEFT_ARROW') { this._handleScrollByKeyDown(event, { x: - event.contentOffset.x + - -(this.props.horizontalLineScroll === undefined + nativeEvent.contentOffset.x + + -(this.props.horizontalLineScroll !== undefined ? this.props.horizontalLineScroll : kMinScrollOffset), - y: event.contentOffset.y, + y: nativeEvent.contentOffset.y, }); } else if (key === 'RIGHT_ARROW') { this._handleScrollByKeyDown(event, { x: - event.contentOffset.x + - (this.props.horizontalLineScroll === undefined + nativeEvent.contentOffset.x + + (this.props.horizontalLineScroll !== undefined ? this.props.horizontalLineScroll : kMinScrollOffset), - y: event.contentOffset.y, + y: nativeEvent.contentOffset.y, }); } else if (key === 'DOWN_ARROW') { this._handleScrollByKeyDown(event, { - x: event.contentOffset.x, + x: nativeEvent.contentOffset.x, y: - event.contentOffset.y + - (this.props.verticalLineScroll === undefined + nativeEvent.contentOffset.y + + (this.props.verticalLineScroll !== undefined ? this.props.verticalLineScroll : kMinScrollOffset), }); } else if (key === 'UP_ARROW') { this._handleScrollByKeyDown(event, { - x: event.contentOffset.x, + x: nativeEvent.contentOffset.x, y: - event.contentOffset.y + - -(this.props.verticalLineScroll === undefined + nativeEvent.contentOffset.y + + -(this.props.verticalLineScroll !== undefined ? this.props.verticalLineScroll : kMinScrollOffset), }); @@ -943,11 +945,13 @@ class ScrollView extends React.Component { } }; - _handleScrollByKeyDown = (e: ScrollEvent, newOffset) => { + _handleScrollByKeyDown = (event: ScrollEvent, newOffset) => { const maxX = - e.nativeEvent.contentSize.width - e.nativeEvent.layoutMeasurement.width; + event.nativeEvent.contentSize.width - + event.nativeEvent.layoutMeasurement.width; const maxY = - e.nativeEvent.contentSize.height - e.nativeEvent.layoutMeasurement.height; + event.nativeEvent.contentSize.height - + event.nativeEvent.layoutMeasurement.height; this.scrollTo({ x: Math.max(0, Math.min(maxX, newOffset.x)), y: Math.max(0, Math.min(maxY, newOffset.y)), @@ -1133,7 +1137,7 @@ class ScrollView extends React.Component { // Override the onContentSizeChange from props, since this event can // bubble up from TextInputs onContentSizeChange: null, - onKeyDown: this._handleKeyDown, // TODO(macOS ISS#2323203) + onScrollKeyDown: this._handleKeyDown, // TODO(macOS ISS#2323203) onLayout: this._handleLayout, onMomentumScrollBegin: this._scrollResponder .scrollResponderHandleMomentumScrollBegin, diff --git a/Libraries/Components/View/ViewPropTypes.js b/Libraries/Components/View/ViewPropTypes.js index 08ec9b08782b23..36df10f4627453 100644 --- a/Libraries/Components/View/ViewPropTypes.js +++ b/Libraries/Components/View/ViewPropTypes.js @@ -14,7 +14,7 @@ import type { PressEvent, Layout, LayoutEvent, - KeyboardEvent, + ScrollEvent, // TODO(macOS ISS#2323203) } from '../../Types/CoreEventTypes'; import type {EdgeInsetsProp} from '../../StyleSheet/EdgeInsetsPropType'; import type {Node} from 'react'; @@ -58,10 +58,10 @@ type DirectEventProps = $ReadOnly<{| onDoubleClick?: ?(event: SyntheticEvent<{}>) => mixed, // TODO(macOS ISS#2323203) /** - * When `accessible` is true, the system will try to invoke this function + * When `acceptsKeyboardFocus` is true, the system will try to invoke this function * when the user performs accessibility key down gesture. */ - onKeyDown?: ?(event: KeyboardEvent) => mixed, // TODO(macOS ISS#2323203) + onScrollKeyDown?: ?(event: ScrollEvent) => mixed, // TODO(macOS ISS#2323203) onMouseEnter?: (event: SyntheticEvent<{}>) => mixed, // [TODO(macOS ISS#2323203) diff --git a/Libraries/Lists/VirtualizedList.js b/Libraries/Lists/VirtualizedList.js index d7bbc9d2b32742..eb7b794ffae433 100644 --- a/Libraries/Lists/VirtualizedList.js +++ b/Libraries/Lists/VirtualizedList.js @@ -34,6 +34,7 @@ import type { ViewToken, ViewabilityConfigCallbackPair, } from './ViewabilityHelper'; +import type {ScrollEvent} from '../Types/CoreEventTypes'; // TODO(macOS ISS#2323203) type Item = any; @@ -1098,7 +1099,7 @@ class VirtualizedList extends React.PureComponent { } _defaultRenderScrollComponent = props => { - let keyEventHandler = this.props.onKeyDown; // [TODO(macOS ISS#2323203) + let keyEventHandler = this.props.onScrollKeyDown; // [TODO(macOS ISS#2323203) if (!keyEventHandler) { keyEventHandler = this.props.enableSelectionOnKeyPress ? this._handleKeyDown @@ -1119,7 +1120,7 @@ class VirtualizedList extends React.PureComponent { // $FlowFixMe Invalid prop usage { ); } else { // $FlowFixMe Invalid prop usage - return ; // TODO(macOS ISS#2323203) + return ; // TODO(macOS ISS#2323203) } }; @@ -1280,7 +1281,7 @@ class VirtualizedList extends React.PureComponent { } }; - _handleKeyDown = e => { + _handleKeyDown = (e: ScrollEvent) => { if (this.props.onKeyDown) { this.props.onKeyDown(e); } else { diff --git a/Libraries/Lists/VirtualizedSectionList.js b/Libraries/Lists/VirtualizedSectionList.js index 81c988b09dd84c..d2e26533f7cbb6 100644 --- a/Libraries/Lists/VirtualizedSectionList.js +++ b/Libraries/Lists/VirtualizedSectionList.js @@ -21,6 +21,7 @@ import type { Props as VirtualizedListProps, SelectedRowIndexPathType, // TODO(macOS ISS#2323203) } from './VirtualizedList'; +import type {ScrollEvent} from '../Types/CoreEventTypes'; // TODO(macOS ISS#2323203) type Item = any; @@ -296,7 +297,7 @@ class VirtualizedSectionList< this._listRef.ensureItemAtIndexIsVisible(index); }; - _handleKeyDown = e => { + _handleKeyDown = (e: ScrollEvent) => { if (Platform.OS === 'macos') { const event = e.nativeEvent; const key = event.key; @@ -339,7 +340,7 @@ class VirtualizedSectionList< }; // ]TODO(macOS ISS#2323203) render() { - let keyEventHandler = this.props.onKeyDown; // [TODO(macOS ISS#2323203) + let keyEventHandler = this.props.onScrollKeyDown; // [TODO(macOS ISS#2323203) if (!keyEventHandler) { keyEventHandler = this.props.enableSelectionOnKeyPress ? this._handleKeyDown @@ -349,7 +350,7 @@ class VirtualizedSectionList< // TODO(macOS ISS#2323203) ); diff --git a/Libraries/Lists/__tests__/__snapshots__/FlatList-test.js.snap b/Libraries/Lists/__tests__/__snapshots__/FlatList-test.js.snap index 15300dc3956ee5..a803418ba3a9fb 100644 --- a/Libraries/Lists/__tests__/__snapshots__/FlatList-test.js.snap +++ b/Libraries/Lists/__tests__/__snapshots__/FlatList-test.js.snap @@ -36,13 +36,13 @@ exports[`FlatList renders all the bells and whistles 1`] = ` numColumns={2} onContentSizeChange={[Function]} onEndReachedThreshold={2} - onKeyDown={null} onLayout={[Function]} onMomentumScrollEnd={[Function]} onRefresh={[MockFunction]} onScroll={[Function]} onScrollBeginDrag={[Function]} onScrollEndDrag={[Function]} + onScrollKeyDown={null} refreshControl={ , zoomScale?: number, responderIgnoreScroll?: boolean, + key?: string, // TODO(macOS) |}>, >; @@ -140,9 +141,3 @@ export type SwitchChangeEvent = SyntheticEvent< value: boolean, |}>, >; - -export type KeyboardEvent = SyntheticEvent< - $ReadOnly<{| - key: string, - |}>, ->; diff --git a/Libraries/Utilities/Platform.macos.js b/Libraries/Utilities/Platform.macos.js index 7f66dbfc91956d..1b8aea90a284ef 100644 --- a/Libraries/Utilities/Platform.macos.js +++ b/Libraries/Utilities/Platform.macos.js @@ -1,10 +1,10 @@ /** - * Copyright (c) 2015-present, Facebook, Inc. + * Copyright (c) Facebook, Inc. and its affiliates. * * This source code is licensed under the MIT license found in the * LICENSE file in the root directory of this source tree. * - * @providesModule Platform + * @format * @flow */ diff --git a/Libraries/YellowBox/UI/YellowBoxList.js b/Libraries/YellowBox/UI/YellowBoxList.js index 220ca53faa8ee9..f3ba0249f5b3ed 100644 --- a/Libraries/YellowBox/UI/YellowBoxList.js +++ b/Libraries/YellowBox/UI/YellowBoxList.js @@ -73,7 +73,7 @@ class YellowBoxList extends React.Component { } const listStyle = { - width: Platform.OS === 'win32' ? '85%' : undefined, + width: Platform.OS === 'win32' ? '85%' : undefined, // TODO(windows ISS) height: // Additional `0.5` so the (N + 1)th row can peek into view. Math.min(items.length, MAX_ITEMS + 0.5) * @@ -130,7 +130,7 @@ const styles = StyleSheet.create({ width: '100%', }, dismissAll: { - bottom: Platform.OS === 'win32' ? 0 : '100%', + bottom: Platform.OS === 'win32' ? 0 : '100%', // TODO(windows ISS) flexDirection: 'row', justifyContent: 'flex-end', paddingBottom: 4, diff --git a/Libraries/polyfills/console.js b/Libraries/polyfills/console.js index de76df6e3bb2be..a0ca8523656296 100644 --- a/Libraries/polyfills/console.js +++ b/Libraries/polyfills/console.js @@ -561,6 +561,7 @@ if (global.nativeLoggingHook) { // the condition if (methodName === 'assert') { if (!arguments[0] && originalConsole.hasOwnProperty('assert')) { + // TODO(macOS ISS#2323203) originalConsole.assert(...arguments); } } else { diff --git a/RNTester/js/AlertMacOSExample.macos.js b/RNTester/js/AlertMacOSExample.js similarity index 100% rename from RNTester/js/AlertMacOSExample.macos.js rename to RNTester/js/AlertMacOSExample.js diff --git a/RNTester/js/RNTesterExampleList.js b/RNTester/js/RNTesterExampleList.js index 3fb00c16f94d4f..6421260ca266d1 100644 --- a/RNTester/js/RNTesterExampleList.js +++ b/RNTester/js/RNTesterExampleList.js @@ -57,7 +57,7 @@ class RowComponent extends React.PureComponent<{ onShowUnderlay={this.props.onShowUnderlay} onHideUnderlay={this.props.onHideUnderlay} onAccessibilityTap={this._onPress} - acceptsKeyboardFocus={false} + acceptsKeyboardFocus={false} // TODO(macOS ISS#2323203) onPress={this._onPress}> {item.module.title} @@ -109,6 +109,7 @@ class RNTesterExampleList extends React.Component { itemShouldUpdate={this._itemShouldUpdate} keyboardShouldPersistTaps="handled" acceptsKeyboardFocus={true} // TODO(macOS ISS#2323203) + onSelectionEntered={this._handleOnSelectionEntered} // TODO(macOS ISS#2323203) enableSelectionOnKeyPress={true} // TODO(macOS ISS#2323203) automaticallyAdjustContentInsets={false} keyboardDismissMode="on-drag" diff --git a/RNTester/js/RNTesterList.macos.js b/RNTester/js/RNTesterList.macos.js index c60d8014b29c42..64bbaf3ff3a4a5 100644 --- a/RNTester/js/RNTesterList.macos.js +++ b/RNTester/js/RNTesterList.macos.js @@ -10,11 +10,7 @@ 'use strict'; -export type RNTesterExample = { - key: string, - module: Object, - supportsTVOS: boolean, -}; +import type {RNTesterExample} from './Shared/RNTesterTypes'; const ComponentExamples: Array = [ { diff --git a/RNTester/js/ScrollViewExample.js b/RNTester/js/ScrollViewExample.js index c6c28afb1e2b47..507539b29693a6 100644 --- a/RNTester/js/ScrollViewExample.js +++ b/RNTester/js/ScrollViewExample.js @@ -39,6 +39,7 @@ exports.examples = [ // $FlowFixMe Invalid prop usage _scrollView = scrollView; }} + acceptsKeyboardFocus={true} // TODO(macOS ISS#2323203) automaticallyAdjustContentInsets={false} onScroll={() => { console.log('onScroll!'); diff --git a/React/Views/ScrollView/RCTScrollView.h b/React/Views/ScrollView/RCTScrollView.h index 473f45197bc273..5be49a90c184c5 100644 --- a/React/Views/ScrollView/RCTScrollView.h +++ b/React/Views/ScrollView/RCTScrollView.h @@ -66,7 +66,7 @@ @property (nonatomic, copy) RCTDirectEventBlock onScrollEndDrag; @property (nonatomic, copy) RCTDirectEventBlock onMomentumScrollBegin; @property (nonatomic, copy) RCTDirectEventBlock onMomentumScrollEnd; -@property (nonatomic, copy) RCTDirectEventBlock onKeyDown; // TODO(macOS ISS#2323203) +@property (nonatomic, copy) RCTDirectEventBlock onScrollKeyDown; // TODO(macOS ISS#2323203) - (void)flashScrollIndicators; // TODO(macOS ISS#2323203) diff --git a/React/Views/ScrollView/RCTScrollView.m b/React/Views/ScrollView/RCTScrollView.m index 5914014f60b06e..b10fb3510eccbe 100644 --- a/React/Views/ScrollView/RCTScrollView.m +++ b/React/Views/ScrollView/RCTScrollView.m @@ -1408,7 +1408,7 @@ - (void)keyDown:(UIEvent*)theEvent if (self == [[self window] firstResponder] && theEvent.keyCode != 48) { NSString *keyCommand = [self keyCommandFromKeyCode:theEvent.keyCode]; - RCT_SEND_SCROLL_EVENT(onKeyDown, (@{ @"key": keyCommand})); + RCT_SEND_SCROLL_EVENT(onScrollKeyDown, (@{ @"key": keyCommand})); } else { [super keyDown:theEvent]; diff --git a/React/Views/ScrollView/RCTScrollViewManager.m b/React/Views/ScrollView/RCTScrollViewManager.m index 5e0f074a826a9f..c9d554ff12375a 100644 --- a/React/Views/ScrollView/RCTScrollViewManager.m +++ b/React/Views/ScrollView/RCTScrollViewManager.m @@ -100,7 +100,7 @@ - (RCTPlatformView *)view RCT_EXPORT_VIEW_PROPERTY(onMomentumScrollBegin, RCTDirectEventBlock) RCT_EXPORT_VIEW_PROPERTY(onMomentumScrollEnd, RCTDirectEventBlock) RCT_EXPORT_VIEW_PROPERTY(DEPRECATED_sendUpdatedChildFrames, BOOL) -RCT_EXPORT_OSX_VIEW_PROPERTY(onKeyDown, RCTDirectEventBlock) // TODO(macOS ISS#2323203) +RCT_EXPORT_OSX_VIEW_PROPERTY(onScrollKeyDown, RCTDirectEventBlock) // TODO(macOS ISS#2323203) #if defined(__IPHONE_OS_VERSION_MAX_ALLOWED) && __IPHONE_OS_VERSION_MAX_ALLOWED >= 110000 /* __IPHONE_11_0 */ RCT_EXPORT_VIEW_PROPERTY(contentInsetAdjustmentBehavior, UIScrollViewContentInsetAdjustmentBehavior) #endif