Middle
Meséljen a böngészők közötti tesztelési tapasztalatáról.
sobes.tech MI
Válasz az MI-től
Keresztböngészős tesztelés — kötelező lépés a webalkalmazásoknál, amely biztosítja a helyes megjelenítést és funkcionalitást különböző böngészőkben és azok verzióiban.
Tapasztalatom magában foglalja:
-
Kézi tesztelés:
- Minden jelentős funkció- vagy UI-változtatás után kézzel ellenőriztem a kulcsfontosságú forgatókönyveket főbb böngészőkben (Chrome, Firefox, Edge, Safari) különböző operációs rendszereken (Windows, macOS, Linux) és képernyőfelbontásokon.
- Külön figyelmet fordítottam a CSS renderelésének sajátosságaira, a JavaScript működésére és az adaptív dizájnra.
- Fejlesztői eszközöket (Developer Tools) használtam hibakeresésre és problémák elemzésére különböző böngészőkben.
-
Tesztelés valódi eszközökön és virtuális környezetekben:
- Virtuális gépeket (pl. különböző Windows és macOS verziókkal) használtam régi böngészőverziók vagy speciális OS-konfigurációk tesztelésére.
- Emulátorokat és szimulátorokat (pl. Xcode Simulator iOS-Safari-hoz) alkalmaztam mobil eszközökhöz.
- Távoli szervereken lévő eszköz- és böngészőkezelő szolgáltatásokat (pl. BrowserStack, Sauce Labs) használtam a lefedettség bővítésére és a nagy számú valódi eszközön és böngészőben történő tesztelésre.
-
Keresztböngészős automatizálás:
- Automatizált teszteket integráltam CI/CD pipeline-ba, hogy minden nap vagy minden commit után futtassam őket különböző böngészőkben.
- Framework-okat használtam:
- Selenium WebDriver: különböző nyelveken írt tesztekhez (Java, Python, JavaScript) és azok futtatásához a megfelelő drivereken keresztül.
- Playwright és Cypress: újabb projektekben, gyorsabb és megbízhatóbb automatizáláshoz, különböző böngészők támogatásával "készletből".
- Multiplexálást vagy párhuzamos futtatást alkalmaztam különböző csomópontokon (pl. Selenium Grid vagy felhőalapú szolgáltatások) a futási idő csökkentése érdekében.
- Vizuális regressziók ellenőrzését automatizáltam eszközökkel (pl. Applitools, Percy), oldalképek összehasonlításával különböző böngészőkben.
-
Stratégia és eszközök meghatározása:
- Webanalitikát (Google Analytics) elemeztem a leggyakrabban használt böngészők és eszközök meghatározásához.
- Tesztmátrixot készítettem a szükséges böngésző-, OS- és eszközkombinációk listájával, az elemzések, projektkövetelmények és kockázatok alapján.
- Folyamatosan kutattam az új böngészőverziókat és azok sajátosságait, és ennek megfelelően alakítottam a tesztelési stratégiát.
Példa kód a Selenium teszt Chrome és Firefox futtatására:
// Feltételezve, hogy a TestNG vagy JUnit be van állítva
// és a megfelelő driverek (chromedriver, geckodriver) elérhetőek a PATH-ban
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.chrome.ChromeDriver;
import org.openqa.selenium.firefox.FirefoxDriver;
import org.testng.annotations.AfterMethod;
import org.testng.annotations.BeforeClass;
import org.testng.annotations.Parameters;
import org.testng.annotations.Test;
public class CrossBrowserTest {
WebDriver driver; // Driver változó deklarálása
@BeforeClass // Módszer a tesztek előtt fut
public void setup() {
// Driver utak beállítása, ha nem a PATH-ban vannak
// System.setProperty("webdriver.chrome.driver", "út/ahol/van/chromedriver");
// System.setProperty("webdriver.gecko.driver", "út/ahol/van/geckodriver");
}
// Módszer a driver inicializálására a "browser" paraméter szerint
@Parameters("browser") // Paraméter az XML konfigurációs fájlból
@Test // Teszt szkript
public void testHomepageTitle(String browserName) { // bemeneti paraméter a testng.xml-ből
if (browserName.equalsIgnoreCase("chrome")) {
driver = new ChromeDriver(); // Chrome driver inicializálása
} else if (browserName.equalsIgnoreCase("firefox")) {
driver = new FirefoxDriver(); // Firefox driver inicializálása
} else {
throw new IllegalArgumentException("Nem támogatott böngésző: " + browserName);
}
driver.manage().window().maximize(); // Böngészőablak maximalizálása
driver.get("https://www.example.com"); // URL megnyitása
// Az oldal címe ellenőrzése
String pageTitle = driver.getTitle();
System.out.println("Az oldal címe " + browserName + "-ben: " + pageTitle);
// Assert.assertEquals(pageTitle, "Example Domain"); // Ellenőrző állítások
// További lépések vagy ellenőrzések...
}
@AfterMethod // Módszer minden teszt után fut
public void tearDown() {
if (driver != null) {
driver.quit(); // Böngésző bezárása és a driver session lezárása
}
}
}
<!-- Példa testng.xml a Chrome és Firefox futtatására -->
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE suite SYSTEM "http://testng.org/testng-1.0.dtd">
<suite name="Cross Browser Suite"> <!-- Tesztcsomag neve -->
<test name="Chrome Test"> <!-- Külön Chrome teszt -->
<parameter name="browser" value="chrome"/> <!-- Böngésző kiválasztása paraméterként -->
<classes>
<class name="CrossBrowserTest"/> <!-- A tesztosztály hivatkozása -->
</classes>
</test>
<test name="Firefox Test"> <!-- Külön Firefox teszt -->
<parameter name="browser" value="firefox"/> <!-- Böngésző kiválasztása paraméterként -->
<classes>
<class name="CrossBrowserTest"/> <!-- A tesztosztály hivatkozása -->
</classes>
</test>
</suite>
A megközelítésem a keresztböngészős tesztelésben mindig a maximális lefedettség elérésére irányul a lehető legkisebb erőforrás-bevitellel, ötvözve a kézi ellenőrzéseket a finomhangoláshoz és az automatizálást a regressziós teszteléshez.