Leahnaya/mastodon
1
0
Fork 0
mirror of https://github.com/mastodon/mastodon.git synced 2026-09-27 13:08:39 -05:00
Code Issues Actions 3 Packages Projects Releases Wiki Activity

Redesign: Fix virtual keyboard not showing on Safari iOS when opening the Explore page (#40679)

Browse Source
This commit is contained in:
diondiondion
2026-09-24 09:15:09 +00:00
committed by GitHub
parent 98a1573008
commit 28449caf2e
4 changed files with 29 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
app/javascript/mastodon/features/navigation_panel/redesign/index.tsx
View File

@@ -27,6 +27,7 @@ import { openNewComposer } from '@/mastodon/reducers/slices/composer';
import { getOrderedLists } from '@/mastodon/selectors/lists';
import { selectUnreadNotificationGroupsCount } from '@/mastodon/selectors/notifications';
import { useAppDispatch, useAppSelector } from '@/mastodon/store';
import { invokeVirtualIosKeyboard } from '@/mastodon/utils/invoke_virtual_ios_keyboard';
import { NavigationAccountCardAndMenu } from './account_card_and_menu';
import { NavigationFooterLinks } from './footer_links';
@@ -151,6 +152,7 @@ export const RedesignNavigationPanel: React.FC<{
state: { focusTarget: FOCUS_TARGET.SEARCH },
}}
iconComponent={MagnifyingGlassIcon}
onClick={invokeVirtualIosKeyboard}
>
<FormattedMessage
id='tabs_bar.explore'

2
app/javascript/mastodon/features/navigation_panel/redesign/mobile_nav.tsx
View File

@@ -25,6 +25,7 @@ import { useAccount } from '@/mastodon/hooks/useAccount';
import { useIdentity } from '@/mastodon/identity_context';
import { selectUnreadNotificationGroupsCount } from '@/mastodon/selectors/notifications';
import { useAppDispatch, useAppSelector } from '@/mastodon/store';
import { invokeVirtualIosKeyboard } from '@/mastodon/utils/invoke_virtual_ios_keyboard';
import { RedesignNavigationPanel } from '.';
import { AccountMenuItems } from './account_card_and_menu';
@@ -59,6 +60,7 @@ export const RedesignMobileNavigation: React.FC = () => {
state: { focusTarget: FOCUS_TARGET.SEARCH },
}}
iconComponent={MagnifyingGlassIcon}
onClick={invokeVirtualIosKeyboard}
>
<FormattedMessage id='tabs_bar.search' defaultMessage='Search' />
</MobileNavLink>

9
app/javascript/mastodon/utils/invoke_virtual_ios_keyboard.module.css Normal file
View File

@@ -0,0 +1,9 @@
.dummyInput {
position: absolute;
top: 0;
width: 1px;
height: 1px;
overflow: hidden;
font-size: 16px;
opacity: 0.01;
}

16
app/javascript/mastodon/utils/invoke_virtual_ios_keyboard.ts Normal file
View File

@@ -0,0 +1,16 @@
import classes from './invoke_virtual_ios_keyboard.module.css';
export function invokeVirtualIosKeyboard() {
// To ensure that a virtual keyboard is shown on iOS when
// auto-focusing an input, we create a dummy input that
// we briefly attach to the DOM to capture focus, then let
// our regular FocusNavigationTarget handling take over.
const dummyInput = document.createElement('input');
dummyInput.className = classes.dummyInput ?? '';
dummyInput.onblur = () => {
// Cleanup: Remove the dummy input after focus was moved away from it
dummyInput.remove();
};
document.body.appendChild(dummyInput);
dummyInput.focus();
}