-
Notifications
You must be signed in to change notification settings - Fork 45.6k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Don’t add onclick listener to React root #13778
Changes from 4 commits
45578e6
f78da30
965b17c
f0c2702
4cf7175
ea25fe7
File filter
Filter by extension
Conversations
Jump to
Diff view
Diff view
There are no files selected for viewing
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -341,8 +341,16 @@ export function appendChild( | |
parentInstance.appendChild(child); | ||
} | ||
|
||
type DOMContainer = | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. I can also export this type from There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. Would make more sense than duplicating to me. |
||
| (Element & { | ||
_reactRootContainer: ?{}, | ||
}) | ||
| (Document & { | ||
_reactRootContainer: ?{}, | ||
}); | ||
|
||
export function appendChildToContainer( | ||
container: Container, | ||
container: DOMContainer, | ||
child: Instance | TextInstance, | ||
): void { | ||
let parentNode; | ||
|
@@ -358,9 +366,14 @@ export function appendChildToContainer( | |
// through the React tree. However, on Mobile Safari the click would | ||
// never bubble through the *DOM* tree unless an ancestor with onclick | ||
// event exists. So we wouldn't see it and dispatch it. | ||
// This is why we ensure that containers have inline onclick defined. | ||
// This is why we ensure that non React root containers have inline onclick | ||
// defined. | ||
// https://github.com/facebook/react/issues/11918 | ||
if (parentNode.onclick === null) { | ||
const {_reactRootContainer} = container; | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. Another style nit: we don't use destructuring, with some exceptions like module-style objects or function args (component props). |
||
if ( | ||
(_reactRootContainer === null || _reactRootContainer === undefined) && | ||
parentNode.onclick === null | ||
) { | ||
// TODO: This cast may not be sound for SVG, MathML or custom elements. | ||
trapClickOnNonInteractiveElement(((parentNode: any): HTMLElement)); | ||
} | ||
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
You can just do
expect(typeof ...).toBe('function')
. Not that it matters.