feat(AutoFocusZone): added simple AutoFocusZone component for focusing the first focusable element or the element with the provided selector #1015
Conversation
mnajdova
requested review from
dvdzkwsk,
kuzhelov,
layershifter,
levithomason and
miroslavstastny
as code owners
packages/react/src/lib/accessibility/FocusZone/AutoFocusZone.tsx
Outdated
Show resolved
Hide resolved
packages/react/src/lib/accessibility/FocusZone/AutoFocusZone.tsx
Outdated
Show resolved
Hide resolved
packages/react/src/lib/accessibility/FocusZone/AutoFocusZone.tsx
Outdated
Show resolved
Hide resolved
packages/react/src/lib/accessibility/FocusZone/AutoFocusZone.tsx
Outdated
Show resolved
Hide resolved
| </AutoFocusZone> | ||
| <button className={'z'}>z</button> | ||
| </div>, | ||
| ) as HTMLElement |
There was a problem hiding this comment.
Can we use enzyme for tests?
There was a problem hiding this comment.
I was copying and trying to keep these tests consistent with the other focus zone tests.. If we decide later to move all of them to enzyme we will do it for all of them.
Codecov Report
@@ Coverage Diff @@
## master #1015 +/- ##
==========================================
+ Coverage 81.37% 81.44% +0.06%
==========================================
Files 673 675 +2
Lines 8699 8745 +46
Branches 1475 1483 +8
==========================================
+ Hits 7079 7122 +43
- Misses 1605 1607 +2
- Partials 15 16 +1
Continue to review full report at Codecov.
|
Codecov Report
@@ Coverage Diff @@
## master #1015 +/- ##
==========================================
+ Coverage 81.45% 81.51% +0.06%
==========================================
Files 673 675 +2
Lines 8708 8755 +47
Branches 1549 1492 -57
==========================================
+ Hits 7093 7137 +44
- Misses 1600 1602 +2
- Partials 15 16 +1
Continue to review full report at Codecov.
|
removed empty state object int he component definition
| import callable from '../../callable' | ||
| import Ref from '../../../components/Ref/Ref' | ||
|
|
||
| /** AutoFocusZone is used to focus the first element inside it's children. */ |
There was a problem hiding this comment.
Not only first, but als by selector
...is used to focus inner element on mount...
There was a problem hiding this comment.
Changed to: AutoFocusZone is used to focus inner element on mount. You are right, the props description will indicate the details.
| as?: React.ReactType | ||
|
|
||
| /** | ||
| * Indicates the selector for first focusable item. Only applies if focusPreviouslyFocusedInnerElement == false. |
There was a problem hiding this comment.
No needd Only applies if focusPreviouslyFocusedInnerElement == false.
…auto-focus-zone # Conflicts: # packages/react/src/lib/accessibility/FocusZone/AutoFocusZone.tsx
Added AutoFocusZone component and popupAutoFocusBehavior.