File tree Expand file tree Collapse file tree 2 files changed +48
-5
lines changed
packages/react-native-web/src/exports/createElement Expand file tree Collapse file tree 2 files changed +48
-5
lines changed Original file line number Diff line number Diff line change @@ -24,6 +24,45 @@ describe('modules/createElement', () => {
24
24
} ) ;
25
25
} ) ;
26
26
27
+ test ( 'gracefully handles onClick for links' , ( ) => {
28
+ let wasCalled = false ;
29
+ const component = shallow (
30
+ createElement ( 'div' , {
31
+ accessibilityRole : 'link' ,
32
+ onClick : ( ) => {
33
+ wasCalled = true ;
34
+ }
35
+ } )
36
+ ) ;
37
+ component . find ( 'a' ) . simulate ( 'click' , {
38
+ isDefaultPrevented ( ) { } ,
39
+ nativeEvent : { } ,
40
+ preventDefault ( ) { }
41
+ } ) ;
42
+
43
+ expect ( wasCalled ) . toBe ( true ) ;
44
+ } ) ;
45
+
46
+ test ( 'gracefully handles onClick for touchable links' , ( ) => {
47
+ let wasCalled = false ;
48
+ const component = shallow (
49
+ createElement ( 'div' , {
50
+ accessibilityRole : 'link' ,
51
+ onResponderRelease : ( ) => { } , // fake touchable
52
+ onClick : ( ) => {
53
+ wasCalled = true ;
54
+ }
55
+ } )
56
+ ) ;
57
+ component . find ( 'a' ) . simulate ( 'click' , {
58
+ isDefaultPrevented ( ) { } ,
59
+ nativeEvent : { } ,
60
+ preventDefault ( ) { }
61
+ } ) ;
62
+
63
+ expect ( wasCalled ) . toBe ( true ) ;
64
+ } ) ;
65
+
27
66
describe ( 'prop "accessibilityRole"' , ( ) => {
28
67
test ( 'and string component type' , ( ) => {
29
68
const component = shallow ( createElement ( 'span' , { accessibilityRole : 'link' } ) ) ;
Original file line number Diff line number Diff line change @@ -70,12 +70,16 @@ const adjustProps = domProps => {
70
70
// element. Click events are not an expected part of the React Native API,
71
71
// and browsers dispatch click events that cannot otherwise be cancelled from
72
72
// preceding mouse events in the responder system.
73
+ // Handle overrides gracefully if the user provides an onClick method.
74
+ // If this is provided, the user must make sure to handle the edge cases.
73
75
if ( isLinkRole && onResponderRelease ) {
74
- domProps . onClick = function ( e ) {
75
- if ( ! e . isDefaultPrevented ( ) && ! isModifiedEvent ( e . nativeEvent ) && ! domProps . target ) {
76
- e . preventDefault ( ) ;
77
- }
78
- } ;
76
+ domProps . onClick =
77
+ onClick ||
78
+ function ( e ) {
79
+ if ( ! e . isDefaultPrevented ( ) && ! isModifiedEvent ( e . nativeEvent ) && ! domProps . target ) {
80
+ e . preventDefault ( ) ;
81
+ }
82
+ } ;
79
83
}
80
84
81
85
// Button-like roles should trigger 'onClick' if SPACE or ENTER keys are pressed.
You can’t perform that action at this time.
0 commit comments