amirho/react
1
0
Fork 0
mirror of https://github.com/facebook/react.git synced 2026-02-23 20:23:02 +00:00
Code Issues Packages Projects Releases Wiki Activity

[Flare] Remove responder flags to simplify logic (#16084)

Browse Source
This commit is contained in:
Dominic Gannaway
2019-07-09 15:05:45 +01:00
committed by GitHub
parent 8533c0a168
commit 23b8a25345
12 changed files with 13 additions and 183 deletions
Download Patch File Download Diff File Expand all files Collapse all files

131
packages/react-dom/src/events/__tests__/DOMEventResponderSystem-test.internal.js
View File

@@ -26,8 +26,6 @@ function createReactEventComponent({
onMount,
onUnmount,
onOwnershipChange,
allowMultipleHostChildren,
allowEventHooks,
}) {
const testEventResponder = {
displayName: 'TestEventComponent',
@@ -39,8 +37,6 @@ function createReactEventComponent({
onMount,
onUnmount,
onOwnershipChange,
allowMultipleHostChildren: allowMultipleHostChildren || false,
allowEventHooks: allowEventHooks || true,
};
return React.unstable_createEvent(testEventResponder);
@@ -822,133 +818,6 @@ describe('DOMEventResponderSystem', () => {
expect(container.innerHTML).toBe('<button>Click me!</button>');
});
it('should warn if multiple host components are detected without allowMultipleHostChildren', () => {
const EventComponent = createReactEventComponent({
targetEventTypes: [],
onEvent: () => {},
allowMultipleHostChildren: false,
});
const Test = () => (
<EventComponent>
<div />
<div />
</EventComponent>
);
expect(() => {
ReactDOM.render(<Test />, container);
}).toWarnDev(
'Warning: A "<TestEventComponent>" event component cannot contain multiple host children.',
);
function Component() {
return <div />;
}
const Test2 = () => (
<EventComponent>
<div />
<Component />
</EventComponent>
);
expect(() => {
ReactDOM.render(<Test2 />, container);
}).toWarnDev(
'Warning: A "<TestEventComponent>" event component cannot contain multiple host children.',
);
});
it('should handle suspended nodes correctly when detecting host components without allowMultipleHostChildren', () => {
const EventComponent = createReactEventComponent({
targetEventTypes: [],
onEvent: () => {},
allowMultipleHostChildren: false,
});
function SuspendedComponent() {
throw Promise.resolve();
}
function Component() {
return (
<React.Fragment>
<div />
<SuspendedComponent />
</React.Fragment>
);
}
const Test = () => (
<EventComponent>
<React.Suspense fallback={<div>Loading...</div>}>
<Component />
</React.Suspense>
</EventComponent>
);
ReactDOM.render(<Test />, container);
function Component2() {
return (
<React.Fragment>
<SuspendedComponent />
</React.Fragment>
);
}
const Test2 = () => (
<EventComponent>
<React.Suspense
fallback={
<React.Fragment>
<div />
<div />
</React.Fragment>
}>
<Component2 />
</React.Suspense>
</EventComponent>
);
expect(() => {
ReactDOM.render(<Test2 />, container);
}).toWarnDev(
'Warning: A "<TestEventComponent>" event component cannot contain multiple host children.',
);
});
it('should not warn if multiple host components are detected with allowMultipleHostChildren', () => {
const EventComponent = createReactEventComponent({
targetEventTypes: [],
onEvent: () => {},
allowMultipleHostChildren: true,
});
const Test = () => (
<EventComponent>
<div />
<div />
</EventComponent>
);
ReactDOM.render(<Test />, container);
function Component() {
return <div />;
}
const Test2 = () => (
<EventComponent>
<div />
<Component />
</EventComponent>
);
ReactDOM.render(<Test2 />, container);
});
it('should work with event component hooks', () => {
const buttonRef = React.createRef();
const eventLogs = [];

2
packages/react-events/src/dom/Drag.js vendored
View File

@@ -98,8 +98,6 @@ const DragResponder: ReactDOMEventResponder = {
y: 0,
};
},
allowMultipleHostChildren: false,
allowEventHooks: false,
onEvent(
event: ReactDOMResponderEvent,
context: ReactDOMResponderContext,

2
packages/react-events/src/dom/Focus.js vendored
View File

@@ -228,8 +228,6 @@ const FocusResponder: ReactDOMEventResponder = {
pointerType: '',
};
},
allowMultipleHostChildren: false,
allowEventHooks: true,
onEvent(
event: ReactDOMResponderEvent,
context: ReactDOMResponderContext,

2
packages/react-events/src/dom/FocusScope.js vendored
View File

@@ -56,8 +56,6 @@ const FocusScopeResponder: ReactDOMEventResponder = {
currentFocusedNode: null,
};
},
allowMultipleHostChildren: true,
allowEventHooks: false,
onEvent(
event: ReactDOMResponderEvent,
context: ReactDOMResponderContext,

26
packages/react-events/src/dom/Hover.js vendored
View File

@@ -332,20 +332,18 @@ const HoverResponder: ReactDOMEventResponder = {
case 'pointermove':
case 'mousemove': {
if (state.isHovered && !isEmulatedMouseEvent(event, state)) {
if (state.isHovered) {
if (props.onHoverMove && state.hoverTarget !== null) {
const syntheticEvent = createHoverEvent(
event,
context,
'hovermove',
state.hoverTarget,
);
context.dispatchEvent(
syntheticEvent,
props.onHoverMove,
UserBlockingEvent,
);
}
if (props.onHoverMove && state.hoverTarget !== null) {
const syntheticEvent = createHoverEvent(
event,
context,
'hovermove',
state.hoverTarget,
);
context.dispatchEvent(
syntheticEvent,
props.onHoverMove,
UserBlockingEvent,
);
}
}
return;

2
packages/react-events/src/dom/Press.js vendored
View File

@@ -649,8 +649,6 @@ const PressResponder: ReactDOMEventResponder = {
touchEvent: null,
};
},
allowMultipleHostChildren: false,
allowEventHooks: true,
onEvent(
event: ReactDOMResponderEvent,
context: ReactDOMResponderContext,

2
packages/react-events/src/dom/Scroll.js vendored
View File

@@ -141,8 +141,6 @@ const ScrollResponder: ReactDOMEventResponder = {
scrollTarget: null,
};
},
allowMultipleHostChildren: true,
allowEventHooks: true,
onEvent(
event: ReactDOMResponderEvent,
context: ReactDOMResponderContext,

2
packages/react-events/src/dom/Swipe.js vendored
View File

@@ -104,8 +104,6 @@ const SwipeResponder: ReactDOMEventResponder = {
y: 0,
};
},
allowMultipleHostChildren: false,
allowEventHooks: false,
onEvent(
event: ReactDOMResponderEvent,
context: ReactDOMResponderContext,

2
packages/react-events/src/rn/Press.js vendored
View File

@@ -502,8 +502,6 @@ function dispatchPressEndEvents(event, context, props, state): void {
const PressResponder: ReactNativeEventResponder = {
displayName: 'Press',
targetEventTypes,
allowEventHooks: true,
allowMultipleHostChildren: false,
getInitialState(): PressState {
return {
activationPosition: null,

17
packages/react-reconciler/src/ReactFiberCompleteWork.js vendored
View File

@@ -116,12 +116,7 @@ import {
renderDidSuspendDelayIfPossible,
renderHasNotSuspendedYet,
} from './ReactFiberWorkLoop';
import {
getEventComponentHostChildrenCount,
createEventComponentInstance,
} from './ReactFiberEvents';
import getComponentName from 'shared/getComponentName';
import warning from 'shared/warning';
import {createEventComponentInstance} from './ReactFiberEvents';
import {Never} from './ReactFiberExpirationTime';
import {resetChildFibers} from './ReactChildFiber';
@@ -1131,16 +1126,6 @@ function completeWork(
if (eventComponentInstance === null) {
let responderState = null;
if (__DEV__ && !responder.allowMultipleHostChildren) {
const hostChildrenCount = getEventComponentHostChildrenCount(
workInProgress,
);
warning(
(hostChildrenCount || 0) < 2,
'A "<%s>" event component cannot contain multiple host children.',
getComponentName(workInProgress.type),
);
}
const getInitialState = responder.getInitialState;
if (getInitialState !== undefined) {
responderState = getInitialState(newProps);

6
packages/react-reconciler/src/ReactFiberEvents.js vendored
View File

@@ -22,7 +22,6 @@ import {
Fragment,
} from 'shared/ReactWorkTags';
import {NoWork} from './ReactFiberExpirationTime';
import invariant from 'shared/invariant';
let currentlyRenderingFiber: null | Fiber = null;
let currentEventComponentInstanceIndex: number = 0;
@@ -37,11 +36,6 @@ export function updateEventComponentInstance<E, C>(
props: Object,
): void {
const responder = eventComponent.responder;
invariant(
responder.allowEventHooks,
'The "%s" event responder cannot be used via the "useEvent" hook.',
responder.displayName,
);
let events;
let dependencies: Dependencies | null = ((currentlyRenderingFiber: any): Fiber)
.dependencies;

2
packages/shared/ReactTypes.js
View File

@@ -95,8 +95,6 @@ export type ReactEventResponder<E, C> = {
targetEventTypes?: Array<string>,
rootEventTypes?: Array<string>,
getInitialState?: (props: Object) => Object,
allowMultipleHostChildren: boolean,
allowEventHooks: boolean,
onEvent?: (event: E, context: C, props: Object, state: Object) => void,
onRootEvent?: (event: E, context: C, props: Object, state: Object) => void,
onMount?: (context: C, props: Object, state: Object) => void,