Add name/type=search to search inputs (autofill/a11y warning)
The room filter, message search, and channel-search inputs had neither id nor name — browsers warn and can't autofill correctly. Give each a name + type=search + autoComplete=off. Bump SW cache v12 -> v13.
This commit is contained in:
parent
a35884871f
commit
9be124a477
4 changed files with 4 additions and 4 deletions
|
|
@ -1,7 +1,7 @@
|
|||
// Tchatou service worker — installable PWA + offline app shell.
|
||||
// Scope: /app/. Only handles same-origin /app/ GETs; the IRC websocket and all
|
||||
// API calls (cloudflare, change_password, upload) pass straight through.
|
||||
const CACHE = 'tchatou-v12';
|
||||
const CACHE = 'tchatou-v13';
|
||||
const SHELL = ['/app/', '/app/index.html', '/app/favicon.svg', '/app/manifest.webmanifest'];
|
||||
|
||||
self.addEventListener('install', (e) => {
|
||||
|
|
|
|||
|
|
@ -88,7 +88,7 @@ export function Sidebar({ onNavigate }: { onNavigate: () => void }) {
|
|||
|
||||
<div className="side-search">
|
||||
<span className="side-search__icon">🔍</span>
|
||||
<input value={q} onChange={(e) => setQ(e.target.value)} placeholder="Rechercher" aria-label="Rechercher" />
|
||||
<input name="room-filter" type="search" autoComplete="off" value={q} onChange={(e) => setQ(e.target.value)} placeholder="Rechercher" aria-label="Rechercher" />
|
||||
</div>
|
||||
|
||||
<div className="pills">
|
||||
|
|
|
|||
|
|
@ -24,7 +24,7 @@ export function Topbar({ onMenu, onMembers }: { onMenu: () => void; onMembers: (
|
|||
<div className="topbar topbar--search">
|
||||
<button className="nav-toggle" onClick={onMenu} aria-label="Salons">☰</button>
|
||||
<span className="topbar__searchicon">🔍</span>
|
||||
<input className="topbar__searchinput" autoFocus placeholder={`Rechercher dans ${label}…`}
|
||||
<input className="topbar__searchinput" name="message-search" type="search" autoComplete="off" autoFocus placeholder={`Rechercher dans ${label}…`}
|
||||
value={search} onChange={(e) => setSearch(e.target.value)}
|
||||
onKeyDown={(e) => { if (e.key === 'Escape') { setSearch(''); setSearching(false); } }} />
|
||||
<button className="topbar__searchclose" onClick={() => { setSearch(''); setSearching(false); }} aria-label="Fermer la recherche">✕</button>
|
||||
|
|
|
|||
|
|
@ -78,7 +78,7 @@ function ExploreModal() {
|
|||
return (
|
||||
<Modal title="Explorer les salons" onClose={() => setModal('')}>
|
||||
<div className="set-inline" style={{ marginBottom: '.7rem' }}>
|
||||
<input className="modal__input" placeholder="Rechercher ou créer #salon…" value={q}
|
||||
<input className="modal__input" name="channel-search" type="search" autoComplete="off" placeholder="Rechercher ou créer #salon…" value={q}
|
||||
onChange={(e) => setQ(e.target.value)}
|
||||
onKeyDown={(e) => { if (e.key === 'Enter' && q.trim()) join(q); }} autoFocus />
|
||||
<button className="upbtn upbtn--primary" onClick={() => join(q)} disabled={!q.trim()}>Rejoindre</button>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue