Kaip teisingai išbandyti el. pašto adreso įvedimo…

El. pašto lauko testavimas apima funkcionalumo, validacijos, naudotojo patogumo ir saugumo patikrinimus:

Funkcinis testavimas:

Tinkamų adresų įvedimas:
- test@example.com
- firstname.lastname@example.com
- email@subdomain.example.com
- firstname+lastname@example.com
- email@example.co.uk
- email@example.museum
- email@example.name
- email@example.žemė (tarptautinių domenų vardų palaikymas - IDN)
Netinkamų adresų įvedimas:
- Trūksta @: testexample.com
- Kelios @: test@@example.com
- Netinkamas formato domenas: test@example
- Vartotojo vardo trūkumas: @example.com
- Specialieji simboliai vartotojo varde: te!st@example.com, te#st@example.com
- Specialieji simboliai domene: test@exa!mple.com
- Ilgas adresas (ribojimų patikrinimas): a_very_long_email_address_that_exceeds_typical_limits@example.com
- Adresas su tarpeliais: test @example.com
- Sintaksės klaida adrese: test@.com, test.@example.com
- Adresas su IP adresu (jei nepalaikoma): test@[192.168.1.1]
- Adresas su kirilica (jei IDN nepalaikoma): тест@пример.рф
Tuščias laukas: pateikus formą su tuščiu lauku.

Validacija:

Tikrinama, ar įvestas el. pašto sintaksė atitinka (naudojant reguliarias išraiškas):
Rodo klaidų pranešimus naudotojui įvedus netinkamus duomenis:
Tikslumo ir aiškumo patikrinimas klaidų pranešimuose:
Jei yra validacijos klaidų, forma neturi būti siunčiama:

Naudojimo patogumas ir UI/UX:

Fokuso nustatymas lauke įkeliant puslapį:
Pavyzdinis tekstas (pavyzdžiui, user@example.com):
Naršyklės automatinio užpildymo palaikymas:
<label> žymės buvimas:
Vartotojas negali įvesti neleistinų simbolių:
Jei yra įvesties maska, ją patikrinti:

Sauga:

XSS pažeidžiamumo patikrinimas: skriptų, HTML žymų įvedimas (<script>alert('XSS')</script>):
SQL/NoSQL injekcijų patikrinimas: specifinių simbolių įvedimas:
Greičio ribojimas (jei forma siunčia el. paštą ar atlieka resursų intensyvius veiksmus): IP ar naudotojo lygyje:

Automatizavimas:

El. pašto validacijos funkcijų vienetinių testų rašymas:
Integracinių testų rašymas, patikrinant lauko darbą formos kontekste:
Visos formos scenarijų E2E testų rašymas:

Pavyzdinis kodas el. pašto validacijos vienetiniams testams:

// Tarkime, turime funkciją validateEmail
function validateEmail(email) {
  const re = /\S+@\S+\.\S+/; // Paprastas reguliarios išraiškos pavyzdys
  return re.test(email);
}

// Vienetinių testų su Jest pavyzdys
describe('validateEmail', () => {
  test('turėtų grąžinti true tinkamam el. paštui', () => {
    expect(validateEmail('test@example.com')).toBe(true);
    expect(validateEmail('firstname.lastname@example.com')).toBe(true);
  });

  test('turėtų grąžinti false netinkamam el. paštui', () => {
    expect(validateEmail('testexample.com')).toBe(false);
    expect(validateEmail('test@example')).toBe(false);
    expect(validateEmail('@example.com')).toBe(false);
  });

  test('turėtų grąžinti false tuščiam stringui', () => {
    expect(validateEmail('')).toBe(false);
  });
});

E2E testų pavyzdys naudojant Cypress:

// cypress/integration/email_field.spec.js
describe('Email Input Field', () => {
  it('teisingai validuoja ir rodo klaidą netinkamam įvedimui', () => {
    cy.visit('/your-form-page'); // Puslapio URL
    cy.get('#email-input').type('netinkamas-el-pastas'); // Netinkamas el. paštas
    cy.get('button[type="submit"]').click(); // Siuntimo mygtukas
    cy.get('.error-message').should('būti matomas').and('turėti', 'Netinkamas formatas'); // Klaidos pranešimo patikrinimas
  });

  it('leidžia pateikti formą su tinkamu el. pašto adresu', () => {
    cy.visit('/your-form-page');
    cy.get('#email-input').type('tinkamas@elpastas.lt');
    cy.get('button[type="submit"]').click();
    // Tolimesni patikrinimai: pavyzdžiui, nukreipimas, sėkmingo siuntimo pranešimas
    cy.url().should('apimti', '/sėkmė'); // URL patikrinimas
  });
});

Testų atvejų lentelė:

ID	Vartotojo veiksmas	Laukiamas rezultatas
TC_01	Įvesti `test@example.com`	Laukas laikomas galiojančiu. Forma siunčiama (jei visi laukai užpildyti).
TC_02	Įvesti `netinkamas-el-pastas`	Laukas laikomas negaliojančiu. Rodo klaidos pranešimą.
TC_03	Palikti lauką tuščią ir bandyti siųsti formą	Laukas laikomas negaliojančiu (jei būtinas). Rodo klaidos pranešimą.
TC_04	Įvesti `test@example.co.uk`	Laukas laikomas galiojančiu.
TC_05	Įvesti `<script>alert('XSS')</script>`	Skriptas neturi būti vykdomas. Laukas turi būti sanituotas arba validuotas.

Reikia atsižvelgti į projekto specifinius reikalavimus (pvz., tam tikrų domenų palaikymas), testavimą skirtinguose įrenginiuose ir naršyklėse.

Kaip teisingai išbandyti el. pašto adreso įvedimo lauką?