Gyakorlat – A felhasználói felületi tesztek futtatása helyileg és a folyamatban
Mielőtt Andy és Amita futtatják a teszteket a folyamatban, ellenőrizni szeretnék, hogy az új felhasználói felületi tesztjeik a kívánt módon működnek-e. Ebben a szakaszban a Selenium felhasználói felületi tesztjeinek helyi, majd a folyamatbeli futtatásával fogja követni.
Az automatizált tesztek írása iteratív folyamat, akárcsak bármilyen más típusú kód írása. Saját alkalmazásai esetében valószínűleg ki kell próbálnia néhány módszert, hivatkoznia kell a dokumentációra és a példakódra, és ki kell javítania a buildelési hibákat.
Nem kötelező: A Microsoft Edge szelénillesztőjének telepítése
Kövesse ezt a szakaszt, ha azt szeretné, hogy a tesztek helyileg fussanak a Microsoft Edge-en.
A NuGet-csomag a Chrome-hoz és a Firefoxhoz a bin könyvtár alá telepíti az illesztőprogram-szoftvert a lefordított tesztkód mellett. Az Edge esetében manuálisan kell telepítenie az illesztőprogramot. Ehhez tegye a következőket:
Nyissa meg az Edge-t, és lépjen a következőre
edge://settings/help: Jegyezze fel a verziószámot. Példa:
Lépjen a Microsoft Edge-illesztőprogram letöltési oldalára, és töltse le az Edge verziószámának megfelelő illesztőprogramot. Példa:
Bontsa ki a .zip fájlt a projekt Tailspin.SpaceGame.Web.UITests könyvtárában lévő bin/Release/net6.0 könyvtárba. Ha nem léteznek, hozza létre ezeket a könyvtárakat.
MacOS rendszeren előfordulhat, hogy frissítenie kell a rendszerházirendet az msedgedriver futtatásának engedélyezéséhez. Ehhez futtassa a következő spctl parancsot a Visual Studio Code-ban a terminálról:
spctl --add Tailspin.SpaceGame.Web.UITests/bin/Release/net6.0/msedgedriver
Környezeti változók exportálása
A modul későbbi részében szelénteszteket fog futtatni a Windows Server 2019-en. A dokumentáció felsorolja az Előre telepített szoftvereket.
A Selenium Web Drivers szakasz felsorolja a Chrome, a Firefox és az Edge rendszerhez elérhető szelénillesztő-verziókat. Példa:
Minden illesztőprogramhoz rendelkezik a környezeti változóval, amely az illesztőprogram helyéhez van leképezve. Leképezi például ChromeWebDriver a Chrome-illesztőprogram helyét.
Az egységtesztek kódja már be van állítva ezeknek a környezeti változóknak az olvasására. Ezek a változók jelzik a Seleniumnak, hogy hol találhatók az illesztőprogram végrehajtható fájljai. Az egységtesztek helyi futtatásához ugyanazokat a környezeti változókat kell exportálnia.
A Visual Studio Code-ból lépjen a terminálra. Ezután futtassa ezeket a parancsokat. Cserélje le a megjelenő útvonalat az mslearn-tailspin-spacegame-web-deploy projekt teljes elérési útjára.
Fontos
Mindenképpen futtassa ezeket a parancsokat, és állítsa be a környezeti változókat ugyanabban a terminálablakban, amelyet a tesztek futtatásához használ.
driverDir="C:\Users\user\mslearn-tailspin-spacegame-web-deploy\Tailspin.SpaceGame.Web.UITests\bin\Release\net6.0"
export ChromeWebDriver=$driverDir
export EdgeWebDriver=$driverDir
export GeckoWebDriver=$driverDir
A felhasználói felületi tesztek helyi futtatása
A Setup HomePageTest.cs metódusa a tagváltozó beállítása driver után a Space Game kezdőlapjára navigál.
Bár a webhely URL-címének kódját is meg tudta volna keményen kódolva, itt egy nevesített SITE_URLkörnyezeti változó url-címét olvashatjuk. Így a teszteket többször is futtathatja különböző URL-címeken.
// Navigate to the site.
// The site name is stored in the SITE_URL environment variable to make
// the tests more flexible.
string url = Environment.GetEnvironmentVariable("SITE_URL");
driver.Navigate().GoToUrl(url + "/");
Mivel még nem telepítette a Space Game webhelyet az App Service-környezetben, a Microsoft által üzemeltetett webhelyet fogja használni a tesztek helyi futtatásához.
A tesztek helyi futtatása:
A Visual Studio Code-ban lépjen az integrált terminálra, és nyisson meg egy új terminálablakot.
Futtassa az alábbi parancsokat az új terminálablakban.
dotnet build --configuration Release dotnet run --configuration Release --no-build --project Tailspin.SpaceGame.WebJegyezze fel a helyi webhely hivatkozását, ebben a példában az.
http://localhost:5000Váltson vissza arra a terminálablakra, ahol az előző lépésben beállította a környezeti változókat, és győződjön meg arról, hogy a projekt gyökérkönyvtárában van. Példa:
cd ~/mslearn-tailspin-spacegame-web-deployExportálja a környezeti változót
SITE_URL. Használja az előző lépésben kapott helyileg futó hivatkozást.export SITE_URL="http://localhost:5000"Ez a változó a Microsoft által üzemeltetett Space Game webhelyre mutat.
Futtassa a felhasználói felületi teszteket.
dotnet test --configuration Release Tailspin.SpaceGame.Web.UITestsEz a kód a Tailspin.SpaceGame.Web.UITests projektben található teszteket futtatja .
A tesztek futtatásakor egy vagy több böngésző jelenik meg. A szelén vezérli az egyes böngészőket, és követi a megadott tesztlépéseket.
Megjegyzés:
Ne aggódjon, ha mindhárom böngésző nem jelenik meg. Például nem fogja látni a teszteket a Chrome-on, ha nincs telepítve a Chrome, vagy nem kompatibilis verzióval rendelkezik. Ha csak egy böngészőt lát, biztos lehet abban, hogy a tesztek működnek. A gyakorlatban előfordulhat, hogy a helyi fejlesztési környezetben minden olyan böngészőt be szeretne állítani, amelyet tesztelni szeretne. Ezzel a beállítással ellenőrizheti, hogy a tesztek az egyes konfigurációkban elvárt módon működnek-e, mielőtt futtatja a teszteket a folyamatban.
A terminálból kövesse nyomon az egyes tesztek kimenetét. Jegyezze fel a tesztfuttatás összegzését is a végén.
Ez a példa azt mutatja, hogy kilenc tesztből mind a kilenc teszt sikeres volt, és a nulla teszt kimaradt:
Passed! - Failed: 0, Passed: 9, Skipped: 0, Total: 9, Duration: 5 s
A SITE_URL változó hozzáadása az Azure Pipelineshoz
Korábban helyileg állította be a SITE_URL környezeti változót, hogy a tesztek tudják, hová mutasson az egyes böngészők. Ezt a változót hozzáadhatja az Azure Pipelineshoz. A folyamat hasonló ahhoz, ahogyan változókat adott hozzá az App Service-példányokhoz. Az ügynök futtatásakor a rendszer automatikusan exportálja ezt a változót az ügynökbe környezeti változóként.
Most adhatja hozzá a folyamatváltozót, mielőtt frissítené a folyamatkonfigurációt. Ehhez tegye a következőket:
Az Azure DevOpsban nyissa meg a Space Game – Web – Funkcionális tesztek projektet.
A Folyamatok területen válassza a Kódtár lehetőséget.
Válassza ki a Kiadás változócsoportot.
A Változók csoportban válassza a + Hozzáadás lehetőséget.
A változó nevére írja be a SITE_URL. Értékként adja meg a tesztkörnyezetnek megfelelő App Service-példány URL-címét, példáulhttp://tailspin-space-game-web-test-10529.azurewebsites.net.
A lap tetején válassza a Mentés lehetőséget a változó folyamatba mentéséhez.
A változócsoportnak a következőhöz kell hasonlítania:
A folyamatkonfiguráció módosítása
Ebben a szakaszban úgy módosítja a folyamatkonfigurációt, hogy a tesztelési szakaszban futtassa a szelén felhasználói felületi tesztjeit.
Nyissa meg az azure-pipelines.yml fájlt a Visual Studio Code-ban. Ezután módosítsa a fájlt a következő módon:
Tipp.
Ez a fájl néhány módosítást tartalmaz, ezért javasoljuk, hogy cserélje le a teljes fájlt az itt láthatóra.
trigger: - '*' variables: buildConfiguration: 'Release' dotnetSdkVersion: '6.x' stages: - stage: 'Build' displayName: 'Build the web application' jobs: - job: 'Build' displayName: 'Build job' pool: vmImage: 'ubuntu-20.04' demands: - npm variables: wwwrootDir: 'Tailspin.SpaceGame.Web/wwwroot' dotnetSdkVersion: '6.x' steps: - task: UseDotNet@2 displayName: 'Use .NET SDK $(dotnetSdkVersion)' inputs: version: '$(dotnetSdkVersion)' - task: Npm@1 displayName: 'Run npm install' inputs: verbose: false - script: './node_modules/.bin/node-sass $(wwwrootDir) --output $(wwwrootDir)' displayName: 'Compile Sass assets' - task: gulp@1 displayName: 'Run gulp tasks' - script: 'echo "$(Build.DefinitionName), $(Build.BuildId), $(Build.BuildNumber)" > buildinfo.txt' displayName: 'Write build info' workingDirectory: $(wwwrootDir) - task: DotNetCoreCLI@2 displayName: 'Restore project dependencies' inputs: command: 'restore' projects: '**/*.csproj' - task: DotNetCoreCLI@2 displayName: 'Build the project - $(buildConfiguration)' inputs: command: 'build' arguments: '--no-restore --configuration $(buildConfiguration)' projects: '**/*.csproj' - task: DotNetCoreCLI@2 displayName: 'Publish the project - $(buildConfiguration)' inputs: command: 'publish' projects: '$(System.DefaultWorkingDirectory)/**/Tailspin.SpaceGame.Web.csproj' publishWebProjects: false arguments: '--no-build --configuration $(buildConfiguration) --output $(Build.ArtifactStagingDirectory)/$(buildConfiguration)' zipAfterPublish: true - publish: '$(Build.ArtifactStagingDirectory)' artifact: drop - stage: 'Dev' displayName: 'Deploy to the dev environment' dependsOn: Build jobs: - deployment: Deploy pool: vmImage: 'ubuntu-20.04' environment: dev variables: - group: Release strategy: runOnce: deploy: steps: - download: current artifact: drop - task: AzureWebApp@1 displayName: 'Azure App Service Deploy: website' inputs: azureSubscription: 'Resource Manager - Tailspin - Space Game' appName: '$(WebAppNameDev)' package: '$(Pipeline.Workspace)/drop/$(buildConfiguration)/*.zip' - stage: 'Test' displayName: 'Deploy to the test environment' dependsOn: Dev jobs: - deployment: Deploy pool: vmImage: 'ubuntu-20.04' environment: test variables: - group: 'Release' strategy: runOnce: deploy: steps: - download: current artifact: drop - task: AzureWebApp@1 displayName: 'Azure App Service Deploy: website' inputs: azureSubscription: 'Resource Manager - Tailspin - Space Game' appName: '$(WebAppNameTest)' package: '$(Pipeline.Workspace)/drop/$(buildConfiguration)/*.zip' - job: RunUITests dependsOn: Deploy displayName: 'Run UI tests' pool: vmImage: 'windows-2019' variables: - group: 'Release' steps: - task: UseDotNet@2 displayName: 'Use .NET SDK $(dotnetSdkVersion)' inputs: version: '$(dotnetSdkVersion)' - task: DotNetCoreCLI@2 displayName: 'Build the project - $(buildConfiguration)' inputs: command: 'build' arguments: '--configuration $(buildConfiguration)' projects: '$(System.DefaultWorkingDirectory)/**/*UITests.csproj' - task: DotNetCoreCLI@2 displayName: 'Run unit tests - $(buildConfiguration)' inputs: command: 'test' arguments: '--no-build --configuration $(buildConfiguration)' publishTestResults: true projects: '$(System.DefaultWorkingDirectory)/**/*UITests.csproj' - stage: 'Staging' displayName: 'Deploy to the staging environment' dependsOn: Test jobs: - deployment: Deploy pool: vmImage: 'ubuntu-20.04' environment: staging variables: - group: 'Release' strategy: runOnce: deploy: steps: - download: current artifact: drop - task: AzureWebApp@1 displayName: 'Azure App Service Deploy: website' inputs: azureSubscription: 'Resource Manager - Tailspin - Space Game' appName: '$(WebAppNameStaging)' package: '$(Pipeline.Workspace)/drop/$(buildConfiguration)/*.zip'A fájl a következő három módosítást tartalmazza:
A
dotnetSdkVersionváltozó a fájl tetejére kerül, hogy több szakasz is hozzáférhessen. Itt a buildelési és tesztelési fázishoz a .NET Core ezen verziója szükséges.A Build szakasz csak a Space Game webhelycsomagot teszi közzé buildösszetevőként. Korábban a következőképpen tette közzé az összetevőket:
- task: DotNetCoreCLI@2 displayName: 'Publish the project - $(buildConfiguration)' inputs: command: 'publish' projects: '**/*.csproj' publishWebProjects: false arguments: '--no-build --configuration $(buildConfiguration) --output $(Build.ArtifactStagingDirectory)/$(buildConfiguration)' zipAfterPublish: trueEz a feladat két buildösszetevőt hoz létre: a Space Game webhelycsomagját és a lefordított felhasználói felületi teszteket. A felhasználói felületi teszteket a buildelési szakaszban készítjük el, hogy biztosan lefordítva legyenek a tesztelési szakaszban, de nem kell közzétennünk a lefordított tesztkódot. A teszt futtatásakor a tesztszakaszban újra elkészítjük.
A tesztszakasz tartalmaz egy második feladatot, amely létrehozza és futtatja a teszteket. Ez a feladat hasonlít az Azure Pipelines-modullal a buildelési folyamat Minőségi tesztjeinek futtatása során használt feladathoz . Ebben a modulban NUnit-teszteket futtatott, amelyek igazolták a ranglista szűrési funkcióját.
Ne feledje, hogy az üzembehelyezési feladat egy speciális feladattípus, amely fontos szerepet játszik az üzembe helyezési fázisokban. A második feladat egy normál feladat, amely egy Windows Server 2019-ügynök szeléntesztjeit futtatja. Bár az alkalmazás létrehozásához Linux-ügynököt használunk, itt egy Windows-ügynökkel futtatjuk a felhasználói felületi teszteket. Windows-ügynököt használunk, mert az Amita manuális teszteket futtat a Windowson, és ezt használják a legtöbb ügyfél.
A
RunUITestsfeladat attól függ, hogy aDeployfeladatok a megfelelő sorrendben futnak-e. A felhasználói felületi tesztek futtatása előtt üzembe helyezi a webhelyet az App Service-ben. Ha nem adja meg ezt a függőséget, a fázison belüli feladatok bármilyen sorrendben futtathatók, vagy párhuzamosan futtathatók.
Az integrált terminálban adja hozzá az azure-pipelines.yml értéket az indexhez, véglegesítse a módosításokat, és küldje el az ágat a GitHubra.
git add azure-pipelines.yml git commit -m "Run Selenium UI tests" git push origin selenium
A tesztek végigkövetése az Azure Pipelinesban
Itt megtekintheti a folyamat futtatását. A folyamat a tesztelési szakaszban futtatja a szelén felhasználói felületi teszteket.
Az Azure Pipelinesban nyissa meg a buildet, és kövesse nyomon futás közben.
A buildelés során az automatikus tesztek a webhely üzembe helyezése után futnak.
A build befejezése után lépjen az összefoglaló oldalra.
Vegye figyelembe, hogy az üzembe helyezés és a felhasználói felület tesztelése sikeresen befejeződött.
A lap tetejének közelében jegyezze fel az összegzést.
Vegye figyelembe, hogy a Space Game webhely buildösszetevője ugyanúgy jelenik meg, mint mindig. Jegyezze fel a Tesztek és lefedettség szakaszt is, amely azt mutatja, hogy a szeléntesztek sikeresek.
A teljes jelentés megtekintéséhez válassza ki a teszt összefoglalását.
A jelentés azt mutatja, hogy mind a kilenc teszt sikeres volt. Ezek a tesztek három tesztet tartalmaznak három böngészőben.
Ha bármelyik teszt sikertelen, részletes eredményeket kap a hibáról. Innen megvizsgálhatja a hiba forrását, kijavíthatja helyileg, majd leküldheti a szükséges módosításokat, hogy a tesztek áthaladjanak a folyamaton.
Amita: Ez az automatizálás izgalmas! Most már rendelkezem felhasználói felületi tesztekkel, amelyeket futtathatok a folyamatban. A tesztek hosszú távon tényleg időt takarítanak meg. Én is van egy mintát követni, hogy adjunk hozzá további teszteket. A legjobb az, hogy a felhasználói felületi tesztek magabiztosságot adnak a kódminőségünkben.
Andy: Minden igaz. Ne feledje, hogy az ismétlődően manuálisan futtatott tesztek jó jelöltek az automatizálásra. Sok szerencsét hozzá több. Ha elakad, vagy szüksége van egy kód véleményezőre, tudja, hol talál meg.