Zpět
6 min čtení

Testujeme, tedy jsme

Blogpost testovaniBlogpost testovani
Testování by mělo být neodmyslitelnou součástí procesu vývoje každého produktu. Někde je obcházeno, někde je bráno jen jako nutné zlo k tomu, abychom námi vymyšlenou věc dostali mezi lidi. Jinde zase může být testování docela radost a díky vhodně nastaveným procesům o něm ani nemusíme vědět. A to je zrovna náš případ.
Od
Robin Vysloužil
| 7. 1. 2020

Proč a jak?

Naše aplikace má nyní více než 60 000 řádků kódu. To už je docela velký objem řádků na to, abychom mohli něco pokazit neopatrnou změnou jedné řádky. Naší hlavní předností je automatizace. A rozhodli jsme se automatizovat nejen tvorbu reklam (což je primární záměr aplikace), ale i vnitřní vývojové procesy, jako například právě testování. Díky tomu se nemusíme bát toho, že jedna řádka zničí svět. Vše prochází důkladným a několikanásobným testováním během fází vývoje, až po dodání kódu do aplikace. A i po nasazení kódu v aplikaci se testuje dále.

Po každém commitu na github se aktivuje automatizovaná sada testů, které by měla odhalit chyby v kódu. Dá se vlastně říct, že s každým “odevzdáním kusu kódu” se začne testovat, jestli právě tento kousek nijak nerozbíjí naši aplikaci. Pokud se stane, že se náhodou něco pokazí (a to se stává - je to běžná součást procesu), tak se k nám dostane zpráva o tom, co se kde pokazilo. Pro tyto účely používáme CircleCI, díky kterému nemusíme neustále bezhlavě manuálně testovat, ale necháme to na něm a můžeme s klidem spát. Jo a taky nám to šetří moře času. Je vlastně úplně jedno, jakou formu CI kdo používá. Nám však vyhovuje konkrétně právě CircleCI a průběh testování vypadá cca podle obrázku níže.

https://blogadmin.ppcbee.com/rails/active_storage/representations/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaHBBbFVFIiwiZXhwIjpudWxsLCJwdXIiOiJibG9iX2lkIn19--8b99ad10d6bafd58c77489bad80d22eddda1a3a2/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaDdCam9VY21WemFYcGxYM1J2WDJ4cGJXbDBXd2RwQWxnQ2FRT2doZ0U9IiwiZXhwIjpudWxsLCJwdXIiOiJ2YXJpYXRpb24ifX0=--b1b529f8dfa4cfc5545b605b986d2f12cc3d32fa/pasted%20image%200.pnghttps://blogadmin.ppcbee.com/rails/active_storage/representations/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaHBBbFVFIiwiZXhwIjpudWxsLCJwdXIiOiJibG9iX2lkIn19--8b99ad10d6bafd58c77489bad80d22eddda1a3a2/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaDdCam9VY21WemFYcGxYM1J2WDJ4cGJXbDBXd2RwQXJBRWFRT2doZ0U9IiwiZXhwIjpudWxsLCJwdXIiOiJ2YXJpYXRpb24ifX0=--21b5f9fec4a1a26d9fca8e4bc575ac97c48ec932/pasted%20image%200.png
Nezávisle na tomto nám běží další sada testů vždycky v noci, abychom měli více a více jistoty, že i když nesaháme do kódu, vše funguje. Možností, jak by se aplikace mohla rozbít bez našeho zásahu je hromada, např. porucha hardwaru, změna API reklamních systémů. Spolu s těmito “nočními testy” (nightly builds) běží vizuální regresní testy na našem sandboxu, kde jsou uloženy všechny naše vizuální prvky v aplikaci, ale o tom už více níže.

Cypress a Percy jsou kámoši jak hrom

Testování můžeme rozdělit na backendové a frontendové, manuální a automatizované a všelijaké jiné další kombinace. U nás je nejvíce testů backendových, kterými vývojáři ověřují funkčnost drobných částí kódu, ale o těch dneska psát nebudeme. Následně je pak nejvíce frontendových testů, které pracují s aplikací jako s celkem a prakticky simulují chování uživatele a kontrolují, jestli při používání je vše validní tak, jakým způsobem to bylo navrženo. K takovému testování používáme Cypress, který se ukázal jako neocenitelný pomocník v boji proti bugům. Cypress testuje všechny “happy paths” v aplikaci - kompletní cesty od vytvoření datového zdroje, přes vytváření různých typů kampaní, až po testování rozličných variant nastavení generátorů klíčových slov a reklamních textů, finální synchronizaci a akce v tuneru. Jak může vypadat testování v Cypress:

https://blogadmin.ppcbee.com/rails/active_storage/representations/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaHBBbFlFIiwiZXhwIjpudWxsLCJwdXIiOiJibG9iX2lkIn19--f49d5fc53a18d409795fdc0882266ea4a00edc22/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaDdCam9VY21WemFYcGxYM1J2WDJ4cGJXbDBXd2RwQWxnQ2FRT2doZ0U9IiwiZXhwIjpudWxsLCJwdXIiOiJ2YXJpYXRpb24ifX0=--b1b529f8dfa4cfc5545b605b986d2f12cc3d32fa/cypress.gifhttps://blogadmin.ppcbee.com/rails/active_storage/representations/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaHBBbFlFIiwiZXhwIjpudWxsLCJwdXIiOiJibG9iX2lkIn19--f49d5fc53a18d409795fdc0882266ea4a00edc22/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaDdCam9VY21WemFYcGxYM1J2WDJ4cGJXbDBXd2RwQXJBRWFRT2doZ0U9IiwiZXhwIjpudWxsLCJwdXIiOiJ2YXJpYXRpb24ifX0=--21b5f9fec4a1a26d9fca8e4bc575ac97c48ec932/cypress.gif

Druhým takovým neocenitelným nástrojem, který používáme, je Percy, kterého využíváme právě na vizuální regresní testy. V praxi to znamená, že si označíme místa/stránky/části aplikace, které má Percy “vyfotit” a uložit jako referenční snímky. Jakmile se někde změní obsah stránky, např. změní se obsah některé komponenty, mění se textace, něco se nevyrenderuje, nebo se toho naopak vyrenderuje moc, Percy nás na toto upozorní a ukáže nám stavy před a po. My pak můžeme jednoduše vidět, kde se jaké komponenty změnily a jestli je tato změna správná, případně špatná. Pokud je správná, tak jen označíme nové snímky jako referenční a jedeme dál. Pokud je špatná, tak víme (nebo bychom aspoň měli vědět), co a kde přesně musíme opravit. Právě tento nástroj používáme také pro náš sandbox, kde je tento způsob testování více než na místě. Krásný příklad (i s vysvětlením) je k vidění zde.

Testujte taky!

Hodně lidí se bojí nových výzev, zejména těch, které si vezmou mnoho času při realizaci. Důkladné vytvoření testovacího prostředí a testovacích scénářů může být jedna z nich. Nicméně testování a všechny procesy s ním spojené jsou více než vhodně investovaný čas, který nám šetří nervy, čas a množství šedých vlasů v budoucnu. Rozhodně se toho nebojte a vynaložte na to svoje prostředky. Stojí to za to!

TL;DR

  • Testujeme, vy byste měli taky
  • Používáme CircleCI, Cypress a Percy, dále pak hromadu backendových testů
  • Testujeme, vy byste měli taky



Robinv
Robin Vysloužil
Editor PPC Bee

Související články

Další články

Videotutoriály v PPC Bee

Uvědomujeme si, že ačkoliv vám kampaně vytvořené v PPC Bee přinášejí vysoký výkon, jejich nastavení nemusí být pro každého úplně hračka. A proto každý den usilujeme o vylepšení PPC Bee tak, aby se vám s ní pracovalo co nejpříjemněji. Zároveň se snažíme o to, abyste měli vždycky po ruce někoho nebo něco, co vám s nastavováním účtu píchne, když si nebudete vědět rady.

Od Michaela Zákopčaníková 3. 8. 2017 | 3 min čtení

Další články

Nemáte datový feed? Odteď stačí Google Sheets

Je jedna věc, bez které se v PPC Bee při tvorbě produktových, kategorických i DSA kampaní v žádném případě neobejdete - datový zdroj. Co však dělat, pokud žádný XML či CSV feed nemáte? Nově vám stačí tabulka v Google Sheets.

Od Adam Vašenda10. 10. 2019 | 3 min čtení

Další články

Jak vytvořit brand kampaně v PPC Bee

Přemýšleli jste někdy nad tím, jak by se v PPC Bee dalo vytvořit brandovou kampaň? Do nedávna to úplně nebylo možné, avšak s možností využít Google Sheets jako datový zdroj to není problém!

Od Adam Vašenda10. 1. 2020 | 7 min čtení