@@ -8,13 +8,15 @@ interface Props {
8
8
disableFocusCache ?: boolean ;
9
9
onKeyDown ?: React . KeyboardEventHandler < HTMLDivElement > ;
10
10
count : 1 | 2 | 3 ;
11
+ tabIndex ?: number ;
11
12
}
12
13
13
14
function Test ( {
14
15
onKeyDown,
15
16
disableFocusCache,
16
17
disabled,
17
18
count,
19
+ tabIndex,
18
20
} : Props ) : ReactElement {
19
21
const handleKeyDown = useTabFocusWrap ( {
20
22
onKeyDown,
@@ -23,7 +25,7 @@ function Test({
23
25
} ) ;
24
26
25
27
return (
26
- < div onKeyDown = { handleKeyDown } data-testid = "div" >
28
+ < div onKeyDown = { handleKeyDown } data-testid = "div" tabIndex = { tabIndex } >
27
29
{ count >= 1 && < input data-testid = "input-1" type = "text" /> }
28
30
{ count >= 2 && < input data-testid = "input-2" type = "text" /> }
29
31
{ count >= 3 && < input data-testid = "input-3" type = "text" /> }
@@ -33,16 +35,17 @@ function Test({
33
35
34
36
describe ( "useTabFocusWrap" , ( ) => {
35
37
it ( "should not focus a different element if there is only one focusable child" , ( ) => {
36
- const { getByTestId } = render ( < Test count = { 1 } /> ) ;
38
+ const { getByTestId } = render ( < Test count = { 1 } tabIndex = { - 1 } /> ) ;
37
39
38
40
const input = getByTestId ( "input-1" ) ;
39
41
input . focus ( ) ;
40
42
expect ( document . activeElement ) . toBe ( input ) ;
41
43
42
- const inputFocus = jest . spyOn ( input , "focus" ) ;
43
-
44
44
fireEvent . keyDown ( input , { key : "Tab" } ) ;
45
- expect ( inputFocus ) . not . toBeCalled ( ) ;
45
+ expect ( document . activeElement ) . toBe ( input ) ;
46
+
47
+ const container = getByTestId ( "div" ) ;
48
+ fireEvent . keyDown ( container , { key : "Tab" } ) ;
46
49
expect ( document . activeElement ) . toBe ( input ) ;
47
50
} ) ;
48
51
0 commit comments