elrumordelaluz / elrumordelaluz/reactour

disableKeyboardNavigation Not Behaving Consistently with disableDotsNavigation

Open
#682 0 comments 0 reactions 0 assignees View on GitHub
Dominant language
TypeScript
Stars
4.1k
Forks
352
PR merge metrics
No merged PRs in 30d

Description

## Description:

There is an issue with how the disableKeyboardNavigation and disableDotsNavigation props behave in Reactour. While disableDotsNavigation is correctly activated in the current step, disableKeyboardNavigation is only activated in the next step, allowing users to still navigate through the tour with keyboard input.

## Expected Behavior:

Both disableKeyboardNavigation and disableDotsNavigation should behave consistently, being activated in the current step to prevent users from navigating forward or backward while the tour is locked.

## Actual Behavior:
- disableDotsNavigation is activated immediately in the current step, which prevents navigation through dots.
- disableKeyboardNavigation, however, is not activated until the next step, meaning users can still use keyboard navigation.

## Steps to Reproduce:

```
const [lockTour, setLockTour] = useState(false);

;

export function steps(setLockTour) {
return [
{
action: (elem) => {
setLockTour(true);
elem.onclick = () => {
setLockTour(false);
};
},
},
];
}

```
## Suggested Fix:
Ensure that disableKeyboardNavigation is activated in the current step, similar to how disableDotsNavigation behaves.

Contributor guide

Open the contributing guide

Research direction

Reproduce the issue with the supplied TourProvider and steps example, then trace how disableKeyboardNavigation and disableDotsNavigation respond to the current step's action. Compare when each prop takes effect during the tour. Done means keyboard and dots navigation are both disabled immediately in the current step and re-enabled when lockTour becomes false.

Written by the indexing model from the issue text.

Assessment

Tech stack
react, typescript
Domain
frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
45/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.