@@ -10,12 +10,16 @@ const state = { name: 'state', url: '/state' };
10
10
const state2 = { name : 'state2' , url : '/state2' } ;
11
11
const state3 = { name : 'state3' , url : '/state3/:param' } ;
12
12
13
- const Link = ( { to, params = undefined , children = undefined } ) => {
13
+ const Link = ( { to, params = undefined , children = undefined , target = undefined } ) => {
14
14
const sref = useSref ( to , params ) ;
15
- return < a { ...sref } > { children } </ a > ;
15
+ return (
16
+ < a { ...sref } target = { target } >
17
+ { children }
18
+ </ a >
19
+ ) ;
16
20
} ;
17
21
18
- describe ( 'useUiSref ' , ( ) => {
22
+ describe ( 'useSref ' , ( ) => {
19
23
let { router, routerGo, mountInRouter } = makeTestRouter ( [ ] ) ;
20
24
beforeEach ( ( ) => ( { router, routerGo, mountInRouter } = makeTestRouter ( [ state , state2 , state3 ] ) ) ) ;
21
25
@@ -29,21 +33,51 @@ describe('useUiSref', () => {
29
33
expect ( wrapper . html ( ) ) . toBe ( '<a href="/state2">state2</a>' ) ;
30
34
} ) ;
31
35
32
- it ( 'returns an onClick function which activates the target state' , ( ) => {
33
- const spy = jest . spyOn ( router . stateService , 'go' ) ;
34
- const wrapper = mountInRouter ( < Link to = "state" /> ) ;
35
- wrapper . simulate ( 'click' ) ;
36
+ describe ( 'onClick function' , ( ) => {
37
+ it ( 'activates the target state' , ( ) => {
38
+ const spy = jest . spyOn ( router . stateService , 'go' ) ;
39
+ const wrapper = mountInRouter ( < Link to = "state" /> ) ;
40
+ wrapper . simulate ( 'click' ) ;
36
41
37
- expect ( spy ) . toBeCalledTimes ( 1 ) ;
38
- expect ( spy ) . toBeCalledWith ( 'state' , expect . anything ( ) , expect . anything ( ) ) ;
39
- } ) ;
42
+ expect ( spy ) . toBeCalledTimes ( 1 ) ;
43
+ expect ( spy ) . toBeCalledWith ( 'state' , expect . anything ( ) , expect . anything ( ) ) ;
44
+ } ) ;
40
45
41
- it ( 'returns an onClick function which respects defaultPrevented' , ( ) => {
42
- const spy = jest . spyOn ( router . stateService , 'go' ) ;
43
- const wrapper = mountInRouter ( < Link to = "state" /> ) ;
44
- wrapper . simulate ( 'click' , { defaultPrevented : true } ) ;
46
+ it ( 'respects defaultPrevented' , ( ) => {
47
+ const spy = jest . spyOn ( router . stateService , 'go' ) ;
48
+ const wrapper = mountInRouter ( < Link to = "state" /> ) ;
49
+ wrapper . simulate ( 'click' , { defaultPrevented : true } ) ;
50
+
51
+ expect ( spy ) . not . toHaveBeenCalled ( ) ;
52
+ } ) ;
53
+
54
+ it ( 'does not get called when middle or right clicked' , ( ) => {
55
+ const spy = jest . spyOn ( router . stateService , 'go' ) ;
56
+ const wrapper = mountInRouter ( < Link to = "state" /> ) ;
45
57
46
- expect ( spy ) . not . toHaveBeenCalled ( ) ;
58
+ wrapper . simulate ( 'click' , { button : 1 } ) ;
59
+ expect ( spy ) . not . toHaveBeenCalled ( ) ;
60
+ } ) ;
61
+
62
+ it ( 'does not get called if any of these modifiers are present: ctrl, meta, shift, alt' , ( ) => {
63
+ const spy = jest . spyOn ( router . stateService , 'go' ) ;
64
+ const wrapper = mountInRouter ( < Link to = "state" /> ) ;
65
+
66
+ wrapper . simulate ( 'click' , { ctrlKey : true } ) ;
67
+ wrapper . simulate ( 'click' , { metaKey : true } ) ;
68
+ wrapper . simulate ( 'click' , { shiftKey : true } ) ;
69
+ wrapper . simulate ( 'click' , { altKey : true } ) ;
70
+
71
+ expect ( spy ) . not . toHaveBeenCalled ( ) ;
72
+ } ) ;
73
+
74
+ it ( 'does not get called if the underlying DOM element has a "target" attribute' , ( ) => {
75
+ const spy = jest . spyOn ( router . stateService , 'go' ) ;
76
+ const wrapper = mountInRouter ( < Link to = "state" target = "_blank" /> ) ;
77
+
78
+ wrapper . simulate ( 'click' ) ;
79
+ expect ( spy ) . not . toHaveBeenCalled ( ) ;
80
+ } ) ;
47
81
} ) ;
48
82
49
83
it ( 'updates the href when the stateName changes' , ( ) => {
@@ -96,7 +130,7 @@ describe('useUiSref', () => {
96
130
it ( 'calls go() with the actual string provided (not with the name of the matched future state)' , async ( ) => {
97
131
router . stateRegistry . register ( { name : 'future.**' , url : '/future' } ) ;
98
132
99
- const Link = props => {
133
+ const Link = ( props ) => {
100
134
const sref = useSref ( 'future.child' , { param : props . param } ) ;
101
135
return < a { ...sref } /> ;
102
136
} ;
@@ -112,7 +146,7 @@ describe('useUiSref', () => {
112
146
it ( 'participates in parent UISrefActive component active state' , async ( ) => {
113
147
await routerGo ( 'state2' ) ;
114
148
115
- const State2Link = props => {
149
+ const State2Link = ( props ) => {
116
150
const sref = useSref ( 'state2' ) ;
117
151
return (
118
152
< a { ...sref } { ...props } >
@@ -150,7 +184,7 @@ describe('useUiSref', () => {
150
184
it ( 'participates in grandparent UISrefActive component active state' , async ( ) => {
151
185
await routerGo ( 'state2' ) ;
152
186
153
- const State2Link = props => {
187
+ const State2Link = ( props ) => {
154
188
const sref = useSref ( 'state2' ) ;
155
189
return (
156
190
< a { ...sref } className = { props . className } >
@@ -178,7 +212,7 @@ describe('useUiSref', () => {
178
212
it ( 'stops participating in parent/grandparent UISrefActive component active state when unmounted' , async ( ) => {
179
213
await routerGo ( 'state2' ) ;
180
214
181
- const State2Link = props => {
215
+ const State2Link = ( props ) => {
182
216
const sref = useSref ( 'state2' ) ;
183
217
return (
184
218
< a { ...sref } className = { props . className } >
@@ -187,7 +221,7 @@ describe('useUiSref', () => {
187
221
) ;
188
222
} ;
189
223
190
- const Component = props => {
224
+ const Component = ( props ) => {
191
225
return (
192
226
< UISrefActive class = "grandparentactive" >
193
227
< div >
0 commit comments