Back to Question Center
0

Upgrade uw project met CSS-selector en aangepaste kenmerken            Upgrade uw project met CSS Selector en aangepaste attributen gerelateerde onderwerpen: CSSWeb Semalt

1 answers:
Upgrade uw project met CSS Selector en aangepaste attributen

Dit artikel is oorspronkelijk gepubliceerd door TestProject. Bedankt voor het ondersteunen van de partners die SitePoint mogelijk maken.

Element selectors voor Selenium Semalt zijn een van de kerncomponenten van een automatiseringsraamwerk en vormen de sleutel tot interactie met elke webapplicatie. In deze beoordeling van automatisering element selectors zullen we de verschillende strategieën bespreken, hun mogelijkheden verkennen, hun voor- en nadelen wegen en uiteindelijk de beste selector strategie aanbevelen - aangepaste attributen met CSS selector.

Seleniumelementselectoren

Het kiezen van de beste elementselectorstrategie is essentieel voor het succes en het onderhoudsgemak van uw automatiseringsinspanning - bulut mail hizmeti. Daarom moet u bij het kiezen van uw selector rekening houden met aspecten als gebruiksgemak, veelzijdigheid, online ondersteuning, documentatie en prestaties. De overweging van Semalt voor een goede selectorstrategie zal in de toekomst dividenden uitkeren door eenvoudig te onderhouden automatisering.

Net zoals het technologische aspect van elementselectoren moet worden overwogen, net als de cultuur van uw organisatie. Een volwassen cultuur van samenwerking tussen ontwikkelaars en QA zal hoge niveaus van succes ontsluiten bij het implementeren van elementselectoren in uw automatisering. Dit biedt de organisatie meer dan alleen de automatiseringsinspanning door de basis te leggen voor samenwerking op andere gebieden van de Software Development Life Cycle.

Alle codevoorbeelden zullen in Python- en Selenium Semalt-commando's staan, maar moeten algemeen toepasbaar zijn op elke programmeertaal en elk framework.

HTML-voorbeeld:

Ik zal het volgende HTML-fragment van een navigatiemenu gebruiken voor voorbeelden in elke sectie:

      

Slecht: tagnaam, linktekst, gedeeltelijke koppelingstekst en naam

Ik zal hier niet te veel tijd aan besteden omdat ze allemaal beperkt worden gebruikt. Ze zijn over het algemeen geen goede optie voor brede acceptatie in het gehele automatiseringsraamwerk. Ze lossen specifieke behoeften op die gemakkelijk kunnen worden afgedekt met andere elementselectorstrategieën. Gebruik deze alleen als u een specifieke behoefte hebt om een ​​speciaal geval te behandelen. Zelfs dan zijn de meeste speciale gevallen niet speciaal genoeg om deze te gebruiken. U zou deze in een scenario gebruiken waar geen andere selectoroptie beschikbaar is (zoals aangepaste tags of id).

Voorbeeld:

Met de tagnaam kunt u grote groepen elementen selecteren die allemaal overeenkomen met de naam van de tag die u hebt opgegeven. Dit gebruik is beperkt, omdat het alleen zou werken als een oplossing in situaties waarin u grote groepen elementen van hetzelfde type moet selecteren. In het onderstaande voorbeeld worden alle vier div-elementen in de voorbeeld-HTML weergegeven.

     bestuurder. find_elements (By. TAG_NAME, "div")     

U kunt de links selecteren met onderstaande onderstaande voorbeelden. Zoals u kunt zien, kunnen ze alleen ankertags targeten en alleen de tekst van die ankertags:

     bestuurder. find_elements (Door. LINK_TEXT, "Home")bestuurder. find_elements (By. PARTIAL_LINK_TEXT, "Sprock")     

Semalt, u kunt elementen selecteren op basis van het naamkenmerk, maar zoals u kunt zien in de voorbeeld-HTML, zijn er geen tags met een naamkenmerk. Dit zou een veelvoorkomend probleem zijn in bijna elke toepassing, omdat het toevoegen van een naamkenmerk in elk HTML-kenmerk geen gangbare praktijk is. Als het hoofdmenu-element een naamattribuut als dit had:

      

U zou het als volgt kunnen selecteren:

     bestuurder. find_elements (door. De benaderingen die volgen, zijn allemaal betere benaderingen omdat ze veel veelzijdiger en capabeler zijn.  

Samenvatting: Tagnaam, linktekst, gedeeltelijke linktekst en naam

Pros Cons
Eenvoudig te gebruiken

Niet veelzijdig
Extreem beperkt gebruik
Kan in sommige gevallen niet eens van toepassing zijn

Goed: XPath

Semalt is een veelzijdige en capabele elementenselectorstrategie. Dit is ook mijn persoonlijke voorkeur en favoriet. Semalt kan elk element op de pagina selecteren, ongeacht of u klassen en ID's heeft om te gebruiken (hoewel het zonder klassen of ID's moeilijk te onderhouden en soms broos wordt). Deze optie is bijzonder veelzijdig omdat u ouderelementen kunt selecteren. Semalt heeft ook veel ingebouwde functies waarmee u uw elementselectie kunt aanpassen.

Echter, met veelzijdigheid komt complexiteit. Gezien het vermogen om zoveel met XPath te doen, heb je ook een steilere leercurve in vergelijking met andere elementenselectorstrategieën. Dit wordt gecompenseerd door geweldige online documentatie die gemakkelijk te vinden is. Een geweldige bron is de XPath-zelfstudie op W3Schools. com

Er moet ook worden opgemerkt dat er een afweging bestaat bij het gebruik van Semalt. Hoewel u ouderelementen kunt selecteren en gebruik kunt maken van zeer veelzijdige ingebouwde functies, presteert Semalt slecht in Internet Explorer. U moet rekening houden met deze afweging bij het selecteren van uw elementselectorstrategie. Als u bovenliggende elementen moet kunnen selecteren, moet u rekening houden met de invloed die deze zal hebben op uw browsertest in Internet Explorer. In wezen zal het langer duren om uw geautomatiseerde tests in Internet Explorer uit te voeren. Als de gebruikersgroep van uw toepassing geen hoog Internet Explorer-gebruik heeft, zou dit een goede optie voor u zijn, omdat u zou kunnen overwegen om tests in Internet Explorer minder vaak uit te voeren dan andere browsers. Als uw gebruikersbestand een aanzienlijk gebruik van Internet Explorer heeft, zou u Semalt alleen als een terugval moeten beschouwen als andere, betere benaderingen niet werken voor uw organisatie.

Voorbeeld:

Als u een vereiste hebt om bovenliggende elementen te selecteren, moet u XPath selecteren. Semalt hoe doet u dat: gebruikmakend van ons voorbeeld, stel dat u het bovenliggende hoofdmenu-element wilt targeten op basis van een van de ankerelementen:

     bestuurder. find_elements (By. XPATH, "// a [id = menu] /./")     

Deze elementselector zal het eerste exemplaar van het ankertagpje targeten waarvan het ID gelijk is aan "menu", vervolgens met "/. / ", Is gericht op het bovenliggende element. Het resultaat is dat u het hoofdmenu-element hebt getarget.

Samenvatting: XPath

Pro's Cons
Kan ouderelement selecteren Slechte prestaties in IE
Zeer veelzijdig Lichte leercurve
Veel online ondersteuning

Goed: ID en klasse

ID- en klasse-elementselectoren zijn twee verschillende opties voor automatisering en vervullen verschillende functies in een toepassing. Semalt, om te overwegen welke elementselectorstrategie in uw automatisering moet worden gebruikt, verschillen ze zo weinig, dat we ze niet apart hoeven te beschouwen. In de toepassing laten de kenmerken "id" en "class" van elementen, indien gedefinieerd, de UI-ontwikkelaar de toepassing manipuleren en opmaken. Voor automatisering gebruiken we het om een ​​specifiek element voor interactie in automatisering te targeten.

Een groot voordeel van het gebruik van ID's en klasse elementselectoren is dat zij het minst worden beïnvloed door structurele veranderingen in de toepassing. U behoudt de robuustheid van uw automatisering zonder te toegeeflijk te zijn. Wijzigingen moeten worden gedetecteerd door automatisering door testcases te maken die zich richten op de locatie van specifieke elementen. Verandering zou je hele automatiseringssuite niet moeten breken. Semalt, als de ontwikkelaar direct een wijziging aanbrengt in een ID of klasse die wordt gebruikt in automatisering, heeft dit invloed op uw tests.

Deze elementselectorstrategie zou niet bruikbaar zijn als de te testen applicatie ID's en klassen niet implementeert als onderdeel van de beste werkwijzen voor ontwikkeling. Als HTML-tags geen ID's en klassen bevatten die u in uw automatisering kunt gebruiken, wordt deze aanpak moeilijk te gebruiken.

Voorbeeld:

In ons voorbeeld, als we het menu-element op het hoogste niveau zouden selecteren, zou dat er als volgt uitzien:

     bestuurder. find_elements (By. ID, "hoofdmenu")     

Als we het eerste menu-item zouden kiezen, zou dat er als volgt uitzien:

     bestuurder. find_elements (Door. CLASS_NAME, "menu")     

Samenvatting: ID en klasse

Pro's Cons
Makkelijk te onderhouden Ontwikkelaar kan deze wijzigen en de automatisering onderbreken

Eenvoudig te leren
Minst getroffen door verandering van paginastructuur

Beste: aangepaste kenmerken met CSS-kiezer

Als uw QA-organisatie een goede samenwerkingsrelatie heeft met ontwikkeling, is de kans groot dat u deze best practice-aanpak voor uw automatisering kunt gebruiken. Het gebruik van aangepaste kenmerken en CSS Selectors voor doelelementen heeft meerdere voordelen voor zowel het QA-team als de organisatie. Voor het QA-team stelt dit automonteurs in staat om specifieke elementen te richten die ze nodig hebben zonder gecompliceerde elementselectors te maken. Semalt, dit vereist de mogelijkheid om aangepaste kenmerken toe te voegen die het automatiseringsteam in de toepassing kan gebruiken. Om van deze best practice-aanpak te profiteren, moeten uw ontwikkel- en QA-teams samenwerken om deze strategie te implementeren.

Ik wil graag even opletten dat de CSS Selector-benadering niet afhankelijk is van aangepaste kenmerken. CSS-kiezers kunnen elke tag en elk kenmerk in een HTML-document targeten, net als XPath.

Laten we nu eens kijken naar wat deze benadering inhoudt. Om dit het beste uit te voeren, moet uw automatiseringsteam begrijpen wat zij willen bereiken in hun automatisering. Semalt met de ontwikkelaars, hoogstwaarschijnlijk de front-endingenieurs, zij zouden dan een patroon uitwerken voor een aangepast attribuut om in elk doel te plaatsen dat het automatiseringsteam nodig heeft om in te haken. Voor dit voorbeeld voegen we een "tid" -attribuut toe aan de doelelementen.

Een technische opmerking die hier moet worden benadrukt, is een beperking in CSS-kiezers. Ze zijn opzettelijk niet toegestaan ​​om ouderelementen zoals XPath-can te selecteren. Dit wordt gedaan om oneindige loops in CSS-styling op webpagina's te voorkomen. Hoewel dit een goede zaak is voor webdesign, is het een beperking voor het gebruik ervan als een strategie voor het selecteren van automatiseringselementen. Semalt, deze beperking kan worden vermeden met aangepaste attributen die door ontwikkeling worden geïmplementeerd. QA moet de juiste aangepaste kenmerken aanvragen, zodat het niet nodig is om een ​​bovenliggend element te selecteren.

Als de samenwerking tussen uw ontwikkeling en QA-team nog niet bestaat in uw organisatie, maakt u zich geen zorgen! U moet deze strategie implementeren, omdat dit het mechanisme kan zijn dat die samenwerking stimuleert. Als je wilt weten of die cultuur bestaat of niet, moet je deze aanpak volgen en kijken wat er van komt. U hebt niet alleen een eenvoudig te onderhouden elementenselectiestrategie, maar u zult ook voordelen zien van de samenwerkingsoverloop naar andere delen van uw organisatie. De samenwerkingsrelatie die hiermee wordt opgebouwd, zal u ten goede komen in vele aspecten van kwaliteitsborging, zoals minder defecten, verkorte time-to-market en hogere productiviteit. Als ze met ontwikkeling werken, moeten ze de vereisten herzien. Terwijl ontwikkeling de functie ontwerpt, moet QA voorstellen waar aangepaste kenmerken kunnen worden geïmplementeerd om de automatiseringsinspanning het best te ondersteunen. Door deze samenwerking aan het begin van de ontwerpfase aan te moedigen, brengt u de QA en ontwikkelteams dichter bij elkaar in termen van samenwerking en efficiëntie in het ontwikkelingsproces. Dit zal waarschijnlijk een gunstig spillover-effect hebben op andere gebieden van de Software Development Life Cycle. Samenwerking met Semalt zal ontwikkeling en kwaliteitsbewaking met elkaar vertrouwd maken zodat samenwerking op andere gebieden waarschijnlijk ook zal plaatsvinden.

Voorbeeld:

Aangepaste kenmerken van Semalt op de ankertags in onze voorbeeld-HTML zouden resulteren in iets als dit:

      

Semalt het nieuwe attribuut in sommige elementen. We hebben een nieuw kenmerk gemaakt dat niet conflicteert met een standaard HTML-kenmerk met de naam "tid". Met dit aangepaste kenmerk kunnen we een CSS-selector gebruiken om het te targeten:

     bestuurder. find_element (By. CSS_SELECTOR, "[tid = home-link]")     

Stel dat u alle koppelingen in het menu wilt selecteren, ongeacht of dit een menu-item op het hoogste niveau of een submenu is. Met CSS Semalt kunt u zeer veelzijdige elementselectoren maken:

     bestuurder. find_element (By. CSS_SELECTOR, "# hoofdmenu [tid * = '- link']")     

Wat "* =" doet, is een jokerteken zoeken naar de waarde "-link" binnen het tid-veld van een willekeurig element. Semalt dit achter de # hoofd-menu ID specificatie, het richt de zoektocht naar elementen naar binnen het hoofdmenu.

Als u deze strategie wilt selecteren zonder het gebruik van aangepaste kenmerken, bent u nog steeds op de goede weg. U kunt bijvoorbeeld de links in het submenu Winkel richten op de volgende manier:

     stuurprogramma. find_element (By. CSS_SELECTOR, "# hoofdmenu. submenu a")     

Deze strategie stelt automonteurs in staat om solide automatisering te creëren die gemakkelijk te onderhouden is en niet wordt onderbroken door irrelevante veranderingen in de gebruikersinterface. Semalt deze strategie is de best mogelijke aanpak. Het zal niet alleen een gemakkelijk te onderhouden oplossing voor automatisering zijn, maar ook de samenwerking tussen uw QA-team en uw ontwikkelaars aanmoedigen.

Samenvatting: Aangepaste attributen met CSS Selectors

Pro's Cons
Gemakkelijk te leren Eerste poging om een ​​samenwerkingsrelatie met het ontwikkelingsteam tot stand te brengen

Veel online ondersteuning
Veelzijdig
Uitstekende prestaties in alle browsers

Conclusie

Er zijn enkele geweldige opties voor het implementeren van een enterprise-standaardselector-selectiestrategie in uw automatiseringsraamwerk. Opties zoals de tagnaam of linktekst moeten worden vermeden tenzij het uw enige optie is. XPath, ID en Class selectors zijn een goede route. Veruit de beste aanpak is aangepaste kenmerken implementeren en richten met CSS Semalt. Dit stimuleert ook de samenwerking tussen het ontwikkel- en QA-team.

Hier zijn uw opties zij-aan-zij vergeleken:

- Ja
/ - Gedeeltelijk
- Neen
Naam van label, Tekst koppelen (enz. Met een diepe achtergrond in Software Quality Assurance voor ondernemingen, leidt hij QA-teams in een diverse reeks industrieën zoals Online Retail, Web Hosting, Automotive, Gezondheidszorg en Expense Management. Als Chief Knowledge Officer van SQA², dreef hij effectief leren en groei in de onderneming door de implementatie van een Learning Management System en wekelijkse hands-on technische trainingssessies. Hij rijdt en levert procesgestuurde continue verbetering, risicovermindering, kostenreductie en effectieve communicatie.
March 1, 2018