mirror of
https://github.com/mauriceboe/TREK.git
synced 2026-10-22 06:56:35 +00:00
fix(forms): keep password managers out of a place's contact fields and the admin user forms
1Password filled the signed-in user's login into a place's e-mail field, and offered the admin's own credentials for an account being created. The fields now carry each manager's opt-out; autocomplete=off alone is ignored.
This commit is contained in:
@@ -73,5 +73,19 @@ describe('PlaceContactFields (#2472)', () => {
|
||||
await user.click(screen.getByRole('button', { name: 'Take over from the place details' }))
|
||||
expect(JSON.parse(onChange.mock.lastCall![1])).toEqual(looked)
|
||||
})
|
||||
|
||||
it('FE-PLANNER-CONTACT-005: the place\'s phone and e-mail keep password managers out', () => {
|
||||
render(<Harness onChange={vi.fn()} />)
|
||||
// A place's address is not the user's login; 1Password filled it in (5.0.0-pre.1 feedback).
|
||||
for (const label of ['Phone', 'E-mail']) {
|
||||
const field = screen.getByLabelText(label)
|
||||
expect(field).toHaveAttribute('data-1p-ignore', 'true')
|
||||
expect(field).toHaveAttribute('data-lpignore', 'true')
|
||||
expect(field).toHaveAttribute('data-bwignore', 'true')
|
||||
expect(field).toHaveAttribute('autocomplete', 'off')
|
||||
}
|
||||
// Still an e-mail field, so the keyboard and the browser's check stay.
|
||||
expect(screen.getByLabelText('E-mail')).toHaveAttribute('type', 'email')
|
||||
})
|
||||
})
|
||||
|
||||
|
||||
@@ -7,6 +7,7 @@ import { DialogSection, fs } from '../shared/DialogShell'
|
||||
import { AddRowButton, EditorField, GRID_2, INPUT } from '../shared/dialogParts'
|
||||
import { cleanWeek, readWeek, weekdayNames, writeWeek } from './placeHours'
|
||||
import { useTranslation } from '../../i18n'
|
||||
import { NO_AUTOFILL } from '../../utils/noAutofill'
|
||||
|
||||
interface Props {
|
||||
/** Anchor for the "add by hand" jump from an empty search. */
|
||||
@@ -80,14 +81,14 @@ export function PlaceContactFields({ id: anchorId, phone, email, openingHours, o
|
||||
<div className="relative">
|
||||
<Phone size={13} strokeWidth={2} className="pointer-events-none absolute start-3 top-1/2 -translate-y-1/2 text-content-faint" />
|
||||
<input id={`${id}-phone`} type="tel" value={phone} onChange={e => onChange('phone', e.target.value)}
|
||||
maxLength={50} placeholder="+49 …" className={`${INPUT} ps-8`} />
|
||||
maxLength={50} placeholder="+49 …" className={`${INPUT} ps-8`} {...NO_AUTOFILL} />
|
||||
</div>
|
||||
</EditorField>
|
||||
<EditorField label={t('places.formEmail')} htmlFor={`${id}-email`}>
|
||||
<div className="relative">
|
||||
<Mail size={13} strokeWidth={2} className="pointer-events-none absolute start-3 top-1/2 -translate-y-1/2 text-content-faint" />
|
||||
<input id={`${id}-email`} type="email" value={email} onChange={e => onChange('email', e.target.value)}
|
||||
maxLength={254} placeholder="info@…" className={`${INPUT} ps-8`} />
|
||||
maxLength={254} placeholder="info@…" className={`${INPUT} ps-8`} {...NO_AUTOFILL} />
|
||||
</div>
|
||||
</EditorField>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user