Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix focus disappearing when visiting the settings #4042

Merged
merged 1 commit into from
Sep 18, 2023

Conversation

absidue
Copy link
Member

@absidue absidue commented Sep 13, 2023

Fix focus disappearing when visiting the settings

Pull Request Type

  • Bugfix

Related issue

closes #4021

Description

Currently the settings page is first rendered with the password dialog, which focuses the password input and then immediately rerendered without it, if you don't have a password, which unset the focus. This is caused by the default value for settingsUnlocked being true and us only setting it to false when the mounted hook fires, changing to the created hook fixes the issue, as that fires before Vue does any rendering. The created hook fires after the component instance is created, the mounted hook fires after the component has been mounted into the DOM (html elements created, event listeners registered etc).

Testing

  1. Make sure you don't have a settings password set.
  2. Click on the settings icon in the side bar
  3. Press tab
  4. The focus should be on the history icon

Desktop

  • OS: Windows
  • OS Version: 10
  • FreeTube version: 0.19.0

@github-actions github-actions bot added the PR: waiting for review For PRs that are complete, tested, and ready for review label Sep 13, 2023
@FreeTubeBot FreeTubeBot enabled auto-merge (squash) September 13, 2023 16:49
@PikachuEXE
Copy link
Collaborator

The focus should be on the history icon

For me the focus is on about (which I expect)
Any reason it should be on history?
image

@absidue
Copy link
Member Author

absidue commented Sep 14, 2023

My brain must have stopped working for a moment while writing, because I meant to write about.

Copy link
Collaborator

@PikachuEXE PikachuEXE left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I confirm that the result is the same as the one @absidue expected when her brain is working :)

@FreeTubeBot FreeTubeBot merged commit 9106791 into FreeTubeApp:development Sep 18, 2023
5 checks passed
@github-actions github-actions bot removed the PR: waiting for review For PRs that are complete, tested, and ready for review label Sep 18, 2023
@absidue absidue deleted the settings-focus branch September 18, 2023 11:29
PikachuEXE added a commit to PikachuEXE/FreeTube that referenced this pull request Sep 19, 2023
* development:
  Translated using Weblate (French)
  Avoid extending the VueI18n class as it won't exist in Vue 3 (FreeTubeApp#4046)
  Fix comment author focus outline being broken (FreeTubeApp#4041)
  Bump sass from 1.66.1 to 1.67.0 (FreeTubeApp#4052)
  Bump marked from 9.0.0 to 9.0.2 (FreeTubeApp#4054)
  Bump the babel group with 2 updates (FreeTubeApp#4050)
  Bump the eslint group with 1 update (FreeTubeApp#4051)
  Bump lefthook from 1.4.10 to 1.4.11 (FreeTubeApp#4055)
  Avoid extending the VueRouter class as it won't exist in Vue 3 (FreeTubeApp#4047)
  Fix focus disappearing when visiting the settings (FreeTubeApp#4042)
  Translated using Weblate (Catalan)
  Translated using Weblate (Bulgarian)
  Translated using Weblate (Croatian)
  Translated using Weblate (Hebrew)
  Translated using Weblate (Portuguese (Brazil))
  Translated using Weblate (German)
  Translated using Weblate (Hungarian)
  Translated using Weblate (Spanish)
  Translated using Weblate (Estonian)
  Translated using Weblate (Ukrainian)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

[Bug]: Focus is removed on page navigation arrows in top bar when navigating to Settings page
5 participants