Expose isLocalUserInfoKey to keyboard event notifications (#23245)
Summary: Given two apps loaded side-by-side and when a `Keyboard` event is triggered, there is no way to ascertain which app triggered the keyboard event. This ambiguity can arise in slide over/split view scenarios. This pull request exposes the `isLocalUserInfoKey` property of the native `UIKeyboard` iOS events to the `Keyboard` event listener; this property will return `true` for the app that triggered the keyboard event. (Also, I threw in a couple of Keyboard.js tests just for fun 😅) [iOS][Added] - Expose isLocalUserInfoKey to keyboard event notifications 1. Load two apps side-by-side, with the app on the left side subscribing to the keyboard events (and logging out the events as they happen) 1. Trigger a keyboard to appear with the left app. The logged keyboard event will contain the `isEventFromThisApp` property which will be true. 1. Dismiss the keyboard 1. Trigger a keyboard to appear with the right app. The left app will still log the keyboard event, but the event's `isEventFromThisApp` property will be false (because the left app didn't trigger the keyboard event) Pull Request resolved: https://github.com/facebook/react-native/pull/23245 Differential Revision: D13928612 Pulled By: hramos fbshipit-source-id: 6d74d2565e2af62328485fd9da86f15f9e2ccfab
This commit is contained in:
parent
dda2b82a0a
commit
05f35c296d
|
@ -37,6 +37,7 @@ export type KeyboardEvent = $ReadOnly<{|
|
|||
easing?: string,
|
||||
endCoordinates: ScreenRect,
|
||||
startCoordinates?: ScreenRect,
|
||||
isEventFromThisApp?: boolean,
|
||||
|}>;
|
||||
|
||||
type KeyboardEventListener = (e: KeyboardEvent) => void;
|
||||
|
|
|
@ -0,0 +1,93 @@
|
|||
/**
|
||||
* 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.
|
||||
*
|
||||
* @format
|
||||
* @flow
|
||||
* @emails oncall+react_native
|
||||
*/
|
||||
|
||||
'use strict';
|
||||
|
||||
const Keyboard = require('Keyboard');
|
||||
const dismissKeyboard = require('dismissKeyboard');
|
||||
const LayoutAnimation = require('LayoutAnimation');
|
||||
|
||||
const NativeEventEmitter = require('NativeEventEmitter');
|
||||
const NativeModules = require('NativeModules');
|
||||
|
||||
jest.mock('LayoutAnimation');
|
||||
|
||||
describe('Keyboard', () => {
|
||||
beforeEach(() => {
|
||||
jest.resetAllMocks();
|
||||
});
|
||||
|
||||
it('exposes KeyboardEventEmitter methods', () => {
|
||||
const KeyboardObserver = NativeModules.KeyboardObserver;
|
||||
const KeyboardEventEmitter = new NativeEventEmitter(KeyboardObserver);
|
||||
|
||||
// $FlowFixMe
|
||||
expect(Keyboard._subscriber).toBe(KeyboardEventEmitter._subscriber);
|
||||
expect(Keyboard._nativeModule).toBe(KeyboardEventEmitter._nativeModule);
|
||||
});
|
||||
|
||||
it('uses dismissKeyboard utility', () => {
|
||||
expect(Keyboard.dismiss).toBe(dismissKeyboard);
|
||||
});
|
||||
|
||||
describe('scheduling layout animation', () => {
|
||||
const scheduleLayoutAnimation = (
|
||||
duration: number | null,
|
||||
easing: string | null,
|
||||
): void => Keyboard.scheduleLayoutAnimation({duration, easing});
|
||||
|
||||
it('triggers layout animation', () => {
|
||||
scheduleLayoutAnimation(12, 'spring');
|
||||
expect(LayoutAnimation.configureNext).toHaveBeenCalledWith({
|
||||
duration: 12,
|
||||
update: {
|
||||
duration: 12,
|
||||
type: 'spring',
|
||||
},
|
||||
});
|
||||
});
|
||||
|
||||
it('does not trigger animation when duration is null', () => {
|
||||
scheduleLayoutAnimation(null, 'spring');
|
||||
expect(LayoutAnimation.configureNext).not.toHaveBeenCalled();
|
||||
});
|
||||
|
||||
it('does not trigger animation when duration is 0', () => {
|
||||
scheduleLayoutAnimation(0, 'spring');
|
||||
expect(LayoutAnimation.configureNext).not.toHaveBeenCalled();
|
||||
});
|
||||
|
||||
describe('animation update type', () => {
|
||||
const assertAnimationUpdateType = type =>
|
||||
expect(LayoutAnimation.configureNext).toHaveBeenCalledWith(
|
||||
expect.objectContaining({
|
||||
duration: expect.anything(),
|
||||
update: {duration: expect.anything(), type},
|
||||
}),
|
||||
);
|
||||
|
||||
it('retrieves type from LayoutAnimation', () => {
|
||||
scheduleLayoutAnimation(12, 'linear');
|
||||
assertAnimationUpdateType('linear');
|
||||
});
|
||||
|
||||
it("defaults to 'keyboard' when key in LayoutAnimation is not found", () => {
|
||||
scheduleLayoutAnimation(12, 'some-unknown-animation-type');
|
||||
assertAnimationUpdateType('keyboard');
|
||||
});
|
||||
|
||||
it("defaults to 'keyboard' when easing is null", () => {
|
||||
scheduleLayoutAnimation(12, null);
|
||||
assertAnimationUpdateType('keyboard');
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
|
@ -110,12 +110,14 @@ static NSDictionary *RCTParseKeyboardNotification(NSNotification *notification)
|
|||
CGRect endFrame = [userInfo[UIKeyboardFrameEndUserInfoKey] CGRectValue];
|
||||
NSTimeInterval duration = [userInfo[UIKeyboardAnimationDurationUserInfoKey] doubleValue];
|
||||
UIViewAnimationCurve curve = [userInfo[UIKeyboardAnimationCurveUserInfoKey] integerValue];
|
||||
NSInteger isLocalUserInfoKey = [userInfo[UIKeyboardIsLocalUserInfoKey] integerValue];
|
||||
|
||||
return @{
|
||||
@"startCoordinates": RCTRectDictionaryValue(beginFrame),
|
||||
@"endCoordinates": RCTRectDictionaryValue(endFrame),
|
||||
@"duration": @(duration * 1000.0), // ms
|
||||
@"easing": RCTAnimationNameForCurve(curve),
|
||||
@"isEventFromThisApp": isLocalUserInfoKey == 1 ? @YES : @NO,
|
||||
};
|
||||
#endif
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue