Virheen tunnistaminen

Silktide tarkastelee pakollisia lomakekenttiä, jotka vaikuttavat käyttävän mukautettua validointia selaimen sisäänrakennetun tarkistuksen sijaan, ja varoittaa, jos virheilmoitus ei ilmeisesti tavoita avustavaa teknologiaa käyttäviä henkilöitä.

Miksi tämä on tärkeää

Kun lomake hylkää virheellisen vastauksen, näkevät käyttäjät yleensä punaisen reunuksen tai viestin kentän lähellä. käyttävä käyttäjä ei saa tästä mitään tietoa, ellei sivu välitä virhettä koodissa: lomake ei vain lähetä, eikä kerro, mikä meni pieleen tai missä. Tuloksena on lomake, joka sulkee osan kävijöistä hiljaisesti ulkopuolelle.

Selaimet ilmoittavat omat sisäänrakennetut validointiviestinsä automaattisesti. Riski syntyy, kun sivu poistaa tämän käytöstä tai korvaa sen omalla validoinnillaan ja unohtaa yhdistää korvaavan ratkaisun .

Korjaaminen

Anna jokaiselle mukautetusti validoidulle kentälle ohjelmallinen reitti sen virheilmoitukselle käyttämällä :

<!-- Ongelma: mukautettu validointi ilman saavutettavaa virhekanavaa -->
<form novalidate>
  <input type="text" required>
  <span class="error">Kirjoita nimesi</span>
</form>

<!-- Korjaus: kenttä viittaa virheilmoitukseensa -->
<form novalidate>
  <input type="text" required aria-describedby="name-error">
  <span id="name-error" class="error">Kirjoita nimesi</span>
</form>

Mikä tahansa näistä täyttää tarkistuksen:

Kentässä oleva aria-errormessage, joka viittaa elementtiin, johon lisäät virhetekstin (aseta aria-invalid="true", kun virhe näytetään).
Kentässä oleva aria-describedby, joka viittaa viestielementtiin.
Lomakkeen sisällä oleva eli elementti, jossa on role="alert", role="status" tai aria-live ja johon validointi kirjoittaa virhetekstin.

Vaihtoehtoisesti voit poistaa mukautuksen ja antaa selaimen natiivin validoinnin ilmoittaa virheistä, mikä on oletusarvoisesti saavutettavaa.

Miten Silktide testaa tämän

Etsi näkyvät pakolliset kentät: syötekentät, tekstialueet ja valikot, jotka on merkitty määritteellä required tai aria-required="true".
Säilytä vain kentät, joissa on merkkejä siitä, että selaimen natiivi validointi ohitetaan tai korvataan: lomakkeessa on novalidate, lähetyspainikkeessa on formnovalidate, kenttä on merkitty aria-invalid, se käyttää aria-required-määritettä ilman natiivia required-määritettä tai kentässä tai lomakkeessa on mukautettuun validointiin viittaavia merkkejä (kuten virheisiin liittyviä määritteitä tai virheilmoitussäilöjä).
Etsi jokaiselle tällaiselle kentälle saavutettava virhekanava: kelvollinen aria-errormessage-viittaus, kelvollinen aria-describedby-viittaus tai lomakkeen sisällä oleva live-alue.
Varoita kentistä, joilla ei ole mitään näistä. Tämä on varoitus eikä vahvistettu virhe, koska ajonaikaista validointikäyttäytymistä ei voida täysin havaita sivun koodista.

Vianmääritys

Virheeni ilmoitetaan oikein

Tarkistus etsii ilmoitukset mahdollistavaa rakennetta, ei itse ilmoitusta. Jos kehyksesi lisää live-alueen tai ARIA-viittaukset vasta virheen tapahtuessa, ladatulla sivulla ei näy kanavaa, ja kenttä merkitään. Lisäämällä (tyhjän) viestielementin ja viittauksen etukäteen ratkaiset tämän, ja ratkaisu on myös luotettavampi.

Viitattua viestielementtiä ei vielä ole

Viittausten on osoitettava sivulla oleviin elementteihin. Jos aria-describedby viittaa tunnukseen, joka luodaan vasta myöhemmin, se katsotaan puuttuvaksi kanavaksi.