use FocusTrap for popover and remount StepComponent to remove the focus from Next button #7014
Conversation
|
/kind bug |
openshift-ci-robot
added
the
kind/bug
openshift-ci-robot
added
component/core
|
This looks good from UX perspective! |
|
/lgtm |
openshift-ci-robot
added
the
approved
| @@ -1,5 +1,5 @@ | |||
| import * as React from 'react'; | |||
| import { Popper } from '../popper'; | |||
| import * as FocusTrap from 'focus-trap-react'; | |||
There was a problem hiding this comment.
Use focus trap from PF:
| import * as FocusTrap from 'focus-trap-react'; | |
| import * as FocusTrap from '@patternfly/react-core'; |
edit: not sure when they started exporting this but we also have a few other places that use focus-trap-react that we should look to update.
There was a problem hiding this comment.
Agree, there are only a few other places that use FocusTrap from this external lib, we should get rid of them and drop the dependency.
There was a problem hiding this comment.
fixed in other places as well
There was a problem hiding this comment.
Not sure if we want to remove the dependency as well from package.json
There was a problem hiding this comment.
@christianvogt Did you want to consult with the Admin team?
@sahil143 Did you test the other areas? Because you've just created an extra step before I can lgtm this lol... Will have to wait until I can test the other areas.
|
/lgtm cancel |
|
@sahil143 Could you squash your commits? |
|
LGTM, retested it with the PF lib and operates the same. Just need the commits to be squashed and then we get this merged. |
openshift-ci-robot
added
needs-rebase
ODC-4919: trap foxus inside popover use Focus Trap from patternfly/react-core use FocusTrap from patternfly
openshift-ci-robot
removed
the
needs-rebase
|
@andrewballantyne commits squashed! Please take a look again. |
|
/lgtm |
|
[APPROVALNOTIFIER] This PR is APPROVED This pull-request has been approved by: andrewballantyne, christianvogt, rohitkrai03, sahil143 The full list of commands accepted by this bot can be found here. The pull request process is described here
Needs approval from an approver in each of these files:
Approvers can indicate their approval by writing |
Fixes:
https://issues.redhat.com/browse/ODC-4722
https://issues.redhat.com/browse/ODC-4919
Analysis / Root cause: Color of Next button was changed because once next button is clicked it remains focused.
Solution Description: Remount the component so focus is not on the Next Button
Screen shots / Gifs for design review:
Unit test coverage report: None
Test setup:
Browser conformance: