@@ -17,14 +17,14 @@ describe('useTooltip', () => {
1717 new Promise ( async ( resolve ) => {
1818 await fireEvent . mouseOver ( target ) // fireEvent.mouseEnter only works if mouseOver is triggered before
1919 await fireEvent . mouseEnter ( target )
20- await _sleep ( 10 )
20+ await _sleep ( 1 )
2121 resolve ( )
2222 } )
2323
2424 const _leave = async ( ) =>
2525 new Promise ( async ( resolve ) => {
2626 await fireEvent . mouseLeave ( target )
27- await _sleep ( 10 )
27+ await _sleep ( 1 )
2828 resolve ( )
2929 } )
3030
@@ -35,6 +35,34 @@ describe('useTooltip', () => {
3535 resolve ( )
3636 } )
3737
38+ const _focus = async ( ) =>
39+ new Promise ( async ( resolve ) => {
40+ await fireEvent . focusIn ( target )
41+ await _sleep ( 1 )
42+ resolve ( )
43+ } )
44+
45+ const _blur = async ( ) =>
46+ new Promise ( async ( resolve ) => {
47+ await fireEvent . focusOut ( target )
48+ await _sleep ( 1 )
49+ resolve ( )
50+ } )
51+
52+ const _focusAndBlur = async ( ) =>
53+ new Promise ( async ( resolve ) => {
54+ await _focus ( )
55+ await _blur ( )
56+ resolve ( )
57+ } )
58+
59+ const _keyDown = async ( key ) =>
60+ new Promise ( async ( resolve ) => {
61+ await fireEvent . keyDown ( target , key || { key : 'Escape' , code : 'Escape' , charCode : 27 } )
62+ await _sleep ( 1 )
63+ resolve ( )
64+ } )
65+
3866 beforeEach ( ( ) => {
3967 target = _createElement ( 'target' , { class : 'bar' } )
4068 template = _createElement ( 'template' )
@@ -78,6 +106,13 @@ describe('useTooltip', () => {
78106 await _enterAndLeave ( )
79107 expect ( template ) . not . toBeInTheDocument ( )
80108 } )
109+
110+ it ( 'Hides tooltip on escape key down' , async ( ) => {
111+ action = useTooltip ( target , options )
112+ await _enter ( )
113+ await _keyDown ( )
114+ expect ( template ) . not . toBeInTheDocument ( )
115+ } )
81116 } )
82117
83118 describe ( 'update' , ( ) => {
@@ -95,6 +130,27 @@ describe('useTooltip', () => {
95130 expect ( newTemplate ) . toBeInTheDocument ( )
96131 } )
97132 } )
133+
134+ describe ( 'focus' , ( ) => {
135+ it ( 'Shows tooltip on focus in' , async ( ) => {
136+ action = useTooltip ( target , options )
137+ await _focus ( )
138+ expect ( template ) . toBeInTheDocument ( )
139+ } )
140+
141+ it ( 'Hides tooltip on focus out' , async ( ) => {
142+ action = useTooltip ( target , options )
143+ await _focusAndBlur ( )
144+ expect ( template ) . not . toBeInTheDocument ( )
145+ } )
146+
147+ it ( 'Hides tooltip on escape key down' , async ( ) => {
148+ action = useTooltip ( target , options )
149+ await _focus ( )
150+ await _keyDown ( )
151+ expect ( template ) . not . toBeInTheDocument ( )
152+ } )
153+ } )
98154 } )
99155
100156 describe ( 'useTooltip lifecycle' , ( ) => {
@@ -109,20 +165,44 @@ describe('useTooltip', () => {
109165 describe ( 'useTooltip props: content' , ( ) => {
110166 it ( 'Displays text content' , async ( ) => {
111167 const content = 'Foo'
112- action = useTooltip ( target , { ...options , contentSelector : null , content } )
168+ action = useTooltip ( target , {
169+ ...options ,
170+ contentSelector : null ,
171+ content,
172+ } )
113173 await _enter ( )
114174 expect ( target ) . toHaveTextContent ( content )
115175 } )
116176
117177 it ( 'Displays content element over text' , async ( ) => {
118178 const content = 'Foo'
119- action = useTooltip ( target , { ...options , content } )
179+ action = useTooltip ( target , {
180+ ...options ,
181+ content,
182+ } )
120183 await _enter ( )
121184 expect ( target ) . not . toHaveTextContent ( content )
122185 expect ( template ) . toBeInTheDocument ( )
123186 } )
124187 } )
125188
189+ describe ( 'useTooltip props: contentClone' , ( ) => {
190+ it ( 'Does not clone content element' , async ( ) => {
191+ action = useTooltip ( target , options )
192+ await _sleep ( 1 )
193+ expect ( template ) . not . toBeVisible ( )
194+ } )
195+
196+ it ( 'Clones content element' , async ( ) => {
197+ action = useTooltip ( target , {
198+ ...options ,
199+ contentClone : true ,
200+ } )
201+ await _sleep ( 1 )
202+ expect ( template ) . toBeVisible ( )
203+ } )
204+ } )
205+
126206 describe ( 'useTooltip props: contentActions' , ( ) => {
127207 it ( 'Triggers callback on tooltip click' , async ( ) => {
128208 action = useTooltip ( target , options )
0 commit comments