From 08af206fa99d523c2b9fb96320ace18081aac4eb Mon Sep 17 00:00:00 2001 From: Tom Underhill Date: Fri, 29 Nov 2019 16:26:53 -0800 Subject: [PATCH 1/7] Fixed Flow, Lint, and Jest tests. Fixed broken macOS scroll key events. --- Libraries/Components/ScrollView/ScrollView.js | 29 ++++++++------- Libraries/Components/View/ViewPropTypes.js | 6 ++-- Libraries/Lists/VirtualizedList.js | 9 ++--- Libraries/Lists/VirtualizedSectionList.js | 7 ++-- .../__snapshots__/FlatList-test.js.snap | 8 ++--- .../__snapshots__/SectionList-test.js.snap | 10 +++--- .../VirtualizedList-test.js.snap | 24 ++++++------- .../VirtualizedSectionList-test.js.snap | 36 +++++++++++++++++++ Libraries/Types/CoreEventTypes.js | 7 +--- Libraries/Utilities/Platform.macos.js | 4 +-- Libraries/YellowBox/UI/YellowBoxList.js | 4 +-- Libraries/polyfills/console.js | 1 + RNTester/js/RNTesterExampleList.js | 3 +- RNTester/js/ScrollViewExample.js | 1 + React/Views/ScrollView/RCTScrollView.h | 2 +- React/Views/ScrollView/RCTScrollView.m | 2 +- React/Views/ScrollView/RCTScrollViewManager.m | 2 +- 17 files changed, 95 insertions(+), 60 deletions(-) diff --git a/Libraries/Components/ScrollView/ScrollView.js b/Libraries/Components/ScrollView/ScrollView.js index 52177f32bcc72f..512664386ba082 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,9 +882,9 @@ class ScrollView extends React.Component { } // [TODO(macOS ISS#2323203) - _handleKeyDown = (e: KeyboardEvent) => { - if (this.props.onKeyDown) { - this.props.onKeyDown(e); + _handleKeyDown = (e: ScrollEvent) => { + if (this.props.onScrollKeyDown) { + this.props.onScrollKeyDown(e); } else { const event = e.nativeEvent; const key = event.key; @@ -893,48 +892,48 @@ class ScrollView extends React.Component { if (Platform.OS === 'macos') { if (key === 'PAGE_UP') { - this._handleScrollByKeyDown(event, { + this._handleScrollByKeyDown(e, { x: event.contentOffset.x, y: event.contentOffset.y + -event.layoutMeasurement.height, }); } else if (key === 'PAGE_DOWN') { - this._handleScrollByKeyDown(event, { + this._handleScrollByKeyDown(e, { x: event.contentOffset.x, y: event.contentOffset.y + event.layoutMeasurement.height, }); } else if (key === 'LEFT_ARROW') { - this._handleScrollByKeyDown(event, { + this._handleScrollByKeyDown(e, { x: event.contentOffset.x + - -(this.props.horizontalLineScroll === undefined + -(this.props.horizontalLineScroll !== undefined ? this.props.horizontalLineScroll : kMinScrollOffset), y: event.contentOffset.y, }); } else if (key === 'RIGHT_ARROW') { - this._handleScrollByKeyDown(event, { + this._handleScrollByKeyDown(e, { x: event.contentOffset.x + - (this.props.horizontalLineScroll === undefined + (this.props.horizontalLineScroll !== undefined ? this.props.horizontalLineScroll : kMinScrollOffset), y: event.contentOffset.y, }); } else if (key === 'DOWN_ARROW') { - this._handleScrollByKeyDown(event, { + this._handleScrollByKeyDown(e, { x: event.contentOffset.x, y: event.contentOffset.y + - (this.props.verticalLineScroll === undefined + (this.props.verticalLineScroll !== undefined ? this.props.verticalLineScroll : kMinScrollOffset), }); } else if (key === 'UP_ARROW') { - this._handleScrollByKeyDown(event, { + this._handleScrollByKeyDown(e, { x: event.contentOffset.x, y: event.contentOffset.y + - -(this.props.verticalLineScroll === undefined + -(this.props.verticalLineScroll !== undefined ? this.props.verticalLineScroll : kMinScrollOffset), }); @@ -1133,7 +1132,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/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/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 From 496dac8f77e22f6f8e4136366e2b0f76913a5f2c Mon Sep 17 00:00:00 2001 From: Tom Underhill Date: Fri, 29 Nov 2019 16:48:08 -0800 Subject: [PATCH 2/7] Added ADO tests for jest, flow, lint, format-check --- .ado/apple-pr.yml | 8 ++++++++ .ado/templates/apple-pr-javascript.yml | 16 ++++++++++++++++ 2 files changed, 24 insertions(+) create mode 100644 .ado/templates/apple-pr-javascript.yml 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-pr-javascript.yml b/.ado/templates/apple-pr-javascript.yml new file mode 100644 index 00000000000000..157ac26ef78f89 --- /dev/null +++ b/.ado/templates/apple-pr-javascript.yml @@ -0,0 +1,16 @@ +steps: + - script: 'brew bundle' + + - script: brew link node@10 --overwrite --force + + - template: apple-xcode-select.yml + + - script: 'yarn install' + + - script: 'yarn test-ci' + + - script: 'yarn flow' + + - script: 'yarn lint' + + - script: 'yarn format-check' \ No newline at end of file From 51540cd559608aded869c5cd9e179c01d97d1e41 Mon Sep 17 00:00:00 2001 From: Tom Underhill Date: Fri, 29 Nov 2019 17:08:46 -0800 Subject: [PATCH 3/7] Rename yml file --- .../{apple-pr-javascript.yml => apple-job-javascript.yml} | 0 1 file changed, 0 insertions(+), 0 deletions(-) rename .ado/templates/{apple-pr-javascript.yml => apple-job-javascript.yml} (100%) diff --git a/.ado/templates/apple-pr-javascript.yml b/.ado/templates/apple-job-javascript.yml similarity index 100% rename from .ado/templates/apple-pr-javascript.yml rename to .ado/templates/apple-job-javascript.yml From 96ced9845e4893497b1f9cf204165cf6cec8b7b5 Mon Sep 17 00:00:00 2001 From: Tom Underhill Date: Fri, 29 Nov 2019 17:14:09 -0800 Subject: [PATCH 4/7] Added displayName's to the yml steps --- .ado/templates/apple-job-javascript.yml | 9 ++++++++- 1 file changed, 8 insertions(+), 1 deletion(-) diff --git a/.ado/templates/apple-job-javascript.yml b/.ado/templates/apple-job-javascript.yml index 157ac26ef78f89..9b94c7b0af543e 100644 --- a/.ado/templates/apple-job-javascript.yml +++ b/.ado/templates/apple-job-javascript.yml @@ -1,16 +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' \ No newline at end of file + - script: 'yarn format-check' + displayName: 'yarn format-check' \ No newline at end of file From b20f2a287abd542a393a63f5ac318dfebfd58f66 Mon Sep 17 00:00:00 2001 From: Tom Underhill Date: Sat, 30 Nov 2019 14:23:02 -0800 Subject: [PATCH 5/7] More flow fixes. macos specific files were being skipped in .flowconfig --- .flowconfig | 1 - .../js/{AlertMacOSExample.macos.js => AlertMacOSExample.js} | 0 RNTester/js/RNTesterList.macos.js | 6 +----- 3 files changed, 1 insertion(+), 6 deletions(-) rename RNTester/js/{AlertMacOSExample.macos.js => AlertMacOSExample.js} (100%) 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/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/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 = [ { From c296a53721abcea7d7622f64fdee21e497376a9e Mon Sep 17 00:00:00 2001 From: Tom Underhill Date: Sun, 1 Dec 2019 13:54:42 -0800 Subject: [PATCH 6/7] Renamed e to event and event to nativeEvent --- Libraries/Components/ScrollView/ScrollView.js | 53 +++++++++---------- 1 file changed, 26 insertions(+), 27 deletions(-) diff --git a/Libraries/Components/ScrollView/ScrollView.js b/Libraries/Components/ScrollView/ScrollView.js index 512664386ba082..189c3cdb66f4c8 100644 --- a/Libraries/Components/ScrollView/ScrollView.js +++ b/Libraries/Components/ScrollView/ScrollView.js @@ -882,57 +882,56 @@ class ScrollView extends React.Component { } // [TODO(macOS ISS#2323203) - _handleKeyDown = (e: ScrollEvent) => { + _handleKeyDown = (event: ScrollEvent) => { if (this.props.onScrollKeyDown) { - this.props.onScrollKeyDown(e); + 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(e, { - x: event.contentOffset.x, - y: event.contentOffset.y + -event.layoutMeasurement.height, + this._handleScrollByKeyDown(event, { + x: nativeEvent.contentOffset.x, + y: nativeEvent.contentOffset.y + -nativeEvent.layoutMeasurement.height, }); } else if (key === 'PAGE_DOWN') { - this._handleScrollByKeyDown(e, { - x: event.contentOffset.x, - y: event.contentOffset.y + event.layoutMeasurement.height, + this._handleScrollByKeyDown(event, { + x: nativeEvent.contentOffset.x, + y: nativeEvent.contentOffset.y + nativeEvent.layoutMeasurement.height, }); } else if (key === 'LEFT_ARROW') { - this._handleScrollByKeyDown(e, { + this._handleScrollByKeyDown(event, { x: - event.contentOffset.x + + 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(e, { + this._handleScrollByKeyDown(event, { x: - event.contentOffset.x + + 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(e, { - x: event.contentOffset.x, + this._handleScrollByKeyDown(event, { + x: nativeEvent.contentOffset.x, y: - event.contentOffset.y + + nativeEvent.contentOffset.y + (this.props.verticalLineScroll !== undefined ? this.props.verticalLineScroll : kMinScrollOffset), }); } else if (key === 'UP_ARROW') { - this._handleScrollByKeyDown(e, { - x: event.contentOffset.x, + this._handleScrollByKeyDown(event, { + x: nativeEvent.contentOffset.x, y: - event.contentOffset.y + + nativeEvent.contentOffset.y + -(this.props.verticalLineScroll !== undefined ? this.props.verticalLineScroll : kMinScrollOffset), @@ -942,11 +941,11 @@ 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)), From 43e4fd0ec39aa1d119a17cb653747f8a90d8fe30 Mon Sep 17 00:00:00 2001 From: Tom Underhill Date: Sun, 1 Dec 2019 13:59:30 -0800 Subject: [PATCH 7/7] Fix lint errors --- Libraries/Components/ScrollView/ScrollView.js | 14 ++++++++++---- 1 file changed, 10 insertions(+), 4 deletions(-) diff --git a/Libraries/Components/ScrollView/ScrollView.js b/Libraries/Components/ScrollView/ScrollView.js index 189c3cdb66f4c8..51801537fcd816 100644 --- a/Libraries/Components/ScrollView/ScrollView.js +++ b/Libraries/Components/ScrollView/ScrollView.js @@ -893,12 +893,16 @@ class ScrollView extends React.Component { if (key === 'PAGE_UP') { this._handleScrollByKeyDown(event, { x: nativeEvent.contentOffset.x, - y: nativeEvent.contentOffset.y + -nativeEvent.layoutMeasurement.height, + y: + nativeEvent.contentOffset.y + + -nativeEvent.layoutMeasurement.height, }); } else if (key === 'PAGE_DOWN') { this._handleScrollByKeyDown(event, { x: nativeEvent.contentOffset.x, - y: nativeEvent.contentOffset.y + nativeEvent.layoutMeasurement.height, + y: + nativeEvent.contentOffset.y + + nativeEvent.layoutMeasurement.height, }); } else if (key === 'LEFT_ARROW') { this._handleScrollByKeyDown(event, { @@ -943,9 +947,11 @@ class ScrollView extends React.Component { _handleScrollByKeyDown = (event: ScrollEvent, newOffset) => { const maxX = - event.nativeEvent.contentSize.width - event.nativeEvent.layoutMeasurement.width; + event.nativeEvent.contentSize.width - + event.nativeEvent.layoutMeasurement.width; const maxY = - event.nativeEvent.contentSize.height - event.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)),