{"id":17058,"date":"2022-11-30T05:00:00","date_gmt":"2022-11-30T04:00:00","guid":{"rendered":"https:\/\/sii.pl\/blog\/?p=17058"},"modified":"2023-02-16T13:37:24","modified_gmt":"2023-02-16T12:37:24","slug":"czy-tosca-i-podobne-rozwiazania-codeless-sa-przyszloscia-testowania","status":"publish","type":"post","link":"https:\/\/sii.pl\/blog\/czy-tosca-i-podobne-rozwiazania-codeless-sa-przyszloscia-testowania\/","title":{"rendered":"Czy Tosca i podobne rozwi\u0105zania codeless s\u0105 przysz\u0142o\u015bci\u0105 testowania?"},"content":{"rendered":"\n<p>Poj\u0119cia takie jak \u201ecodeless\u201d, \u201elow-code\u201d czy \u201cno-code\u201d mo\u017cemy ostatnimi czasy spotka\u0107 praktycznie w ka\u017cdej dziedzinie \u015bwiata IT. Rozwi\u0105zania, kt\u00f3re pozwalaj\u0105 tworzy\u0107 strony internetowe czy aplikacje mobilne bez pisania kodu, s\u0105 cz\u0119sto reklamowane jako przysz\u0142o\u015b\u0107 naszej bran\u017cy. O podej\u015bciu \u201ecodeless\u201d m\u00f3wi si\u0119 coraz cz\u0119\u015bciej r\u00f3wnie\u017c w odniesieniu do sektora DevOps czy QA.<\/p>\n\n\n\n<p>Jako Test Development Engineer\u00f3w, zainspirowa\u0142o nas to do postawienia sobie pytania: \u201eCzy rozwi\u0105zania codeless s\u0105 przysz\u0142o\u015bci\u0105 testowania?\u201d. Nasze przemy\u015blenia w tym temacie postaramy si\u0119 zaprezentowa\u0107 w niniejszym artykule, <strong>por\u00f3wnuj\u0105c ze sob\u0105 dwa \u201enarz\u0119dzia\u201d<\/strong> reprezentuj\u0105ce skrajne podej\u015bcia do tematu automatyzacji test\u00f3w \u2013 <strong>Tosc\u0119 oraz Cypressa<\/strong>.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Co rozumiemy przez \u201ecodeless\u201d?<\/strong><\/h2>\n\n\n\n<p>Par\u0119 miesi\u0119cy temu, na jednej z konferencji, w kt\u00f3rej mieli\u015bmy okazj\u0119 uczestniczy\u0107, prowadz\u0105cy zada\u0142 widowni pytanie: \u201eCzy WordPress jest narz\u0119dziem codeless?\u201d. Dyskusja, kt\u00f3ra rozgorza\u0142a w tym momencie, dosy\u0107 szybko pokaza\u0142a, \u017ce <strong>ka\u017cdy definiuje narz\u0119dzia typu \u201eno-code\u201d troch\u0119 inaczej<\/strong>. Cz\u0119\u015b\u0107 publiczno\u015bci uwa\u017ca\u0142a, \u017ce \u201etak, WordPress jest narz\u0119dziem typu codeless, bo pozwala bez znajomo\u015bci programowania stworzy\u0107 w pe\u0142ni funkcjonaln\u0105 stron\u0119 internetow\u0105\u201d. Inni natomiast uwa\u017cali, \u017ce nie do ko\u0144ca \u2013 bo je\u017celi natrafimy na problem, kt\u00f3rego nie b\u0119dzie mo\u017cna rozwi\u0105za\u0107 przy pomocy gotowego rozszerzenia czy wbudowanej funkcjonalno\u015bci, to koniec ko\u0144c\u00f3w b\u0119dziemy musieli odpowiedni kawa\u0142ek kodu dopisa\u0107 sami.<\/p>\n\n\n\n<p>Osobi\u015bcie, doszli\u015bmy do wniosku, \u017ce jedna i druga strona maj\u0105 racj\u0119. <strong>Jak zatem poprawnie zdefiniowa\u0107 narz\u0119dzia typu \u201ecodeless\u201d?<\/strong> Nie mog\u0105c znale\u017a\u0107 satysfakcjonuj\u0105cej nas definicji, postanowili\u015bmy na bazie innych, stworzy\u0107 w\u0142asn\u0105:<\/p>\n\n\n\n<blockquote class=\"wp-block-quote is-layout-flow wp-block-quote-is-layout-flow\"><p><em>Rozwi\u0105zania codeless to nowoczesne narz\u0119dzia pozwalaj\u0105ce na budowanie aplikacji bez u\u017cycia kodu lub umo\u017cliwiaj\u0105ce korzystanie z gotowych funkcjonalno\u015bci i komponent\u00f3w aplikacji, ograniczaj\u0105c konieczno\u015b\u0107 pisania kodu do minimum.<\/em><\/p><\/blockquote>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Podej\u015bcie klasyczne<\/strong><\/h2>\n\n\n\n<p>W niniejszym artykule zestawimy ze sob\u0105 dwa sposoby rozwi\u0105zania tego samego zadania \u2013 <strong>zautomatyzowania testu wyszukiwania ofert pracy<\/strong> na jednej z podstron sii.pl. Pierwszy spos\u00f3b wykorzysta narz\u0119dzie codeless, jakim jest Tricentis Tosca,&nbsp;drugie rozwi\u0105zanie zostanie stworzone w oparciu o Cypressa i JavaScript.<\/p>\n\n\n\n<p>Na potrzeby naszych rozwa\u017ca\u0144, postanowili\u015bmy okre\u015bli\u0107 drugie podej\u015bcie mianem \u201eklasycznego\u201d, poniewa\u017c taki spos\u00f3b tworzenia test\u00f3w automatycznych (pisanie skrypt\u00f3w przy pomocy wybranego frameworka) by\u0142 do tej pory najpopularniejszy i zdecydowanie dominowa\u0142 w wi\u0119kszo\u015bci prowadzonych w sektorze IT projekt\u00f3w.<\/p>\n\n\n\n<p>Oczywi\u015bcie sam framework nie wystarczy. Musimy r\u00f3wnie\u017c zna\u0107 (przynajmniej podstawy) wybranego j\u0119zyka programowania, wspieranego przez wybrane przez nas narz\u0119dzie. Dodatkowo pami\u0119ta\u0107 nale\u017cy, \u017ce tworzone testy b\u0119d\u0105 wpisywa\u0142y si\u0119 w <strong>szerszy stos technologiczny<\/strong>, z kt\u00f3rego korzysta ca\u0142y nasz zesp\u00f3\u0142\/firma.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Opis scenariusza testowego<\/strong><\/h2>\n\n\n\n<p>Test, kt\u00f3ry wykorzystamy przy por\u00f3wnywaniu dw\u00f3ch wymienionych wcze\u015bniej podej\u015b\u0107, b\u0119dzie polega\u0142 na:<\/p>\n\n\n\n<ol class=\"wp-block-list\"><li>Wej\u015bciu na stron\u0119 sii.pl.<\/li><li>Wybraniu z g\u00f3rnego menu opcji \u201eKARIERA\u201d.<\/li><li>Wybraniu z rozwini\u0119tego podmenu opcji \u201eOferty pracy\u201d.<\/li><li>Wpisaniu w pole wyszukiwania frazy \u201eQA\u201d.<\/li><li>Wybraniu z filtr\u00f3w lokalizacji miasta \u201eBydgoszcz\u201d.<\/li><li>Klikni\u0119ciu w przycisk wyszukiwania.<\/li><li>Weryfikacji, czy na stronie znaleziono minimum jedn\u0105 ofert\u0119 pracy dla podanych kryteri\u00f3w wyszukiwania.<\/li><\/ol>\n\n\n\n<p>Wykonanie powy\u017cszych krok\u00f3w zaprezentowano na nagraniu:<\/p>\n\n\n\n<figure class=\"wp-block-embed aligncenter is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio\"><div class=\"wp-block-embed__wrapper\">\n<iframe title=\"Czy Tosca i podobne rozwi\u0105zania codeless s\u0105 przysz\u0142o\u015bci\u0105 testowania?\" width=\"500\" height=\"281\" src=\"https:\/\/www.youtube.com\/embed\/FnYuS-p8P78?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" referrerpolicy=\"strict-origin-when-cross-origin\" allowfullscreen><\/iframe>\n<\/div><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Praca nad scenariuszem testowym<\/strong><\/h2>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Przed rozpocz\u0119ciem pracy<\/strong><\/h3>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Rozwi\u0105zanie Tosca<\/strong><\/h3>\n\n\n\n<p>Po zainstalowaniu Tricentis Tosca, pierwsz\u0105 czynno\u015bci\u0105, kt\u00f3r\u0105 musimy wykona\u0107 w celu stworzenia naszego testu, jest utworzenie nowego Workspace\u2019a. W tym celu uruchamiamy Tosca Commander i klikamy przycisk \u201eCreate New\u201d.<br>W oknie konfiguracji Workspace\u2019a wskazujemy jego lokalizacj\u0119 na dysku [1], nazw\u0119 [2] oraz Workspace Template [3], z kt\u00f3rego b\u0119dziemy korzysta\u0107.<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large is-resized\"><a href=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_01.png\"><img decoding=\"async\" src=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_01-1024x840.png\" alt=\"Tosca \u2013 Okno konfiguracyjne \u201cCreate new workspace\" class=\"wp-image-17085\" width=\"840\" height=\"689\" srcset=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_01-1024x840.png 1024w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_01-300x246.png 300w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_01-768x630.png 768w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_01.png 1044w\" sizes=\"(max-width: 840px) 100vw, 840px\" \/><\/a><figcaption>Ryc. 1 Tosca \u2013 Okno konfiguracyjne \u201cCreate new workspace&#8221;<\/figcaption><\/figure><\/div>\n\n\n\n<p>W zaprezentowanym przyk\u0142adzie u\u017cyjemy Standard.tsu, umo\u017cliwiaj\u0105cego w p\u00f3\u017aniejszych krokach tworzenia testu wykorzystywanie tzw. \u201eStandard Modules\u201d, czyli modu\u0142\u00f3w \u201edo zada\u0144 specjalnych\u201d. Standard.tsu jest dostarczany w pakiecie razem z instalatorem Tricentis Tosca. Przyk\u0142adowe elementy wchodz\u0105ce w sk\u0142ad \u201eStandard Modules\u201d om\u00f3wimy szerzej w kolejnych krokach tworzenia testu. Czytelnik\u00f3w, dla kt\u00f3rych ten opis b\u0119dzie niewystarczaj\u0105cy, odsy\u0142amy do oficjalnej strony z dokumentacj\u0105 <a href=\"https:\/\/documentation.tricentis.com\/tosca\/1520\/en\/content\/standard_subset\/automation_tools\/automation_tools_overview.htm\" class=\"ek-link\" rel=\"nofollow\" >Tricentis Tosca<\/a>.<\/p>\n\n\n\n<p>W przypadku korzystania ze wsp\u00f3lnego repozytorium w Tosce, na etapie tworzenia nowego Workspace\u2019u musimy wskaza\u0107 r\u00f3wnie\u017c typ repozytorium oraz Connection String, kt\u00f3ry pozwoli nam na po\u0142\u0105czenie si\u0119 z baz\u0105 danych.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Rozwi\u0105zanie Cypress<\/strong><\/h3>\n\n\n\n<p>Przed rozpocz\u0119ciem pracy z Cypressem powinni\u015bmy si\u0119 do tego delikatnie przygotowa\u0107. Musimy przede wszystkim pozna\u0107 j\u0119zyk JavaScript, a przynajmniej jego podstawy. Bez tego b\u0119dzie nam raczej ci\u0119\u017cko napisa\u0107 chocia\u017cby podstawowy test. Nast\u0119pnie musimy upewni\u0107 si\u0119, \u017ce na maszynie, na kt\u00f3rej b\u0119dziemy tworzy\u0107 nasz test, mamy zainstalowane \u015brodowisko NodeJS wraz z menad\u017cerem pakiet\u00f3w NPM (Node Package Manager). <\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large\"><a href=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_1.png\"><img decoding=\"async\" width=\"1024\" height=\"562\" src=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_1-1024x562.png\" alt=\"Sprawdzenie, czy poprawnie zainstalowali\u015bmy NodeJS oraz NPM\" class=\"wp-image-17059\" srcset=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_1-1024x562.png 1024w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_1-300x165.png 300w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_1-768x422.png 768w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_1.png 1490w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><figcaption>Ryc. 2 Sprawdzenie, czy poprawnie zainstalowali\u015bmy NodeJS oraz NPM<\/figcaption><\/figure><\/div>\n\n\n\n<p>Je\u017celi upewnili\u015bmy si\u0119, \u017ce spe\u0142niamy powy\u017csze wymagania, to przyst\u0105pi\u0107 mo\u017cemy do utworzenia \u201eszkieletu\u201d projektu, z kt\u00f3rego b\u0119dziemy korzysta\u0107 przy pisaniu testu. Aby utworzy\u0107 pusty projekt (gotowy do pracy), skorzystamy z komendy \u201enpm init\u201d. Nast\u0119pnie, wewn\u0105trz naszego nowo utworzonego projektu, instalujemy paczk\u0119 z Cypressem (komenda \u201enpm install cypress \u2014save-dev\u201d). Na koniec pozostaje nam sprawdzi\u0107, \u017ce aplikacja dostarczana wraz z Cypressem dzia\u0142a prawid\u0142owo. Wywo\u0142ujemy j\u0105 przy pomocy komendy \u201enpx cypress open\u201d.<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large\"><a href=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_2.png\"><img decoding=\"async\" width=\"1024\" height=\"645\" src=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_2-1024x645.png\" alt=\"Inicjalizacja pustego projektu oraz instalacja Cypressa\" class=\"wp-image-17061\" srcset=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_2-1024x645.png 1024w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_2-300x189.png 300w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_2-768x484.png 768w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_2.png 1334w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><figcaption>Ryc. 3 Inicjalizacja pustego projektu oraz instalacja Cypressa<\/figcaption><\/figure><\/div>\n\n\n\n<p>W nowo otwartym oknie wybieramy rodzaj test\u00f3w, jakie zamierzamy przeprowadzi\u0107 (w naszym wypadku s\u0105 to testy typu E2E: end-to-end) oraz przegl\u0105dark\u0119, z jakiej zamierzamy korzysta\u0107 (my nasze testy wykonujemy przy pomocy przegl\u0105darki Chrome).<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large\"><a href=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_3.png\"><img decoding=\"async\" width=\"1024\" height=\"683\" src=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_3-1024x683.png\" alt=\"Aplikacja Cypress\" class=\"wp-image-17063\" srcset=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_3-1024x683.png 1024w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_3-300x200.png 300w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_3-768x512.png 768w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_3.png 1182w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><figcaption>Ryc. 4 Aplikacja Cypress<\/figcaption><\/figure><\/div>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Krok 1: Otwarcie przegl\u0105darki oraz przej\u015bcie na stron\u0119 Sii<\/strong><\/h2>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Rozwi\u0105zanie Tosca<\/strong><\/h3>\n\n\n\n<p>Prac\u0119 nad automatyzacj\u0105 testu rozpoczynamy od utworzenia nowego folderu w niebieskiej sekcji Tosca \u2013 TestCases. Test dodajemy poprzez klikni\u0119cie prawym przyciskiem myszy na nowo utworzonym folderze i wybieraj\u0105c z listy dost\u0119pnych opcji \u201eCreate TestCase\u201d.<\/p>\n\n\n\n<p>Pierwszym krokiem testu b\u0119dzie otwarcie przegl\u0105darki Chrome i przej\u015bcie na stron\u0119 sii.pl. W celu otwarcia strony wykorzystujemy gotowy modu\u0142 ze wspomnianych wcze\u015bniej Standard Modules. Odnajdujemy go w pomara\u0144czowej sekcji Modules i przeci\u0105gamy metod\u0105 \u201edrag and drop\u201d do naszego testu w niebieskiej sekcji lub klikamy na nasz test i wyszukujemy modu\u0142 \u201eOpenUrl\u201d, korzystaj\u0105c ze skr\u00f3tu klawiszowego \u201ectrl+t\u201d. Pami\u0119tajmy tak\u017ce o uzupe\u0142nieniu w te\u015bcie parametru Url warto\u015bci\u0105 \u201e<a href=\"https:\/\/sii.pl\/\">https:\/\/sii.pl\/<\/a>\u201d.<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large\"><a href=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_02.png\"><img decoding=\"async\" width=\"1024\" height=\"288\" src=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_02-1024x288.png\" alt=\"Tosca \u2013 Tworzenie nowego testu w sekcji TestCases\" class=\"wp-image-17087\" srcset=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_02-1024x288.png 1024w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_02-300x84.png 300w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_02-768x216.png 768w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_02.png 1332w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><figcaption>Ryc. 5 Tosca \u2013 Tworzenie nowego testu w sekcji TestCases<\/figcaption><\/figure><\/div>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Rozwi\u0105zanie Cypress<\/strong><\/h3>\n\n\n\n<p>Aby rozpocz\u0105\u0107 pisanie naszego pierwszego testu, musimy utworzy\u0107 pusty plik. Skorzystamy ze struktury, kt\u00f3ra zosta\u0142a utworzona w naszym projekcie po wykonaniu podstawowej konfiguracji opisanej w poprzednim kroku (przy pomocy aplikacji Cypress). W katalogu \u201ccypress\u201d utworzymy kolejny podkatalog \u201ce2e\u201d, a w nim umie\u015bcimy pusty plik \u201cfirstSpec.cy.js\u201d.<\/p>\n\n\n\n<p>Od tej pory mo\u017cemy przej\u015b\u0107 ju\u017c w pe\u0142ni do pisania kodu naszego testu. Rozpoczniemy od stworzenia struktury testu, kt\u00f3r\u0105 oferuje nam Cypress. Przy pomocy \u201cdescribe()\u201d zadeklarujemy nasz\u0105 grup\u0119 test\u00f3w, natomiast przy pomocy \u201cit()\u201d\u2013 nasz konkretny przypadek testowy. Na pocz\u0105tku do testu dodamy tylko jeden krok \u2013 przej\u015bcie na stron\u0119 <a href=\"http:\/\/www.sii.pl\">www.sii.pl<\/a>. Do tego celu wykorzystamy Cypressow\u0105 komend\u0119 \u201cvisit()\u201d. W tym momencie nasz test powinien wygl\u0105da\u0107 nast\u0119puj\u0105co:<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large\"><a href=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_4.png\"><img decoding=\"async\" width=\"1024\" height=\"315\" src=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_4-1024x315.png\" alt=\"Cypress \u2013 pierwszy krok testu\" class=\"wp-image-17065\" srcset=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_4-1024x315.png 1024w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_4-300x92.png 300w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_4-768x236.png 768w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_4.png 1374w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><figcaption>Ryc. 6 Cypress \u2013 pierwszy krok testu<\/figcaption><\/figure><\/div>\n\n\n\n<p>Mimo, \u017ce jak na razie nasz test ma tylko jeden krok, to mo\u017cemy go ju\u017c swobodnie uruchomi\u0107 i sprawdzi\u0107, czy wszystko dzia\u0142a. W otworzonej przy pomocy komendy \u201enpx cypress open\u201d aplikacji Cypress klikamy na przycisk \u201eStart E2E testing in Chrome\u201d. W ten spos\u00f3b otworzy nam si\u0119 przegl\u0105darka Chrome z odpowiednim dla Cypressa GUI, a w zak\u0142adce \u201eSpecs\u201d znajdziemy nasz gotowy do uruchomienia test.<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large\"><a href=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_5.png\"><img decoding=\"async\" width=\"1024\" height=\"426\" src=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_5-1024x426.png\" alt=\"Cypress \u2013 widok aplikacji po pierwszym kroku testowym\" class=\"wp-image-17067\" srcset=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_5-1024x426.png 1024w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_5-300x125.png 300w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_5-768x319.png 768w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_5-1536x639.png 1536w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_5.png 1898w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><figcaption>Ryc. 7 Cypress \u2013 widok aplikacji po pierwszym kroku testowym<\/figcaption><\/figure><\/div>\n\n\n\n<p>Od tej pory b\u0119dziemy mogli \u015bledzi\u0107 zmiany w naszym te\u015bcie w\u0142a\u015bnie przy pomocy powy\u017cszej aplikacji (po ka\u017cdorazowym zapisaniu pliku z testem, aplikacja rozpocznie automatycznie wykonywanie testu od nowa). Nie b\u0119dziemy ka\u017cdorazowo za\u0142\u0105cza\u0107 zrzut\u00f3w ekranu z tego procesu, aby nie tworzy\u0107 zb\u0119dnego chaosu w artykule.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Krok 2: Przej\u015bcie do podstrony \u201eOferty pracy\u201d<\/strong><\/h2>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Rozwi\u0105zanie Tosca<\/strong><\/h3>\n\n\n\n<p>Programi\u015bci z firmy Tricentis rozwijaj\u0105cy Tosc\u0119 nie przewidzieli, \u017ce b\u0119dziemy chcieli testowa\u0107 stron\u0119 Sii.pl \ud83d\ude09 Dodane wcze\u015bniej do projektu elementy Standard Modules nie b\u0119d\u0105 wi\u0119c zawiera\u0142y gotowych do przetestowania tej strony modu\u0142\u00f3w. Modu\u0142y te musimy przygotowa\u0107 sami.<\/p>\n\n\n\n<p>W tym celu, maj\u0105c w przegl\u0105darce otwart\u0105 stron\u0119 Sii.pl, przechodzimy do pomara\u0144czowej sekcji Modules w Tosce i uruchamiamy XScan. W sekcji Modules tworzymy nowy folder, a nast\u0119pnie klikamy na niego prawym przyciskiem myszy i z rozwijanego menu wybieramy opcj\u0119 \u201eScan &gt; Application\u201d.<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-full\"><a href=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_03.png\"><img decoding=\"async\" width=\"809\" height=\"483\" src=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_03.png\" alt=\"Tosca \u2013 Uruchomienie XScanu\" class=\"wp-image-17089\" srcset=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_03.png 809w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_03-300x179.png 300w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_03-768x459.png 768w\" sizes=\"(max-width: 809px) 100vw, 809px\" \/><\/a><figcaption>Ryc. 8 Tosca \u2013 Uruchomienie XScanu<\/figcaption><\/figure><\/div>\n\n\n\n<p>W kolejnym oknie XScan wy\u015bwietli nam list\u0119 aktualnie uruchomionych na naszym komputerze aplikacji, kt\u00f3re s\u0105 dost\u0119pne dla Tosca. Z widocznej listy wybieramy przegl\u0105dark\u0119 Chrome z otwart\u0105 stron\u0105 Sii.pl.<\/p>\n\n\n\n<p>XScan skanuje drzewo HTML i wy\u015bwietla u\u017cytkownikowi wszystkie dost\u0119pne elementy strony.<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large\"><a href=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_04.png\"><img decoding=\"async\" width=\"1024\" height=\"570\" src=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_04-1024x570.png\" alt=\"Tosca \u2013 Elementy HTML w oknie XScan\" class=\"wp-image-17091\" srcset=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_04-1024x570.png 1024w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_04-300x167.png 300w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_04-768x427.png 768w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_04.png 1039w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><figcaption>Ryc. 9 Tosca \u2013 Elementy HTML w oknie XScan<\/figcaption><\/figure><\/div>\n\n\n\n<p>Na przyk\u0142adzie wyboru opcji \u201eKARIERA\u201d z g\u0142\u00f3wnego menu, widzimy, \u017ce oznaczenie w sekcji Properties parametr\u00f3w ClassName, InnerText i Tag pozwala na unikalne zidentyfikowanie elementu na stronie. Unikalna identyfikacja jest niezb\u0119dna, aby silnik Tosca podczas uruchomienia testu by\u0142 w stanie znale\u017a\u0107 i wykona\u0107 akcj\u0119 na odpowiednim elemencie strony.<\/p>\n\n\n\n<p>Po odznaczeniu parametru InnerText element traci swoj\u0105 \u201eunikalno\u015b\u0107\u201d, u do\u0142u okna XScanu pojawia si\u0119 pomara\u0144czowy komunikat informuj\u0105cy nas o tym, \u017ce Tosca nie potrafi jednoznacznie zidentyfikowa\u0107 elementu.<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large\"><a href=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_05.png\"><img decoding=\"async\" width=\"1024\" height=\"574\" src=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_05-1024x574.png\" alt=\"Tosca \u2013 Informacja o elemencie nieunikalnym\" class=\"wp-image-17093\" srcset=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_05-1024x574.png 1024w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_05-300x168.png 300w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_05-768x431.png 768w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_05-555x312.png 555w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_05.png 1043w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><figcaption>Ryc. 10 Tosca \u2013 Informacja o elemencie nieunikalnym<\/figcaption><\/figure><\/div>\n\n\n\n<p>Skanuj\u0105c elementy i tworz\u0105c modu\u0142y, kieruj\u0105c si\u0119 dobrymi praktykami, powinni\u015bmy zwraca\u0107 uwag\u0119 na to, aby by\u0142y one w jak najwi\u0119kszym stopniu \u201egeneryczne\u201d. Unikniemy dzi\u0119ki temu duplikowania zb\u0119dnych element\u00f3w i usprawnimy p\u00f3\u017aniejsze utrzymanie projektu.<\/p>\n\n\n\n<p>Zapisujemy modu\u0142 w stanie \u201ekontrolowanej nieunikalno\u015bci\u201d i w Propertiesach dodajemy parametr ExplicitName z warto\u015bci\u0105 True. Pozwoli nam to na utworzenie uniwersalnego elementu menu, kt\u00f3remu warto\u015b\u0107 tekstow\u0105 b\u0119dziemy nadawa\u0107 dopiero na poziomie TestCase\u2019u (w niebieskiej sekcji).<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large\"><a href=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_06.png\"><img decoding=\"async\" width=\"1024\" height=\"445\" src=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_06-1024x445.png\" alt=\"Tosca \u2013 Tworzenie modu\u0142u generycznego \u2013 wykorzystanie parametru ExplicitName\" class=\"wp-image-17095\" srcset=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_06-1024x445.png 1024w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_06-300x130.png 300w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_06-768x334.png 768w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_06-1536x668.png 1536w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_06-370x162.png 370w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_06.png 1606w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><figcaption>Ryc. 11 Tosca \u2013 Tworzenie modu\u0142u generycznego \u2013 wykorzystanie parametru ExplicitName<\/figcaption><\/figure><\/div>\n\n\n\n<p>Post\u0119pujemy analogicznie, skanuj\u0105c opcj\u0119 \u201eOferty pracy\u201d w podmenu. Gotowy modu\u0142 przeci\u0105gamy do testu w sekcji TestCases.<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large\"><a href=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_07.png\"><img decoding=\"async\" width=\"1024\" height=\"346\" src=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_07-1024x346.png\" alt=\"Dodanie nowego kroku do sekcji TestCases\" class=\"wp-image-17097\" srcset=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_07-1024x346.png 1024w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_07-300x101.png 300w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_07-768x259.png 768w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_07.png 1338w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><figcaption>Ryc. 12 Dodanie nowego kroku do sekcji TestCases<\/figcaption><\/figure><\/div>\n\n\n\n<p>Przypisujemy warto\u015bci Name elementom menu, w kt\u00f3re chcemy klikn\u0105\u0107. Zgodnie z naszym scenariuszem testowym s\u0105 to odpowiednio: \u201eKARIERA\u201d oraz \u201eOferty pracy\u201d. Value dla tych element\u00f3w b\u0119dzie r\u00f3wne \u201ex\u201d, co w Tosce oznacza klikni\u0119cie. Po uruchomieniu w Scratchbooku stworzonych krok\u00f3w testowych zostaniemy przeniesieni na podstron\u0119 \u201eOferty pracy\u201d, na kt\u00f3rej b\u0119dziemy kontynuowa\u0107 nasz\u0105 prac\u0119.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Rozwi\u0105zanie Cypress<\/strong><\/h3>\n\n\n\n<p>Podstaw\u0105 wi\u0119kszo\u015bci operacji, jakie b\u0119dziemy wykonywa\u0107 w Cypressie, b\u0119dzie wybranie odpowiedniego selektora w celu zlokalizowania elementu dla nas niezb\u0119dnego w danym kroku testowym. W tym miejscu oczywi\u015bcie warto by wyja\u015bni\u0107 czym s\u0105 selektory i w jaki spos\u00f3b je budowa\u0107, ale jest to temat na tyle obszerny, \u017ce mo\u017cna stworzy\u0107 o nim odr\u0119bny artyku\u0142. Dodatkowo, jest to wiedza konieczna do korzystania z wi\u0119kszo\u015bci framework\u00f3w i narz\u0119dzi s\u0142u\u017c\u0105cych do tworzenia test\u00f3w automatycznych.<\/p>\n\n\n\n<p>Dlatego te\u017c postanowili\u015bmy zaprezentowa\u0107 kilka jasnych przyk\u0142ad\u00f3w w postaci fragmentu kodu zamieszczonego poni\u017cej. Natomiast, je\u017celi kto\u015b chcia\u0142by zg\u0142\u0119bi\u0107 temat selektor\u00f3w w Cypressie, to zapraszamy do <a href=\"https:\/\/docs.cypress.io\/api\/commands\/get#Syntax\" class=\"ek-link\" rel=\"nofollow\" >odwiedzenia oficjalnej dokumentacji<\/a>, napisanej wed\u0142ug nas w bardzo przyst\u0119pny spos\u00f3b i zawieraj\u0105cej sporo ciekawych przyk\u0142ad\u00f3w.<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large\"><a href=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_6.png\"><img decoding=\"async\" width=\"846\" height=\"1024\" src=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_6-846x1024.png\" alt=\"Cypress \u2013 przyk\u0142ady selektor\u00f3w\" class=\"wp-image-17069\" srcset=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_6-846x1024.png 846w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_6-248x300.png 248w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_6-768x929.png 768w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_6-1269x1536.png 1269w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_6.png 1332w\" sizes=\"(max-width: 846px) 100vw, 846px\" \/><\/a><figcaption>Ryc. 13 Cypress \u2013 przyk\u0142ady selektor\u00f3w<\/figcaption><\/figure><\/div>\n\n\n\n<p>Skoro wiemy ju\u017c (przynajmniej wst\u0119pnie&#8230; \ud83d\ude0a), w jaki spos\u00f3b szuka\u0107 element\u00f3w strony internetowej, to przy pomocy Chrome DevTools chcieliby\u015bmy zlokalizowa\u0107 pierwszy poszukiwany przez nas element.<\/p>\n\n\n\n<p>W naszym wypadku b\u0119dzie to widoczny na stronie przycisk \u201eKariera\u201d, a nast\u0119pnie (po \u00f3wczesnym klikni\u0119ciu) przycisk \u201eOferty pracy\u201d, znajduj\u0105cy si\u0119 w pocz\u0105tku niewidocznym dodatkowym menu. W przypadku przycisku \u201eKariera\u201d skorzystamy z unikalnego, przypisanego do niego ID, kt\u00f3ry b\u0119dzie parametrem komendy cypressowej \u201cget()\u201d. Natomiast \u201eOferty pracy\u201d ju\u017c takiego ID nie posiadaj\u0105. Warto jednak zauwa\u017cy\u0107, \u017ce element nadrz\u0119dny, w kt\u00f3rym si\u0119 znajduj\u0105 \u2013 ju\u017c tak.<\/p>\n\n\n\n<p>Dlatego te\u017c (r\u00f3wnie\u017c przy pomocy ID) zlokalizujemy element \u201erodzica\u201d, nast\u0119pnie odniesiemy si\u0119 do jego \u201edzieci\u201d przy pomocy komendy \u201echildren()\u201d i wewn\u0105trz element\u00f3w podrz\u0119dnych poszukamy elementu zawieraj\u0105cego tekst \u201eOferty pracy\u201d (u\u017cywaj\u0105c komendy \u201ccontains()\u201d). W obydwu przypadkach, po zlokalizowaniu elementu, b\u0119dziemy chcieli w nie klikn\u0105\u0107, u\u017cywaj\u0105c komendy \u201eclick()\u201d.<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large\"><a href=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_7.png\"><img decoding=\"async\" width=\"1024\" height=\"298\" src=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_7-1024x298.png\" alt=\"Cypress \u2013 przej\u015bcie na stron\u0119 z ofertami pracy\" class=\"wp-image-17071\" srcset=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_7-1024x298.png 1024w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_7-300x87.png 300w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_7-768x223.png 768w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_7-1536x447.png 1536w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_7.png 1870w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><figcaption>Ryc. 14 Cypress \u2013 przej\u015bcie na stron\u0119 z ofertami pracy<\/figcaption><\/figure><\/div>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Krok 3: Wyszukanie ofert spe\u0142niaj\u0105cych zadane kryteria<\/strong><\/h2>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Rozwi\u0105zanie Tosca<\/strong><\/h3>\n\n\n\n<p>W celu zeskanowania podstrony \u201eOferty pracy\u201d i utrzymania porz\u0105dku w naszym repozytorium utworzymy nowy modu\u0142 w sekcji \u201eModules\u201d. Dodamy do niego kolejno elementy potrzebne do wykonania scenariusza testowego:<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>pole tekstowe typu input do wprowadzenia frazy \u201eQA\u201d,<\/li><li>opcj\u0119 rozwijania listy dost\u0119pnych Lokalizacji\/Kategorii,<\/li><li>przycisk uruchamiaj\u0105cy proces wyszukiwania.<\/li><\/ul>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large\"><a href=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_08.png\"><img decoding=\"async\" width=\"1024\" height=\"527\" src=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_08-1024x527.png\" alt=\"Tosca \u2013 dodanie do modu\u0142u pola wyszukiwania\" class=\"wp-image-17099\" srcset=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_08-1024x527.png 1024w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_08-300x154.png 300w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_08-768x395.png 768w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_08-1536x790.png 1536w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_08.png 1709w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><figcaption>Ryc. 15 Tosca \u2013 dodanie do modu\u0142u pola wyszukiwania<\/figcaption><\/figure><\/div>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large\"><a href=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_09.png\"><img decoding=\"async\" width=\"1024\" height=\"521\" src=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_09-1024x521.png\" alt=\"Tosca \u2013 dodanie do modu\u0142u opcji rozwijania filtr\u00f3w Lokalizacji\/Kategorii\" class=\"wp-image-17101\" srcset=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_09-1024x521.png 1024w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_09-300x153.png 300w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_09-768x391.png 768w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_09-1536x781.png 1536w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_09.png 1634w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><figcaption>Ryc. 16 Tosca \u2013 dodanie do modu\u0142u opcji rozwijania filtr\u00f3w Lokalizacji\/Kategorii<\/figcaption><\/figure><\/div>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large\"><a href=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_10.png\"><img decoding=\"async\" width=\"1024\" height=\"521\" src=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_10-1024x521.png\" alt=\"Tosca \u2013 dodanie do modu\u0142u przycisku wyszukiwania ofert pracy\" class=\"wp-image-17103\" srcset=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_10-1024x521.png 1024w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_10-300x153.png 300w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_10-768x391.png 768w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_10-1536x782.png 1536w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_10.png 1558w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><figcaption>Ryc. 17 Tosca \u2013 dodanie do modu\u0142u przycisku wyszukiwania ofert pracy<\/figcaption><\/figure><\/div>\n\n\n\n<p>Zapisujemy modu\u0142. Na testowanej przez nas stronie klikamy w opcj\u0119 wyboru lokalizacji i przy rozwini\u0119tym oknie dost\u0119pnych lokalizacji, skanujemy ponownie zapisany wcze\u015bniej modu\u0142.<\/p>\n\n\n\n<p>Do modu\u0142u dodajemy elementy niezb\u0119dne do zaznaczenia checkboxa przy wybranym przez nas mie\u015bcie. Tworzymy elementy generyczne, pami\u0119taj\u0105c o wcze\u015bniej opisanej funkcjonalno\u015bci Tosca \u2013 dodaniu parametru ExplicitName i przypisaniu konkretnej warto\u015bci w te\u015bcie na poziomie TestCases.<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large\"><a href=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_11.png\"><img decoding=\"async\" width=\"1024\" height=\"476\" src=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_11-1024x476.png\" alt=\"Tosca \u2013 skanowanie filtra lokalizacji\" class=\"wp-image-17105\" srcset=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_11-1024x476.png 1024w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_11-300x140.png 300w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_11-768x357.png 768w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_11-1536x715.png 1536w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_11.png 1687w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><figcaption>Ryc. 18 Tosca \u2013 skanowanie filtra lokalizacji<\/figcaption><\/figure><\/div>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large\"><a href=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_12.png\"><img decoding=\"async\" width=\"1024\" height=\"520\" src=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_12-1024x520.png\" alt=\"Tosca \u2013 widok modu\u0142u dla podstrony Oferty Pracy\" class=\"wp-image-17107\" srcset=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_12-1024x520.png 1024w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_12-300x152.png 300w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_12-768x390.png 768w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_12.png 1300w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><figcaption>Ryc. 19 Tosca \u2013 widok modu\u0142u dla podstrony Oferty Pracy<\/figcaption><\/figure><\/div>\n\n\n\n<p>Utworzony modu\u0142 przenosimy do sekcji TestCases i dostosowujemy warto\u015bci zgodnie ze scenariuszem testowym. W pole input wpisujemy Value \u201eQA\u201d. Elementowi rozwijaj\u0105cemu filtr lokalizacji nadajemy warto\u015b\u0107 \u201ex\u201d (klikni\u0119cie). W kontenerze z list\u0105 dost\u0119pnych lokalizacji wskazujemy na Name \u201eBydgoszcz\u201d.<\/p>\n\n\n\n<p>W celu zaznaczenia interesuj\u0105cego nas checkboxa dla miasta Bydgoszcz, przypisujemy mu Value \u2013 \u201eSelected = True\u201d. Na ko\u0144cu pozostaje nam klikni\u0119cie w przycisk wyszukiwania \u2013 tutaj skorzystamy z drugiej dost\u0119pnej w Tosce metody wykonania klikni\u0119cia, symuluj\u0105cej ruch myszk\u0105, jak\u0105 jest przypisanie elementowi Value \u201e{CLICK}\u201d.<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-full\"><a href=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_13.png\"><img decoding=\"async\" width=\"994\" height=\"475\" src=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_13.png\" alt=\"Tosca \u2013 Oferty pracy \u2013 widok sekcji TestCases\" class=\"wp-image-17109\" srcset=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_13.png 994w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_13-300x143.png 300w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_13-768x367.png 768w\" sizes=\"(max-width: 994px) 100vw, 994px\" \/><\/a><figcaption>Ryc. 20 Tosca \u2013 Oferty pracy \u2013 widok sekcji TestCases<\/figcaption><\/figure><\/div>\n\n\n\n<p>Kontrolne uruchomienie testu w Scratchbooku pozwala nam na \u015bledzenie naszych post\u0119p\u00f3w na bie\u017c\u0105co.<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-full\"><a href=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_14.png\"><img decoding=\"async\" width=\"866\" height=\"530\" src=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_14.png\" alt=\"Tosca \u2013 kontrolne uruchomienie testu w Scratchbooku\" class=\"wp-image-17111\" srcset=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_14.png 866w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_14-300x184.png 300w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_14-768x470.png 768w\" sizes=\"(max-width: 866px) 100vw, 866px\" \/><\/a><figcaption>Ryc. 21 Tosca \u2013 kontrolne uruchomienie testu w Scratchbooku<\/figcaption><\/figure><\/div>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Rozwi\u0105zanie Cypress<\/strong><\/h3>\n\n\n\n<p>Wiemy ju\u017c, w jaki spos\u00f3b wyszukiwa\u0107 elementy na stronie przy pomocy selektor\u00f3w. W podobny spos\u00f3b, jak robili\u015bmy to poprzednio, wyszukamy na stronie z ofertami pracy element odpowiadaj\u0105cy za filtrowanie wynik\u00f3w wyszukiwania przy pomocy wpisanego tekstu.<\/p>\n\n\n\n<p>Wspomniane pole tekstowe zlokalizujemy tym razem przy pomocy nazwy klasy (u\u017cywaj\u0105c wspomnianej ju\u017c wcze\u015bniej komendy \u201eget()\u201d). Nast\u0119pnie, wykorzystamy komend\u0119 \u201etype()\u201d, odpowiadaj\u0105c\u0105 za wprowadzanie tekstu do elementu. W naszym wypadku b\u0119dzie to s\u0142owo \u201eqa\u201d. Kolejno, zlokalizujemy i klikniemy w przycisk odpowiadaj\u0105cy za rozwini\u0119cie listy mo\u017cliwych do wyboru miast (r\u00f3wnie\u017c przy pomocy klasy).<\/p>\n\n\n\n<p>Na li\u015bcie wyszuka\u0107 musimy Bydgoszcz. W tym celu u\u017cyjemy kolejnego selektora \u2013 tym razem b\u0119dzie to unikalny selektor okre\u015blaj\u0105cy nazw\u0119 atrybutu oraz przypisan\u0105 mu warto\u015b\u0107. Nast\u0119pnie, powinni\u015bmy znale\u017a\u0107 checkbox, kt\u00f3ry chcemy zaznaczy\u0107 (r\u00f3wnie\u017c przy pomocy nazwy atrybutu), lecz tym razem nie u\u017cyjemy ju\u017c metody \u201eclick()\u201d (tak, jak mia\u0142o to miejsce wcze\u015bniej), lecz dedykowanej do tego celu metody \u201echeck()\u201d.<\/p>\n\n\n\n<p>Na koniec pozostaje nam u\u017cy\u0107 przycisku odpowiedzialnego za aktywowanie na\u0142o\u017conych przez nas filtr\u00f3w, reprezentowanego przez symbol lupy. Element ten w \u0142atwy spos\u00f3b odnajdziemy przy pomocy unikalnej nazwy klasy.<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large\"><a href=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_8.png\"><img decoding=\"async\" width=\"1024\" height=\"511\" src=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_8-1024x511.png\" alt=\"Cypress \u2013 wybranie filtr\u00f3w dla wy\u015bwietlanych ofert pracy\" class=\"wp-image-17073\" srcset=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_8-1024x511.png 1024w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_8-300x150.png 300w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_8-768x383.png 768w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_8.png 1354w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><figcaption>Ryc. 22 Cypress \u2013 wybranie filtr\u00f3w dla wy\u015bwietlanych ofert pracy<\/figcaption><\/figure><\/div>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Krok 4: Weryfikacja wynik\u00f3w<\/strong><\/h2>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Rozwi\u0105zanie Tosca<\/strong><\/h3>\n\n\n\n<p>Ostatnim krokiem naszego testu jest weryfikacja otrzymanych wynik\u00f3w. W tym celu znajdujemy na stronie element DIV, b\u0119d\u0105cy reprezentacj\u0105 pojedynczej oferty pracy. Element ten powinien by\u0107 nieunikalny (odznaczamy OuterText), ale na tyle unikalny, aby zestaw przypisanych do niego w\u0142a\u015bciwo\u015bci jednoznacznie wskazywa\u0142, \u017ce reprezentuje on pojedyncz\u0105, dowoln\u0105 ofert\u0119 pracy.<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large\"><a href=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_15.png\"><img decoding=\"async\" width=\"1024\" height=\"523\" src=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_15-1024x523.png\" alt=\"Tosca \u2013 skanowanie kontenera z pojedyncz\u0105 ofert\u0105 pracy\" class=\"wp-image-17113\" srcset=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_15-1024x523.png 1024w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_15-300x153.png 300w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_15-768x392.png 768w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_15-1536x784.png 1536w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_15.png 1737w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><figcaption>Ryc. 23 Tosca \u2013 skanowanie kontenera z pojedyncz\u0105 ofert\u0105 pracy<\/figcaption><\/figure><\/div>\n\n\n\n<p>Nast\u0119pnie, na poziomie TestCases, wykorzystujemy funkcjonalno\u015b\u0107 Tosca \u2013 ResultCount, umo\u017cliwiaj\u0105c\u0105 zliczanie element\u00f3w tego samego typu (o tych samych w\u0142a\u015bciwo\u015bciach). Tworzymy asercj\u0119 \u201eResultCount != 0\u201d, kt\u00f3ra b\u0119dzie weryfikowa\u0142a, czy na stronie pojawia si\u0119 przynajmniej jeden kontener z ofert\u0105 pracy. Je\u015bli element zostanie znaleziony \u2013 test zako\u0144czy si\u0119 sukcesem.<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-full\"><a href=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_16.png\"><img decoding=\"async\" width=\"959\" height=\"412\" src=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_16.png\" alt=\"Tosca \u2013 dodanie asercji \u2013 zliczania ofert pracy pojawiaj\u0105cych si\u0119 na stronie\" class=\"wp-image-17115\" srcset=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_16.png 959w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_16-300x129.png 300w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_16-768x330.png 768w\" sizes=\"(max-width: 959px) 100vw, 959px\" \/><\/a><figcaption>Ryc. 24 Tosca \u2013 dodanie asercji \u2013 zliczania ofert pracy pojawiaj\u0105cych si\u0119 na stronie<\/figcaption><\/figure><\/div>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Rozwi\u0105zanie Cypress<\/strong><\/h3>\n\n\n\n<p>W przypadku Cypressa postanowili\u015bmy, \u017ce nie b\u0119dziemy liczy\u0107 wy\u015bwietlonych ofert pracy, lecz skorzystamy z liczby wynik\u00f3w, kt\u00f3ra wy\u015bwietla si\u0119 na stronie w sekcji \u201eZnalezionych wynik\u00f3w\u201d. Na tym etapie uruchomienia testu zauwa\u017cy\u0107 mo\u017cna, \u017ce wyniki na stronie nie zawsze pokazuj\u0105 si\u0119 tak samo szybko. Chcemy mie\u0107 pewno\u015b\u0107, \u017ce zawsze b\u0119dziemy u\u017cywali w naszym te\u015bcie liczby wynik\u00f3w, kt\u00f3ra wy\u015bwietli si\u0119 dopiero po wprowadzeniu zadanego przez nas filtra (w od\u015bwie\u017conej, a nie pierwotnej wersji).<\/p>\n\n\n\n<p>Dzi\u0119ki aplikacji Cypressa zauwa\u017cy\u0107 mo\u017cna, \u017ce po wprowadzeniu filtr\u00f3w strona oczekuje na nowe wyniki przychodz\u0105ce z odpowiedniego endpointa serwisu REST-owego. Dlatego te\u017c zanim przejdziemy do weryfikacji wynik\u00f3w, chcemy wprowadzi\u0107 dodatkowy \u201ewait\u201d, oczekuj\u0105cy a\u017c serwis zwr\u00f3ci nam odpowied\u017a w postaci \u015bwie\u017cych wynik\u00f3w.<\/p>\n\n\n\n<p>Skorzystamy tutaj z pomocy komendy \u201eintercept()\u201d, definiuj\u0105c zar\u00f3wno metod\u0119 REST-ow\u0105 jak i sam endpoint, kt\u00f3rego odpowiedzi oczekujemy. Nadamy r\u00f3wnie\u017c nazw\u0119 wspomnianemu \u201einterceptorowi\u201d, aby w dalszej cz\u0119\u015bci kodu u\u017cy\u0107 tej samej nazwy jako parametru komendy \u201ewait()\u201d.<\/p>\n\n\n\n<p>Skoro mamy ju\u017c pewno\u015b\u0107, \u017ce otrzymane wyniki to rzeczywi\u015bcie wyniki, kt\u00f3re nas interesuj\u0105, nie pozostaje nam nic innego, jak odczyta\u0107 ze strony odpowiedni\u0105 liczb\u0119. W tym celu odszuka\u0107 musimy element zawieraj\u0105cy interesuj\u0105cy nas tekst, a nast\u0119pnie skorzysta\u0107 z metody \u201einvoke()\u201d do wskazania, \u017ce od tej pory b\u0119dziemy dzia\u0142a\u0107 wy\u0142\u0105cznie na tek\u015bcie. Nast\u0119pnie przeka\u017cemy ten tekst do komendy \u201ethen()\u201d, aby rozpocz\u0105\u0107 prac\u0119 nad jego edycj\u0105.<\/p>\n\n\n\n<p>Wewn\u0105trz \u201ethen()\u201d podzielimy nasz tekst, u\u017cywaj\u0105c spacji oraz dwukropka jako separator\u00f3w, gdy\u017c szukana przez nas liczba znajduje si\u0119 w ich bezpo\u015brednim s\u0105siedztwie. W dalszej kolejno\u015bci chcemy skorzysta\u0107 z parsowania tekstu na liczb\u0119 ca\u0142kowit\u0105, \u017ceby w ko\u0144cu (przy pomocy komendy \u201eshould()\u201d) sprawdzi\u0107, czy zapisana przez nas warto\u015b\u0107 rzeczywi\u015bcie jest liczb\u0105 oraz (je\u015bli tak) \u2013 to czy jest wi\u0119ksza od zera. To sprawdzenie jednocze\u015bnie zamyka nasz test, kt\u00f3ry w finalnej formie prezentuje si\u0119 nast\u0119puj\u0105co:<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large\"><a href=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_9.png\"><img decoding=\"async\" width=\"1024\" height=\"925\" src=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_9-1024x925.png\" alt=\"Cypress \u2013 uko\u0144czony test\" class=\"wp-image-17075\" srcset=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_9-1024x925.png 1024w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_9-300x271.png 300w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_9-768x694.png 768w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_9-1536x1388.png 1536w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_9.png 1870w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><figcaption>Ryc. 25 Cypress \u2013 uko\u0144czony test<\/figcaption><\/figure><\/div>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>\u201eWredny\u201d manager<\/strong><\/h2>\n\n\n\n<p>Wyobra\u017amy sobie, \u017ce zadanie zautomatyzowania powy\u017cszego scenariusza zleci\u0142 nam nasz \u201eulubiony\u201d manager. Z wyzwaniem tym poradzili\u015bmy sobie szybko i sprawnie. Zadowolony manager zleci\u0142 nam wi\u0119c wykonanie analogicznego przyk\u0142adu, ale dla Torunia. Jak poradzimy sobie z takim przypadkiem?<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Krok 5: Tworzenie analogicznego przypadku testowego dla Torunia<\/strong><\/h3>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Rozwi\u0105zanie Tosca \u2013 podej\u015bcie \u201ebrzydkie i leniwe\u201d<\/strong><\/h3>\n\n\n\n<p>Najprostszym i na pierwszy rzut oka dobrym pomys\u0142em wydaje si\u0119 by\u0107 skopiowanie testu utworzonego dla Bydgoszczy i podmiana nazwy w elemencie \u201eLocalization Container\u201d na \u201eToru\u0144\u201d. \u0141atwe, prawda? Id\u017amy dalej. Za\u0142\u00f3\u017cmy, \u017ce kolejnego dnia nasz manager zwraca si\u0119 z kolejn\u0105 pro\u015bb\u0105 \u2013 utworzenia jeszcze 10 test\u00f3w dla innych miast. \u017by\u0142ka na naszym czole robi si\u0119 coraz bardziej widoczna, ale \u017cmudnie kopiujemy utworzone wcze\u015bniej testy.<\/p>\n\n\n\n<p>Po kilku godzinach otrzymujemy od managera plik .xls z list\u0105 100 nowych kombinacji, dodatkowo w niekt\u00f3rych testach zamiast \u201eQA\u201d mamy teraz sprawdzi\u0107 list\u0119 ofert dla Developer\u00f3w, Analityk\u00f3w, DevOps\u00f3w\u2026 Powoli zaczynamy uzmys\u0142awia\u0107 sobie, \u017ce nasz pomys\u0142 z metod\u0105 \u201ekopiuj \u2013 wklej\u201d si\u0119 nie sprawdzi\u0142 i powinni\u015bmy skorzysta\u0107 z czerwonej sekcji Tosca, zwanej TestCaseDesignem.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Rozwi\u0105zanie Tosca \u2013 korzystanie z TestCaseDesignu<\/strong><\/h3>\n\n\n\n<p>TestCaseDesign pozwala nam na \u0142atwe i przejrzyste zarz\u0105dzanie danymi testowymi z jednego miejsca. Dodatkowo, umo\u017cliwia import danych testowych z pliku, np. wspomnianego .xls, cz\u0119sto tak lubianego przez biznesow\u0105 stron\u0119 IT.<\/p>\n\n\n\n<p>W naszym przyk\u0142adzie TestSheet z danymi testowymi stworzymy od podstaw, manualnie. W czerwonej sekcji tworzymy nowy folder, a w nim poprzez prawy przycisk myszy i wybranie opcji \u201eCreate TestSheet\u201d nowy TestSheet z danymi. W naszym TestSheetcie potrzebujemy dw\u00f3ch instancji test\u00f3w \u2013 po jednej dla Bydgoszczy i Torunia, aby rozbudowa\u0107 nasz przyk\u0142ad b\u0119d\u0105 to odpowiednio \u201eQA in Bydgoszcz\u201d oraz \u201eDEVS in Toru\u0144\u201d.<\/p>\n\n\n\n<p>Nast\u0119pnie, do zbioru danych dodajemy dwa atrybuty, czyli rodzaje zmiennych w naszych przyk\u0142adach. B\u0119d\u0105 nimi: lokalizacja oraz rodzaj profesji. Ka\u017cdy z tych atrybut\u00f3w b\u0119dzie posiada\u0142 dwie, przyk\u0142adowe instancje. Dla lokalizacji b\u0119dzie to \u201eBydgoszcz\u201d i \u201eToru\u0144\u201d. Dla profesji: \u201eQA\u201d i \u201eDeveloper\u201d.<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large\"><a href=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_17.png\"><img decoding=\"async\" width=\"1024\" height=\"463\" src=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_17-1024x463.png\" alt=\"Tosca \u2013 widok sekcji TestCaseDesign\" class=\"wp-image-17117\" srcset=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_17-1024x463.png 1024w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_17-300x136.png 300w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_17-768x347.png 768w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_17.png 1254w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><figcaption>Ryc. 26 Tosca \u2013 widok sekcji TestCaseDesign<\/figcaption><\/figure><\/div>\n\n\n\n<p>W celu wykorzystania TestSheetu w testach, musimy przekonwertowa\u0107 utworzony wcze\u015bniej bazowy test na TestCaseTemplate. Klikamy prawym przyciskiem myszy na TestCase i wybieramy opcj\u0119 \u201eConvert to Template\u201d. Kolejnym krokiem jest przeci\u0105gni\u0119cie TestSheetu metod\u0105 \u201edrag and drop\u201d na utworzony przez nasz szablon.<\/p>\n\n\n\n<p>Po tej operacji Tosca wie, \u017ce w tym szablonie ma korzysta\u0107 z danych wprowadzonych przez nas we wcze\u015bniejszym kroku do TestSheetu, ale nie wie jeszcze, w jakich dok\u0142adnie miejscach ma te dane podstawia\u0107. Informujemy o tym Tosc\u0119 poprzez dodanie referencji {XL[nazwa_atrybutu]}, w miejscach, w kt\u00f3rych wpisane wcze\u015bniej \u201ena sztywno\u201d dane, maj\u0105 zosta\u0107 zast\u0105pione danymi wprowadzonymi z TestSheetu.<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large\"><a href=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_18.png\"><img decoding=\"async\" width=\"1024\" height=\"543\" src=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_18-1024x543.png\" alt=\"Tosca \u00ac\u2013 dodanie referencji {XL[]} do TestCase'u\" class=\"wp-image-17119\" srcset=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_18-1024x543.png 1024w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_18-300x159.png 300w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_18-768x407.png 768w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_18-1536x814.png 1536w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_18.png 1920w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><figcaption>Ryc. 27 Tosca \u00ad\u2013 dodanie referencji {XL[]} do TestCase&#8217;u<\/figcaption><\/figure><\/div>\n\n\n\n<p>Po dodaniu referencji mo\u017cemy wygenerowa\u0107 instancje z szablonu. Klikamy prawym przyciskiem myszy na TestCase Templete i wybieramy opcj\u0119 \u201eCreate TemplateInstance\u201d. Tosca automatycznie utworzy nowy folder ze zbiorem wszystkich instancji, kt\u00f3re stworzyli\u015bmy w TestSheet\u2019cie w sekcji TestCaseDesign.<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large\"><a href=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_19.png\"><img decoding=\"async\" width=\"1024\" height=\"718\" src=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_19-1024x718.png\" alt=\"Tosca \u2013 wygenerowanie nowych instancji na podstawie danych z TestSheetu\" class=\"wp-image-17121\" srcset=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_19-1024x718.png 1024w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_19-300x210.png 300w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_19-768x539.png 768w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_19.png 1153w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><figcaption>Ryc. 28 Tosca \u2013 wygenerowanie nowych instancji na podstawie danych z TestSheetu<\/figcaption><\/figure><\/div>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Rozwi\u0105zanie Cypress \u2013 podej\u015bcie \u201ebrzydkie i leniwe\u201d<\/strong><\/h3>\n\n\n\n<p>W przypadku Cypressa pracujemy ca\u0142y czas wy\u0142\u0105cznie \u201ez kodem\u201d. Zatem pierwsze rozwi\u0105zanie, jakie mo\u017ce przyj\u015b\u0107 wielu pocz\u0105tkuj\u0105cym testerom do g\u0142owy, to podobnie jak w przypadku rozwi\u0105zania w Tosce, metoda \u201eCopiego Pasty\u201d \u2013 skopiowanie testu, kt\u00f3ry ju\u017c utworzyli\u015bmy oraz podmian\u0119 warto\u015bci \u201ebydgoszcz\u201d na \u201etorun\u201d. Ale, podobnie jak w poprzednim przypadku, takie rozwi\u0105zanie wcze\u015bniej czy p\u00f3\u017aniej odbije si\u0119 rykoszetem, gdy\u017c jest ci\u0119\u017ckie w utrzymaniu. Natomiast ilo\u015b\u0107 zduplikowanego kodu b\u0119dzie ros\u0142a z ka\u017cd\u0105 kolejn\u0105 kombinacj\u0105, kt\u00f3r\u0105 b\u0119dziemy chcieli przetestowa\u0107.<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large\"><a href=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_10.png\"><img decoding=\"async\" width=\"1024\" height=\"811\" src=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_10-1024x811.png\" alt=\"Cypress \u2013 zastosowanie znanej na \u015bwiecie metody \u201eCopiego Pasty\" class=\"wp-image-17077\" srcset=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_10-1024x811.png 1024w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_10-300x238.png 300w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_10-768x608.png 768w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_10-1536x1216.png 1536w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_10.png 1634w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><figcaption>Ryc. 29 Cypress \u2013 zastosowanie znanej na \u015bwiecie metody \u201eCopiego Pasty&#8221;<\/figcaption><\/figure><\/div>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Rozwi\u0105zanie Cypress \u2013 Fixtures<\/strong><\/h3>\n\n\n\n<p>Aby nie korzysta\u0107 z popularnej metody \u201eCopiego Pasty\u201d, skorzystamy z kolejnej funkcjonalno\u015bci oferowanej przez Cypressa \u2013 Fixtures. Warto\u015bci, kt\u00f3re chcemy wykorzysta\u0107 do test\u00f3w, zdefiniujemy w osobnym pliku .json w postaci obiektu o dw\u00f3ch polach: \u201ename\u201d oraz \u201ecity\u201d.<\/p>\n\n\n\n<p>Tak utworzony plik musimy wczyta\u0107 na pocz\u0105tku naszych test\u00f3w, a nast\u0119pnie przy pomocy metody \u201eforEach()\u201d powt\u00f3rzymy test dla ka\u017cdego wyst\u0119puj\u0105cego w pliku obiektu. Warto\u015bci, kt\u00f3re poprzednio mieli\u015bmy \u201ehardkodowane\u201d w kodzie, teraz mo\u017cemy podmienia\u0107 na warto\u015bci wpisane w pliku .json. Dzi\u0119ki temu nie duplikujemy kodu, a chc\u0105c chocia\u017cby testowa\u0107 kolejne miasta, wystarczy, \u017ce dodamy je do naszego utworzonego pliku (nie musimy zmienia\u0107 niczego w samym kodzie testu).<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large\"><a href=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_11.png\"><img decoding=\"async\" width=\"1024\" height=\"539\" src=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_11-1024x539.png\" alt=\"Cypress \u2013 plik JSON zawieraj\u0105cy zestawy danych testowych\" class=\"wp-image-17079\" srcset=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_11-1024x539.png 1024w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_11-300x158.png 300w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_11-768x404.png 768w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_11.png 1052w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><figcaption>Ryc. 30 Cypress \u2013 plik JSON zawieraj\u0105cy zestawy danych testowych<\/figcaption><\/figure><\/div>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large\"><a href=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_12.png\"><img decoding=\"async\" width=\"966\" height=\"1024\" src=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_12-966x1024.png\" alt=\"Cypress \u2013 wykorzystanie Fixtures\" class=\"wp-image-17081\" srcset=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_12-966x1024.png 966w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_12-283x300.png 283w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_12-768x814.png 768w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_12-1449x1536.png 1449w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/cypress_screen_12.png 1760w\" sizes=\"(max-width: 966px) 100vw, 966px\" \/><\/a><figcaption>Ryc. 31 Cypress \u2013 wykorzystanie Fixtures<\/figcaption><\/figure><\/div>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Tosca \u2013 Wprowadzanie zmian do Template\u2019u<\/strong><\/h2>\n\n\n\n<p>Rozwi\u0105zaniom codeless cz\u0119sto zarzuca si\u0119 ma\u0142\u0105 elastyczno\u015b\u0107 i problemy z utrzymaniem w przypadku pojawiaj\u0105cej si\u0119 konieczno\u015bci zmian w projekcie. <strong>Chcieliby\u015bmy obali\u0107 ten mit<\/strong>, bazuj\u0105c na poni\u017cszym przyk\u0142adzie.<\/p>\n\n\n\n<p>Za\u0142\u00f3\u017cmy, \u017ce po analizie naszej asercji doszli\u015bmy do wniosku, \u017ce chcemy j\u0105 zmieni\u0107 \u2013 nie b\u0119dziemy si\u0119 opiera\u0107 na zliczaniu wyst\u0119puj\u0105cych na stronie element\u00f3w typu DIV, b\u0119d\u0105cych reprezentacj\u0105 pojedynczej oferty pracy, ale tak jak w rozwi\u0105zaniu \u201eklasycznym\u201d, skorzystamy z tekstu wy\u015bwietlaj\u0105cego informacj\u0119 o liczbie znalezionych ofert pracy. Ponadto, po kilkukrotnym uruchomieniu naszego testu zauwa\u017cyli\u015bmy, \u017ce dzia\u0142a on niestabilnie. Przy gorszym po\u0142\u0105czeniu internetowym test \u201enie przechodzi\u201d w losowych momentach. Do\u0142o\u017cymy dynamiczne oczekiwanie na \u0142adowanie wybranych element\u00f3w strony, aby zapobiec takim sytuacjom w przysz\u0142o\u015bci.<\/p>\n\n\n\n<p>Utworzony przez nas wcze\u015bniej TestCase Template pozwala na \u0142atwe wprowadzenie zmian do wszystkich test\u00f3w, bez konieczno\u015bci wielokrotnego kopiowania czy edycji tych samych element\u00f3w. Om\u00f3wimy to na przyk\u0142adzie zmiany sposobu weryfikacji znalezionych ofert pracy.<\/p>\n\n\n\n<p>Po przej\u015bciu na podstron\u0119 \u201eOferty pracy\u201d dodajemy do kroku \u201eFind QA jobs\u201d dodatkow\u0105 akcj\u0119 polegaj\u0105c\u0105 na zapisaniu warto\u015bci InnerTextu (np. \u201eZnalezionych wynik\u00f3w: 220\u201d) z kontenera \u201eNumber of results\u201d do bufora \u201eresults_text\u201d. Nast\u0119pnie, po wykonaniu wszystkich krok\u00f3w zwi\u0105zanych z filtrowaniem ofert, korzystaj\u0105c z ActionMode \u201eWaitOn\u201d, dynamicznie oczekujemy na zmian\u0119 InnerText\u2019u w elemencie \u201eNumber of results\u201d.<\/p>\n\n\n\n<p>Kiedy tekst si\u0119 zaktualizuje jego nowa warto\u015b\u0107, tym razem jedynie liczba rezultat\u00f3w bez frazy \u201eZnalezionych wynik\u00f3w:\u201d, zostanie zapisana w nowym buforze dynamicznym \u201eresults\u201d. Nast\u0119pnie, warto\u015b\u0107 \u201eresults\u201d przyr\u00f3wnamy do zera i sprawdzimy, czy spe\u0142niona jest nier\u00f3wno\u015b\u0107 results &gt; 0. Wykorzystamy do tego celu modu\u0142 TBox Evaluation Tool ze zbioru Standard Modules. Je\u015bli nier\u00f3wno\u015b\u0107 zostanie spe\u0142niona, uznamy, \u017ce wyszukiwarka ofert pracy dzia\u0142a poprawnie.<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-full\"><a href=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_20.png\"><img decoding=\"async\" width=\"827\" height=\"501\" src=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_20.png\" alt=\"Tosca \u2013 edycja TestCase Templete'u\" class=\"wp-image-17123\" srcset=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_20.png 827w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_20-300x182.png 300w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_20-768x465.png 768w\" sizes=\"(max-width: 827px) 100vw, 827px\" \/><\/a><figcaption>Ryc. 32 Tosca \u2013 edycja TestCase Templete&#8217;u<\/figcaption><\/figure><\/div>\n\n\n\n<p>Po sko\u0144czonej edycji szablonu wystarczy ponownie wygenerowa\u0107 instancje, klikaj\u0105c prawym przyciskiem myszy na folder TempleteInstance i wybieraj\u0105c z menu opcj\u0119 \u201eReinstantiate Instance\u201d. Wprowadzone przez nas zmiany zaci\u0105gn\u0105 si\u0119 do wszystkich, utworzonych na bazie tego szablonu, instancji test\u00f3w.<\/p>\n\n\n\n<p>Uko\u0144czone testy mo\u017cemy przenie\u015b\u0107 do listy egzekucyjnej w zielonej sekcji Tosca, zwanej Execution. Po uruchomieniu test\u00f3w mamy mo\u017cliwo\u015b\u0107 wygenerowania czytelnego raportu z test\u00f3w, np. dla naszego \u201eulubionego\u201d managera \ud83d\ude09<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large\"><a href=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_21.png\"><img decoding=\"async\" width=\"1024\" height=\"725\" src=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_21-1024x725.png\" alt=\"Tosca \u2013 przyk\u0142adowy raport z wykonanych test\u00f3w \u2013 podsumowanie\" class=\"wp-image-17125\" srcset=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_21-1024x725.png 1024w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_21-300x212.png 300w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_21-768x543.png 768w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_21.png 1317w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><figcaption>Ryc. 33 Tosca \u2013 przyk\u0142adowy raport z wykonanych test\u00f3w \u2013 podsumowanie<\/figcaption><\/figure><\/div>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large\"><a href=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_22.png\"><img decoding=\"async\" width=\"1024\" height=\"717\" src=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_22-1024x717.png\" alt=\"Tosca \u2013 przyk\u0142adowy raport z wykonanych test\u00f3w \u2013 widok szczeg\u00f3\u0142owy\" class=\"wp-image-17127\" srcset=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_22-1024x717.png 1024w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_22-300x210.png 300w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_22-768x538.png 768w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/tosca_screen_22.png 1328w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><figcaption>Ryc. 34 Tosca \u2013 przyk\u0142adowy raport z wykonanych test\u00f3w \u2013 widok szczeg\u00f3\u0142owy<\/figcaption><\/figure><\/div>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Podsumowanie<\/strong><\/h2>\n\n\n\n<p>W niniejszym artykule starali\u015bmy si\u0119 por\u00f3wna\u0107 dwa rozwi\u0105zania: pierwsze, z u\u017cyciem narz\u0119dzia codeless i drugie \u2013 wykorzystuj\u0105ce standardowe, \u201eklasyczne\u201d podej\u015bcie do tematu automatyzacji test\u00f3w. Zdajemy sobie spraw\u0119, \u017ce rzetelne por\u00f3wnanie tak rozbudowanych narz\u0119dzi nie jest mo\u017cliwe w tak kr\u00f3tkiej publikacji, ale mamy nadziej\u0119, \u017ce prosty przyk\u0142ad, jakim si\u0119 pos\u0142u\u017cyli\u015bmy \u2013 test aplikacji webowej \u2013 pozwoli\u0142 Wam na zrozumienie podstawowych zasad tworzenia test\u00f3w zar\u00f3wno z u\u017cyciem Tosca jak i Cypressa.<\/p>\n\n\n\n<p>Bardziej dociekliwi czytelnicy zadaj\u0105 sobie teraz pytania typu: jak rozwi\u0105zania codeless radz\u0105 sobie z bardziej rozbudowanymi przyk\u0142adami? Czy umo\u017cliwiaj\u0105 wykonywanie np. operacji warunkowych i p\u0119tli? Co w przypadku aplikacji desktopowych, test\u00f3w API?<\/p>\n\n\n\n<p>Odpowiedzi na te pytania z pewno\u015bci\u0105 wkr\u00f3tce pojawi\u0105 si\u0119 na blogu Sii. Dowodem na to, \u017ce rozwi\u0105zania codeless \u201ezdaj\u0105 egzamin\u201d mo\u017ce by\u0107 fakt stale powi\u0119kszaj\u0105cego si\u0119 w Sii portfolia klient\u00f3w korzystaj\u0105cych z narz\u0119dzia Tricentis Tosca.<\/p>\n\n\n\n<p>Postaramy si\u0119 teraz odpowiedzie\u0107 na pytanie postawione w temacie artyku\u0142u <strong>\u201eCzy Tosca i podobne rozwi\u0105zania codeless s\u0105 przysz\u0142o\u015bci\u0105 testowania?\u201d<\/strong>. Mogliby\u015bmy stwierdzi\u0107 kr\u00f3tko \u2013 <strong>\u201eTak, s\u0105.\u201d<\/strong>, ale poni\u017cej nakre\u015blimy Wam <strong>kilka argument\u00f3w, kt\u00f3re utwierdzi\u0142y nas w tym przekonaniu<\/strong>.<\/p>\n\n\n\n<p>Szacuje si\u0119 (<a href=\"https:\/\/www.pap.pl\/mediaroom\/1259481%2Ckogo-poszukuje-rynek-it-w-polsce-jakich-specjalistow-brakuje.html\" rel=\"nofollow\" >dane wg PAP, czerwiec 2022<\/a>), \u017ce na ten moment w Unii Europejskiej brakuje oko\u0142o 600 tysi\u0119cy specjalist\u00f3w IT. W Polsce liczba ta wynosi 50 tysi\u0119cy. Mo\u017cna r\u00f3wnie\u017c zaobserwowa\u0107, \u017ce liczba ta nie maleje, wi\u0119c w 2023 mo\u017cemy si\u0119 spodziewa\u0107 kolejnych wzrost\u00f3w. Rynek pracy potrzebuje wi\u0119kszej liczby specjalist\u00f3w IT, ni\u017c uczelnie czy te\u017c r\u00f3\u017cnego rodzaju kursy i bootcampy s\u0105 w stanie wykszta\u0142ci\u0107.<\/p>\n\n\n\n<p>Zestawiaj\u0105c te dane z faktem, \u017ce na nauk\u0119 podstaw wybranego j\u0119zyka programowania nowa osoba potrzebuje oko\u0142o roku czasu, wysnu\u0107 mo\u017cna wniosek, \u017ce nale\u017cy szuka\u0107 innych rozwi\u0105za\u0144.<\/p>\n\n\n\n<p>Tutaj z pomoc\u0105 mog\u0105 przyj\u015b\u0107 w\u0142a\u015bnie platformy i aplikacje, kt\u00f3re s\u0105 w stanie tworzy\u0107 gotowe rozwi\u0105zania IT bez konieczno\u015bci pisania kodu. W ich przypadku znalezienie specjalisty w tej dziedzinie b\u0119dzie \u0142atwiejsze ze wzgl\u0119du na kr\u00f3tszy czas nauki i mniejsz\u0105 ilo\u015b\u0107 wymaganych umiej\u0119tno\u015bci technicznych \u201ena starcie\u201d. Z tego wzgl\u0119du coraz g\u0142o\u015bniej m\u00f3wi si\u0119 o tzw. \u201eCitizen Developerach\u201d \u2013 tw\u00f3rcach rozwi\u0105za\u0144 technicznych, kt\u00f3rzy nie musz\u0105 posiada\u0107 wiedzy programistycznej, czyli korzystaj\u0105cych de facto z rozwi\u0105za\u0144 \u201eno-code\u201d.<\/p>\n\n\n\n<p>Gdyby prze\u0142o\u017cy\u0107 poj\u0119cie <strong>\u201eCitizen Developer\u201d<\/strong> na \u015bwiat test\u00f3w, to mo\u017cna doj\u015b\u0107 do kolejnego wniosku \u2013 tester stosuj\u0105cy rozwi\u0105zania \u201eno-code\u201d mo\u017ce w ko\u0144cu rzeczywi\u015bcie skupi\u0107 si\u0119 na testach, a nie na rozwi\u0105zywaniu problem\u00f3w technicznych narastaj\u0105cych dooko\u0142a projektu.<\/p>\n\n\n\n<p>Ka\u017cdy kto pisa\u0142 testy automatyczne mo\u017ce zapewne przytoczy\u0107 minimum kilka sytuacji ze swojej przesz\u0142o\u015bci, gdzie zamiast rzeczywi\u015bcie skupi\u0107 si\u0119 na pisaniu testu, sp\u0119dzi\u0142 wiele godzin, rozwi\u0105zuj\u0105c problemy zupe\u0142nie z samym testem niezwi\u0105zane: niedzia\u0142aj\u0105ce biblioteki, niekompatybilne wersje zale\u017cno\u015bci projektowych, niebuduj\u0105cy si\u0119 projekt \u2013 a przecie\u017c \u201eu kolegi dzia\u0142a, a ma wszystko tak samo\u201d! O ile \u0142atwiejsze by\u0142oby nasze \u017cycie, gdyby\u015bmy w tym czasie mogli rzeczywi\u015bcie skupi\u0107 si\u0119 na scenariuszu testowym, a nie na tym, dlaczego co\u015b wczoraj dzia\u0142a\u0142o, a dzisiaj ju\u017c odm\u00f3wi\u0142o pos\u0142usze\u0144stwa&#8230;<\/p>\n\n\n\n<p>Nie mo\u017cna r\u00f3wnie\u017c pomin\u0105\u0107 tematu ilo\u015bci nauki, jaka czeka pocz\u0105tkuj\u0105cego testera automatyzuj\u0105cego u\u017cywaj\u0105cego rozwi\u0105za\u0144 \u201eno-code\u201d, w por\u00f3wnaniu do wiedzy, jak\u0105 musi posi\u0105\u015b\u0107 tester rozpoczynaj\u0105cy swoj\u0105 przygod\u0119 z podej\u015bciem okre\u015blonym przez nas jako \u201eklasyczne\u201d. Szczeg\u00f3lnie na starcie kariery \u2013 ogromny wysi\u0142ek zwi\u0105zany z opanowaniem nowego j\u0119zyka programowania, obs\u0142ugi gita, czy wspomnianych devtools\u00f3w.<\/p>\n\n\n\n<p>Dzi\u0119ki braku tych element\u00f3w, tester \u201eno-code\u201d mo\u017ce si\u0119 skupi\u0107 na szlifowaniu wiedzy z zakresu samego tworzenia test\u00f3w automatycznych, czy te\u017c praktyk czystego \u201ckodu\u201d (w przypadku rozwi\u0105za\u0144 \u201eno-code\u201d \u2013 czystej \u201estruktury test\u00f3w\u201d).<\/p>\n\n\n\n<p>W obydwu omawianych przyk\u0142adach (Tosca i Cypress) rozwa\u017cali\u015bmy podobne problemy, kt\u00f3re by\u0142y wyniesione poza poziom samego kodu Cypressa czy te\u017c GUI Tosci \u2013 w jaki spos\u00f3b chcemy budowa\u0107 selektory, co chcemy sprawdza\u0107, czy nasz test rzeczywi\u015bcie testuje to, co mia\u0142 testowa\u0107, czy nasze testy s\u0105 skalowalne i czytelne dla innych tester\u00f3w.<\/p>\n\n\n\n<p>Mo\u017cna zatem stwierdzi\u0107, \u017ce nauka jednego z tych rozwi\u0105za\u0144 nie zamyka mo\u017cliwo\u015bci nauki drugiego w przysz\u0142o\u015bci. Je\u017celi dobrze opanujemy podej\u015bcie \u201eklasyczne\u201d, to \u0142atwiej b\u0119dzie nam te\u017c nauczy\u0107 si\u0119 tworzenia podobnych test\u00f3w w przypadku narz\u0119dzi \u201eno-code\u201d i vice versa \u2013 je\u017celi tworzymy testy przy pomocy rozwi\u0105za\u0144 \u201eno-code\u201d i mamy w tym odpowiednie do\u015bwiadczenie, to w przypadku rozwi\u0105zania \u201eklasycznego\u201d b\u0119dziemy musieli nauczy\u0107 si\u0119 dodatkowo podstaw j\u0119zyka programowania, ale same za\u0142o\u017cenia pozostan\u0105 takie same (albo bardzo podobne).<\/p>\n\n\n\n<p>Naszymi przyk\u0142adami starali\u015bmy si\u0119 udowodni\u0107, \u017ce rozwi\u0105za\u0144 \u201eno-code\u201d nie trzeba si\u0119 obawia\u0107 i, czy tego chcemy czy nie, staj\u0105 si\u0119 one sta\u0142ym elementem wielu sektor\u00f3w \u015bwiata IT, w tym tak\u017ce testingu.<\/p>\n\n\n\n<p>Warto w tym miejscu wspomnie\u0107 o szerokich mo\u017cliwo\u015bciach tych narz\u0119dzi. Aktualnie, rozwi\u0105zanie Tricentis Tosca wspiera ponad 160 technologii wykorzystywanych do tworzenia oprogramowania, m.in.: .Net, Java, WPF, Windows 10, HTML, React, Angular, API, bazy danych (w tym r\u00f3wnie\u017c S\/4 HANA). Mo\u017cliwe jest wykonywanie test\u00f3w dla urz\u0105dze\u0144 mobilnych Android i iOS, a w zakresie aplikacji webowych Tosca oferuje wsparcie dla wszystkich popularnych na rynku przegl\u0105darek.<\/p>\n\n\n\n<p>Mamy nadziej\u0119, \u017ce chocia\u017c cz\u0119\u015b\u0107 z Was uda\u0142o nam si\u0119 zach\u0119ci\u0107 do wypr\u00f3bowania samemu rozwi\u0105za\u0144 codeless lub te\u017c po prostu \u2013 do rozpocz\u0119cia swojej przygody z automatyzacj\u0105 test\u00f3w. Je\u017celi po przeczytaniu naszego artyku\u0142u narodzi\u0142y si\u0119 w waszych g\u0142owach jakiekolwiek pytania \u2013 zapraszamy do kontaktu oraz dzieleniem si\u0119 waszymi opiniami w temacie \u201eno-code\u201d. Dodatkowo, je\u015bli chcecie \u201erzuci\u0107 okiem\u201d na testy opisane w tym artykule, to znale\u017a\u0107 mo\u017cecie je w utworzonych przez nas repozytoriach na GitHubie (<a href=\"https:\/\/github.com\/dirishere\/tosca-sii\" class=\"ek-link\" rel=\"nofollow\" >GitHub Daria &#8211; Tosca<\/a>, <a href=\"https:\/\/github.com\/WojMam\/cypressSimpleExample\" class=\"ek-link\" rel=\"nofollow\" >GitHub Wojtek \u2013 Cypress<\/a>). Dzi\u0119kujemy za po\u015bwi\u0119cony nam czas i do nast\u0119pnego razu!<br><\/p>\n\n\n<div class=\"kk-star-ratings kksr-auto kksr-align-left kksr-valign-bottom\"\n    data-payload='{&quot;align&quot;:&quot;left&quot;,&quot;id&quot;:&quot;17058&quot;,&quot;slug&quot;:&quot;default&quot;,&quot;valign&quot;:&quot;bottom&quot;,&quot;ignore&quot;:&quot;&quot;,&quot;reference&quot;:&quot;auto&quot;,&quot;class&quot;:&quot;&quot;,&quot;count&quot;:&quot;12&quot;,&quot;legendonly&quot;:&quot;&quot;,&quot;readonly&quot;:&quot;&quot;,&quot;score&quot;:&quot;5&quot;,&quot;starsonly&quot;:&quot;&quot;,&quot;best&quot;:&quot;5&quot;,&quot;gap&quot;:&quot;11&quot;,&quot;greet&quot;:&quot;&quot;,&quot;legend&quot;:&quot;5\\\/5 ( votes: 12)&quot;,&quot;size&quot;:&quot;18&quot;,&quot;title&quot;:&quot;Czy Tosca i podobne rozwi\u0105zania codeless s\u0105 przysz\u0142o\u015bci\u0105 testowania?&quot;,&quot;width&quot;:&quot;139.5&quot;,&quot;_legend&quot;:&quot;{score}\\\/{best} ( {votes}: {count})&quot;,&quot;font_factor&quot;:&quot;1.25&quot;}'>\n            \n<div class=\"kksr-stars\">\n    \n<div class=\"kksr-stars-inactive\">\n            <div class=\"kksr-star\" data-star=\"1\" style=\"padding-right: 11px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 18px; height: 18px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" data-star=\"2\" style=\"padding-right: 11px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 18px; height: 18px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" data-star=\"3\" style=\"padding-right: 11px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 18px; height: 18px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" data-star=\"4\" style=\"padding-right: 11px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 18px; height: 18px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" data-star=\"5\" style=\"padding-right: 11px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 18px; height: 18px;\"><\/div>\n        <\/div>\n    <\/div>\n    \n<div class=\"kksr-stars-active\" style=\"width: 139.5px;\">\n            <div class=\"kksr-star\" style=\"padding-right: 11px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 18px; height: 18px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" style=\"padding-right: 11px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 18px; height: 18px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" style=\"padding-right: 11px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 18px; height: 18px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" style=\"padding-right: 11px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 18px; height: 18px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" style=\"padding-right: 11px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 18px; height: 18px;\"><\/div>\n        <\/div>\n    <\/div>\n<\/div>\n                \n\n<div class=\"kksr-legend\" style=\"font-size: 14.4px;\">\n            5\/5 ( votes: 12)    <\/div>\n    <\/div>\n","protected":false},"excerpt":{"rendered":"<p>Poj\u0119cia takie jak \u201ecodeless\u201d, \u201elow-code\u201d czy \u201cno-code\u201d mo\u017cemy ostatnimi czasy spotka\u0107 praktycznie w ka\u017cdej dziedzinie \u015bwiata IT. Rozwi\u0105zania, kt\u00f3re pozwalaj\u0105 &hellip; <a class=\"continued-btn\" href=\"https:\/\/sii.pl\/blog\/czy-tosca-i-podobne-rozwiazania-codeless-sa-przyszloscia-testowania\/\">Continued<\/a><\/p>\n","protected":false},"author":439,"featured_media":19632,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"_editorskit_title_hidden":false,"_editorskit_reading_time":19,"_editorskit_is_block_options_detached":false,"_editorskit_block_options_position":"{}","inline_featured_image":false,"footnotes":""},"categories":[1317],"tags":[1571,1570,1051],"class_list":["post-17058","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-testowanie","tag-codeless","tag-tosca","tag-cypress"],"acf":[],"aioseo_notices":[],"republish_history":[],"featured_media_url":"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2022\/11\/Czy-Tosca-i-podobne-rozwiazania-codeless-sa-przyszloscia-testowania-1.jpg","category_names":["Testowanie"],"_links":{"self":[{"href":"https:\/\/sii.pl\/blog\/wp-json\/wp\/v2\/posts\/17058"}],"collection":[{"href":"https:\/\/sii.pl\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/sii.pl\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/sii.pl\/blog\/wp-json\/wp\/v2\/users\/439"}],"replies":[{"embeddable":true,"href":"https:\/\/sii.pl\/blog\/wp-json\/wp\/v2\/comments?post=17058"}],"version-history":[{"count":3,"href":"https:\/\/sii.pl\/blog\/wp-json\/wp\/v2\/posts\/17058\/revisions"}],"predecessor-version":[{"id":19634,"href":"https:\/\/sii.pl\/blog\/wp-json\/wp\/v2\/posts\/17058\/revisions\/19634"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/sii.pl\/blog\/wp-json\/wp\/v2\/media\/19632"}],"wp:attachment":[{"href":"https:\/\/sii.pl\/blog\/wp-json\/wp\/v2\/media?parent=17058"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/sii.pl\/blog\/wp-json\/wp\/v2\/categories?post=17058"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/sii.pl\/blog\/wp-json\/wp\/v2\/tags?post=17058"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}