Kako pravilno testirati polje za unos email adrese…

Testiranje polja za unos email adrese uključuje proveru funkcionalnosti, validacije, korisničkog iskustva i bezbednosti.

Funkcionalno testiranje:

Unos validnih adresa:
- 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.демо (podrška IDN)
Unos nevalidnih adresa:
- Nedostatak @: testexample.com
- Više @: test@@example.com
- Neispravan format domena: test@example
- Nedostatak korisničkog imena: @example.com
- Specijalni karakteri u korisničkom imenu: te!st@example.com, te#st@example.com
- Specijalni karakteri u domeni: test@exa!mple.com
- Duga adresa (provera limita): a_very_long_email_address_that_exceeds_typical_limits@example.com
- Adresa sa razmacima: test @example.com
- Neispravna sintaksa: test@.com, test.@example.com
- Adresa sa IP umesto domena (ako nije podržano): test@[192.168.1.1]
- Adresa sa ćirilicom (ako nije podržano IDN): тест@пример.рф
Prazno polje: slanje forme sa praznim poljem.

Validacija:

Provera da li uneseni podaci odgovaraju sintaksi emaila (regularni izrazi).
Prikaz poruka o grešci korisniku pri unosu nevalidnih podataka.
Provera tačnosti i razumljivosti poruka o grešci.
Provera da li forma nije poslata pri greškama validacije.

Korisničko iskustvo & UI/UX:

Fokus na polje pri učitavanju stranice (ako je prikladno).
Tekst za placeholder sa primerom formata (npr., user@example.com).
Podrška automatskom popunjavanju od strane pretraživača.
Postojanje oznake (<label>) za polje.
Korisnik ne može unositi nedozvoljene karaktere (ako postoji takva logika na frontendu).
Ako postoji maska za unos, proveriti njen rad.

Bezbednost:

Provera na XSS ranjivosti: unos skripti, HTML tagova (<script>alert('XSS')</script>) u polje.
Provera na injekcije (SQL/NoSQL): unos specijalnih karaktera koji mogu uticati na zahteve ka bazi podataka (' OR '1'='1).
Ograničenje broja pokušaja (ako forma šalje email ili vrši zahtevne radnje): ograničenje broja pokušaja sa jedne IP adrese ili korisnika.

Automatizacija:

Pisanje jedinicnih testova za funkcije validacije emaila.
Pisanje integracionih testova za proveru rada polja u okviru forme.
Pisanje E2E testova za celokupni scenario korišćenja forme sa poljem email.

Primer koda za jedinicni test validacije:

// Pretpostavljamo da imamo funkciju validateEmail
function validateEmail(email) {
  const re = /\S+@\S+\.\S+/; // Jednostavan primer regularnog izraza
  return re.test(email);
}

// Jedinicni testovi sa Jest
describe('validateEmail', () => {
  test('treba da vrati true za validan email', () => {
    expect(validateEmail('test@example.com')).toBe(true);
    expect(validateEmail('firstname.lastname@example.com')).toBe(true);
  });

  test('treba da vrati false za nevalidan email', () => {
    expect(validateEmail('testexample.com')).toBe(false);
    expect(validateEmail('test@example')).toBe(false);
    expect(validateEmail('@example.com')).toBe(false);
  });

  test('treba da vrati false za prazan string', () => {
    expect(validateEmail('')).toBe(false);
  });
});

Primer E2E testa sa Cypress:

// cypress/integration/email_field.spec.js
describe('Email Input Field', () => {
  it('ispravno validira i prikazuje grešku za nevalidan unos', () => {
    cy.visit('/your-form-page'); // URL stranice sa formom
    cy.get('#email-input').type('invalid-email'); // Unos nevalidnog emaila
    cy.get('button[type="submit"]').click(); // Klik na dugme za slanje
    cy.get('.error-message').should('be.visible').and('contain', 'Neispravan format emaila'); // Provera poruke o grešci
  });

  it('dozvoljava slanje forme sa validnim emailom', () => {
    cy.visit('/your-form-page');
    cy.get('#email-input').type('valid@example.com');
    cy.get('button[type="submit"]').click();
    // Dalje provere: redirect, poruka o uspehu
    cy.url().should('include', '/uspeh'); // Provera URL-a nakon slanja
  });
});

Tabela sa primerima test slučajeva:

ID	Korisnička radnja	Očekivani rezultat
TC_01	Unos `test@example.com`	Polje se smatra validnim. Forma se može poslati.
TC_02	Unos `invalid-email`	Polje se smatra nevalidnim. Prikazuje se poruka o grešci.
TC_03	Prazno polje i pokušaj slanja forme	Polje se smatra nevalidnim (ako je obavezno). Prikazuje se greška.
TC_04	Unos `test@example.co.uk`	Polje se smatra validnim.
TC_05	Unos `<script>alert('XSS')</script>`	Skripta ne sme biti izvršena. Polje treba biti sanitizovano ili validirano.

Takođe je potrebno uzeti u obzir specifične zahteve projekta (npr. podrška određenim domenima, osetljivost na velika i mala slova), testiranje na različitim uređajima i pretraživačima.

Kako pravilno testirati polje za unos email adrese?