Nimekuwa katika maendeleo ya mbele kwa muda wa kutosha kuona mtindo kwa miaka mingi: watengenezaji wachanga wanafanya kazi na dhana mpya ya upangaji bila kuelewa muktadha wake wa kihistoria. Ni, bila shaka, inaeleweka kikamilifu kutojua kitu. Wavuti ni sehemu kubwa sana yenye seti mbalimbali za ujuzi na utaalamu, na huwa hatujui tusichojua kila mara. Kujifunza katika uwanja huu ni safari inayoendelea badala ya kitu kinachotokea mara moja na kumalizika. Mfano halisi: Mtu fulani kwenye timu yangu aliuliza ikiwa inawezekana kusema ikiwa watumiaji watatoka kwenye kichupo fulani katika UI. Niliashiria tukio la kabla ya kupakuliwa la JavaScript. Lakini wale ambao wameshughulikia hili hapo awali wanajua hii inawezekana kwa sababu wamepigwa na arifa kuhusu data ambayo haijahifadhiwa kwenye tovuti zingine, ambazo kabla ya kupakua ni kesi ya kawaida ya matumizi. Pia nilielekeza ukurasaFicha na kuonekanaBadilisha matukio kwa mwenzangu kwa hatua nzuri. Nilijuaje kuhusu hilo? Kwa sababu ilikuja katika mradi mwingine, sio kwa sababu nilisoma juu yake wakati wa kujifunza JavaScript. Ukweli ni kwamba mifumo ya kisasa ya mbele imesimama kwenye mabega ya makubwa ya teknolojia yaliyotangulia. Ni mazoea dhahania ya ukuzaji, mara nyingi kwa matumizi bora ya msanidi ambayo hupunguza, au hata kuondoa, hitaji la kujua au kugusa zile ambazo kwa kawaida zimekuwa dhana muhimu za mbele ambayo kila mtu anastahili kujua. Fikiria Muundo wa Kitu cha CSS (CSSOM). Unaweza kutarajia kwamba mtu yeyote anayefanya kazi katika CSS na JavaScript ana rundo la uzoefu wa CSSOM, lakini haitakuwa hivyo kila wakati. Kulikuwa na mradi wa React wa tovuti ya e-commerce niliyofanyia kazi ambapo tulihitaji kupakia laha ya mtindo kwa mtoa huduma aliyechaguliwa kwa sasa. Shida ilikuwa kwamba laha ya mtindo ilikuwa ikipakia kwenye kila ukurasa wakati ilihitajika tu kwenye ukurasa maalum. Msanidi programu aliyepewa jukumu la kufanya hili lifanyike hajawahi kupakia laha ya mtindo kwa nguvu. Tena, hii inaeleweka kabisa wakati React inapoondoa mbinu ya kitamaduni ambayo unaweza kuwa umefikia. CSSOM huenda si kitu unachohitaji katika kazi yako ya kila siku. Lakini kuna uwezekano utahitaji kuingiliana nayo wakati fulani, hata kwa mfano wa mara moja. Matukio haya yalinitia moyo kuandika makala hii. Kuna vipengele vingi vya wavuti na teknolojia zilizopo porini ambazo huenda usiwahi kuzigusa moja kwa moja katika kazi yako ya kila siku. Labda wewe ni mpya kwa ukuzaji wa wavuti na hujui kuyajua kwa sababu umezama katika uondoaji wa mfumo maalum ambao hauhitaji kuujua kwa undani, au hata kabisa. Ninazungumza haswa juu ya XML, ambayo wengi wetu tunajua ni lugha ya zamani isiyo tofauti kabisa na HTML. Ninaleta hili kwa sababu ya majadiliano ya hivi majuzi ya WHATWG yanayopendekeza kwamba sehemu kubwa ya safu ya XML inayojulikana kama upangaji wa programu ya XSLT inapaswa kuondolewa kwenye vivinjari. Hii ndiyo aina kamili ya teknolojia ya zamani, iliyopo ambayo tumekuwa nayo kwa miaka mingi ambayo inaweza kutumika kwa kitu kinachofaa kama hali ya CSSOM ambayo timu yangu ilikuwa nayo. Je, umefanya kazi na XSLT hapo awali? Hebu tuone ikiwa tutaegemea sana teknolojia hii ya zamani na kutumia vipengele vyake nje ya muktadha wa XML ili kutatua matatizo ya ulimwengu halisi leo. XPath: API ya Kati Teknolojia muhimu zaidi ya XML ambayo labda ni muhimu zaidi nje ya mtazamo wa moja kwa moja wa XML ni XPath, lugha ya kuuliza ambayo hukuruhusu kupata nodi au sifa yoyote kwenye mti wa ghafi wenye kipengele kimoja cha mizizi. Nina mapenzi ya kibinafsi kwa XSLT, lakini hiyo pia inategemea XPath, na mapenzi ya kibinafsi lazima yawekwe kando katika umuhimu wa cheo. Hoja ya kuondoa XSLT haimtaji XPath, kwa hivyo nadhani bado inaruhusiwa. Hiyo ni nzuri kwa sababu XPath ndio API kuu na muhimu zaidi katika safu hii ya teknolojia, haswa wakati wa kujaribu kupata kitu cha kutumia nje ya matumizi ya kawaida ya XML. Ni muhimu kwa sababu, ingawa viteuzi vya CSS vinaweza kutumika kupata vipengele vingi kwenye ukurasa wako, haviwezi kuvipata vyote. Zaidi ya hayo, viteuzi vya CSS haviwezi kutumiwa kupata kipengele kulingana na nafasi yake ya sasa katika DOM. XPath inaweza. Sasa, baadhi yenu mnaosoma hii wanaweza kujua XPath, na wengine wasijue. XPath ni eneo kubwa la teknolojia, na siwezi kufundisha misingi yote na pia kukuonyesha mambo mazuri ya kufanya nayo katika makala moja kama hii. Nilijaribu kuandika nakala hiyo, lakini uchapishaji wa wastani wa Jarida la Smashing hauendi zaidi ya maneno 5,000. Nilikuwa tayari zaidi yaManeno 2,000 huku nusu tu ya mambo ya msingi. Kwa hivyo, nitaanza kufanya mambo mazuri na XPath na kukupa viungo ambavyo unaweza kutumia kwa misingi ikiwa utapata mambo haya ya kuvutia. Inachanganya XPath na CSS XPath inaweza kufanya mambo mengi ambayo wateuzi wa CSS hawawezi kufanya wakati wa kuuliza vipengele. Lakini wateuzi wa CSS wanaweza pia kufanya mambo machache ambayo XPath haiwezi, yaani, kuuliza vipengele kwa jina la darasa.
CSS XPath .Darasa langu /*[ina(@class, "myClass")]
Katika mfano huu, vipengele vya maswali vya CSS ambavyo vina jina la darasa la .myClass. Wakati huo huo, mfano wa XPath unauliza vipengele ambavyo vina darasa la sifa na mfuatano wa "myClass". Kwa maneno mengine, huchagua vipengee vilivyo na myClass katika sifa yoyote, ikijumuisha vipengele vilivyo na jina la darasa la .myClass - pamoja na vipengee vilivyo na "myClass" kwenye mfuatano, kama vile .myClass2. XPath ni pana kwa maana hiyo. Kwa hiyo, hapana. Sipendekezi kwamba tunapaswa kutupa CSS na kuanza kuchagua vipengele vyote kupitia XPath. Hiyo sio maana. Jambo ni kwamba XPath inaweza kufanya mambo ambayo CSS haiwezi na bado yanaweza kuwa ya manufaa sana, ingawa ni teknolojia ya zamani katika mrundikano wa kivinjari na inaweza ionekane dhahiri kwa mtazamo wa kwanza. Hebu tutumie teknolojia hizi mbili pamoja si kwa sababu tu tunaweza, lakini kwa sababu tutajifunza kitu kuhusu XPath katika mchakato, na kuifanya kuwa zana nyingine katika mrundikano wako - ambayo huenda hukujua imekuwa hapo wakati wote! Tatizo ni kwamba mbinu ya JavaScript's document.evaluate na mbinu mbalimbali za kuchagua hoja tunazotumia na API za CSS za JavaScript hazioani. Nimeunda API inayolingana ya kuuliza ili kutuwezesha kuanza, ingawa inakubalika, sijaweka mawazo mengi ndani yake kwani ni kuondoka kwa kile tunachofanya hapa. Hapa kuna mfano rahisi wa kufanya kazi wa mjenzi wa swali anayeweza kutumika tena: Tazama swala la PenXPath [iliyogawanywa] na Bryan Rasmussen. Nimeongeza njia mbili kwenye kitu cha hati: queryCSSSelectors (ambayo kimsingi ni querySelectorAll) na queryXPaths. Zote mbili zinarudisha kitu cha queryResults:
{ queryType: nodi | kamba | nambari | boolean, matokeo: vipengele vyovyote[] // html, vipengele vya xml, kamba, nambari, booleans, queryCSSSelectors: (swali: kamba, rekebisha: boolean) => queryResults, queryXpaths: (swali: kamba, rekebisha: boolean) => queryResults }
Vitendo vya queryCSSSelectors na queryXpaths huendesha hoja unayowapa juu ya vipengele katika safu ya matokeo, mradi tu safu ya matokeo ni ya aina ya nodi, bila shaka. Vinginevyo, itarudisha queryResult na safu tupu na aina ya nodi. Ikiwa kipengele cha kurekebisha kitawekwa kuwa ndivyo, chaguo za kukokotoa zitabadilisha queryResults zao wenyewe. Kwa hali yoyote hii haipaswi kutumiwa katika mazingira ya uzalishaji. Ninaifanya kwa njia hii ili kuonyesha athari mbali mbali za kutumia API mbili za hoja pamoja. Mfano Maswali Ninataka kuonyesha mifano michache ya maswali tofauti ya XPath ambayo yanaonyesha baadhi ya mambo yenye nguvu wanayoweza kufanya na jinsi yanavyoweza kutumika badala ya mbinu zingine. Mfano wa kwanza ni //li/text(). Hii huuliza vipengee vyote vya li na kurudisha nodi zao za maandishi. Kwa hivyo, ikiwa tungeuliza HTML ifuatayo:
- moja
- mbili
- tatu
...hiki ndicho kinachorejeshwa:
{"queryType":"xpathValuate","matokeo":["moja","mbili","tatu"],"aina ya matokeo":"kamba"}
Kwa maneno mengine, tunapata safu ifuatayo: ["moja", "mbili","tatu"]. Kwa kawaida, ungeuliza vipengee vya li kupata hiyo, geuza matokeo ya hoja hiyo kuwa safu, ramani ya safu, na urudishe nodi ya maandishi ya kila kipengele. Lakini tunaweza kufanya hivyo kwa ufupi zaidi na XPath: document.queryXPaths("//li/text()").matokeo.
Tambua kuwa njia ya kupata nodi ya maandishi ni kutumia text(), ambayo inaonekana kama saini ya kazi - na ndivyo ilivyo. Inarudisha nodi ya maandishi ya kipengele. Katika mfano wetu, kuna vipengele vitatu vya li katika markup, kila moja ina maandishi ("moja", "mbili", na "tatu").
Wacha tuangalie mfano mmoja zaidi wa swala la maandishi (). Chukulia hii ni alama yetu:
Hebu tuandike swali ambalo linarudisha thamani ya sifa ya href: document.queryXPaths("//a[text() = 'Ingia']/@href").matokeo.
Hili ni swali la XPath kwenye hati ya sasa, kama tu mfano wa mwisho, lakini wakati huu tunarudisha sifa ya href ya kiungo (kipengele) kilicho na maandishi "Ingia". Kweli kurudimatokeo ni ["/login.html"]. Muhtasari wa Kazi za XPath Kuna idadi ya kazi za XPath, na labda hujui nazo. Kuna kadhaa, nadhani, ambazo zinafaa kujua, pamoja na zifuatazo:
starts-withKama maandishi yanaanza na mfano fulani wa maandishi, huanza-na(@href, 'http:') hurejesha kweli ikiwa sifa ya href inaanza na http:. InaKama maandishi yana mfano mwingine wa maandishi, yana(text(), "Smashing Magazine") inarudi kuwa kweli ikiwa nodi ya maandishi ina maneno "Smashing Magazine" ndani yake popote. countHurejesha hesabu ya ngapi zinazolingana kwenye hoja. Kwa mfano, count(//*[starts-with(@href, 'http:']) inarudisha hesabu ya viungo vingapi katika nodi ya muktadha vina vipengee vyenye sifa ya href ambayo ina maandishi yanayoanza na http:. substringWorks kama JavaScript substring, isipokuwa wewe kupita kamba kama hoja. Kwa mfano, substring("maandishi yangu", 2, 4) inarudisha "y t". substring-beforeHurejesha sehemu ya mfuatano kabla ya mfuatano mwingine. Kwa mfano, substing-before("maandishi yangu", " ") inarudisha "yangu". Vile vile, substring-before("hi","bye") inarudisha kamba tupu. substring-afterInarudisha sehemu ya mfuatano baada ya mfuatano mwingine. Kwa mfano, substing-after("maandishi yangu", " ") inarudisha "maandishi". Vile vile, substring-after("hi","bye") hurejesha kamba tupu. normalize-spaceHurejesha mfuatano wa hoja wenye nafasi nyeupe iliyosawazishwa kwa kuondoa nafasi nyeupe inayoongoza na inayofuata na kubadilisha mfuatano wa herufi za nafasi nyeupe kwa nafasi moja. notHurejesha boolean kweli ikiwa hoja ni ya uwongo, vinginevyo si kweli. trueReturns boolean true. falseHurejesha uwongo wa boolean. concatKitu sawa na JavaScript concat, isipokuwa huiendeshi kama njia kwenye kamba. Badala yake, unaweka mifuatano yote unayotaka kuunganisha. string-lengthHii si sawa na urefu wa kamba ya JavaScript, lakini hurejesha urefu wa mfuatano uliotolewa kama hoja. translateHii inachukua mfuatano na kubadilisha hoja ya pili hadi hoja ya tatu. Kwa mfano, tafsiri("abcdef", "abc", "XYZ") matokeo ya XYZdef.
Kando na vitendaji hivi mahususi vya XPath, kuna idadi ya vitendaji vingine vinavyofanya kazi sawa na wenzao wa JavaScript - au wenzao katika lugha yoyote ya programu - ambayo labda ungeona kuwa muhimu, kama vile sakafu, dari, pande zote, jumla, na kadhalika. Onyesho lifuatalo linaonyesha kila moja ya vipengele hivi: Tazama kazi za Nambari za Pen XPath [zilizogawanyika] na Bryan Rasmussen. Kumbuka kuwa, kama kazi nyingi za kudanganya kwa kamba, nyingi za nambari huchukua ingizo moja. Kwa kweli, hii ni kwa sababu zinapaswa kutumika kwa kuuliza, kama katika mfano wa XPath wa mwisho: //li[sakafu(maandishi()) > 250]/@val
Ukizitumia, kama mifano mingi inavyofanya, utaishia kuiendesha kwenye nodi ya kwanza inayolingana na njia. Pia kuna baadhi ya vitendaji vya ubadilishaji wa aina ambavyo unapaswa kuepuka kwa sababu JavaScript tayari ina matatizo yake ya ubadilishaji wa aina. Lakini kunaweza kuwa na nyakati ambapo unataka kubadilisha mfuatano kuwa nambari ili uikague dhidi ya nambari nyingine. Kazi zinazoweka aina ya kitu ni boolean, nambari, kamba, na nodi. Hizi ndizo aina muhimu za data za XPath. Na kama unavyoweza kufikiria, kazi nyingi hizi zinaweza kutumika kwenye hifadhidata ambazo sio nodi za DOM. Kwa mfano, mfuatano wa substring-after huchukua mfuatano kama tulivyoshughulikia, lakini unaweza kuwa mfuatano kutoka kwa sifa ya href. Inaweza pia kuwa kamba:
const testSubstringAfter = document.queryXPaths("substring-after('hello world',' ')");
Ni wazi, mfano huu utaturudishia safu ya matokeo kama ["ulimwengu"]. Ili kuonyesha hii kwa vitendo, nimeunda ukurasa wa onyesho kwa kutumia vitendaji dhidi ya vitu ambavyo sio nodi za DOM: Tazama swala la PenXPath [iliyogawanywa] na Bryan Rasmussen. Unapaswa kutambua kipengele cha kushangaza cha kazi ya kutafsiri, ambayo ni kwamba ikiwa una mhusika katika hoja ya pili (yaani, orodha ya wahusika unaotaka kutafsiriwa) na hakuna herufi inayolingana ya kutafsiri, mhusika huyo huondolewa kwenye matokeo. Kwa hivyo, hii:
translate('Habari, Jina langu ni Inigo Montoya, umemuua baba yangu, jiandae kufa','abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ,','*')
…husababisha mfuatano, ikijumuisha nafasi: [" * * ** "]
Hii ina maana kwamba herufi "a" inatafsiriwa kwa nyota (*), lakini kila herufi nyingine ambayo haina tafsiri kutokana na mfuatano unaolengwa huondolewa kabisa. Nafasi nyeupe ndiyo yote tumebakizakati ya vibambo "a" vilivyotafsiriwa. Kisha tena, swali hili:
translate('Habari, Jina langu ni Inigo Montoya, umemuua baba yangu, jiandae kufa','abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ,','**********************************************')")
... haina shida na hutoa matokeo ambayo yanaonekana kama hii:
"***** ** **** ******************************************************"
Inaweza kukugusa kwamba hakuna njia rahisi katika JavaScript kufanya kile hasa kazi ya kutafsiri XPath hufanya, ingawa kwa hali nyingi za utumiaji, replaceAll na misemo ya kawaida inaweza kuishughulikia. Unaweza kutumia mbinu ile ile ambayo nimeonyesha, lakini hiyo ni ndogo ikiwa unachotaka ni kutafsiri tungo. Onyesho lifuatalo linafunika kazi ya kutafsiri ya XPath ili kutoa toleo la JavaScript: Tazama kazi ya kutafsiri ya Kalamu [iliyogawanywa] na Bryan Rasmussen. Unaweza kutumia wapi kitu kama hiki? Fikiria usimbaji fiche wa Caesar Cipher na sehemu tatu (k.m., usimbaji fiche wa hali ya juu kutoka 48 B.K.):
translate("Kaisari anapanga kuvuka Rubicon!", "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz", "XYZABCDEFGHIJKLMNOPQRSTUVWxyzabcdefghijklmnopqrstuvw")
Maandishi ya ingizo "Kaisari anapanga kuvuka Rubikoni!" matokeo katika "Zxbpxo fp mixkkfkd ql zolpp qeb Oryfzlk!" Ili kutoa mfano mwingine wa haraka wa uwezekano tofauti, nilifanya kazi ya chuma ambayo inachukua pembejeo ya kamba na hutumia kazi ya kutafsiri ili kurejesha maandishi, ikiwa ni pamoja na wahusika wote wanaochukua umlauts. Tazama kazi ya chuma ya kalamu [iliyogawanywa] na Bryan Rasmussen.
const metal = (str) => { rudisha tafsiri(str, "AOUaou","ÄÖÜäöü"); }
Na, ikipewa maandishi "Motley Crue sheria, rock on dudes!", inarejesha "Mötley Crüe rüles, röck ön düdes!" Ni wazi, mtu anaweza kuwa na matumizi ya kila aina ya mbishi wa kipengele hiki. Ikiwa ni wewe, basi nakala hii ya TVTropes inapaswa kukupa msukumo mwingi. Kutumia CSS Na XPath Kumbuka sababu yetu kuu ya kutumia viteuzi vya CSS pamoja na XPath: CSS inaelewa sana darasa ni nini, ilhali bora unayoweza kufanya na XPath ni kulinganisha kwa kamba ya sifa ya darasa. Hiyo itafanya kazi katika hali nyingi. Lakini ikiwa ungewahi kuingia katika hali ambapo, tuseme, mtu fulani aliunda madarasa yanayoitwa .primaryLinks na .primaryLinks2 na ulikuwa unatumia XPath kupata darasa la .primaryLinks, basi kuna uwezekano ungekumbana na matatizo. Kwa muda mrefu kama hakuna kitu kijinga kama hicho, labda ungetumia XPath. Lakini ninahuzunika kuripoti kwamba nimefanya kazi mahali ambapo watu wanafanya aina hizo za mambo ya kipuuzi. Hapa kuna onyesho lingine linalotumia CSS na XPath pamoja. Inaonyesha kile kinachotokea tunapotumia msimbo kuendesha XPath kwenye nodi ya muktadha ambayo sio nodi ya hati. Tazama Pen css na xpath pamoja [iliyogawanyika] na Bryan Rasmussen. Hoja ya CSS ni .relatedarticles a, ambayo huleta vipengele viwili katika div iliyopewa darasa la .relatedarticles. Baada ya hayo kuna maswali matatu "mbaya", ambayo ni kusema, maswali ambayo hayafanyi tunachotaka wafanye wakati wa kukimbia na vitu hivi kama nodi ya muktadha. Ninaweza kueleza kwa nini wanatenda tofauti na unavyoweza kutarajia. Maswali matatu mabaya katika swali ni:
//text(): Hurejesha maandishi yote kwenye hati. //a/text(): Hurejesha maandishi yote ndani ya viungo kwenye hati. ./a/text(): Hairudishi matokeo.
Sababu ya matokeo haya ni kwamba ingawa muktadha wako ni vipengele vilivyorejeshwa kutoka kwa hoja ya CSS, // huenda kinyume na hati nzima. Hii ndiyo nguvu ya XPath; CSS haiwezi kutoka kwenye nodi hadi kwa babu na kisha kwenda kwa ndugu wa babu huyo, na kutembea chini hadi kwa mzao wa ndugu huyo. Lakini XPath inaweza. Wakati huo huo, ./ huuliza watoto wa nodi ya sasa, ambapo nukta (.) inawakilisha nodi ya sasa, na mkwaju wa mbele (/) unawakilisha kwenda kwenye nodi fulani ya mtoto - iwe ni sifa, kipengele, au maandishi huamuliwa na sehemu inayofuata ya njia. Lakini hakuna mtoto kipengele kilichochaguliwa na swali la CSS, kwa hivyo hoja hiyo pia hairudishi chochote. Kuna maswali matatu mazuri katika onyesho hilo la mwisho:
.//text(), ./maandishi(), normalize-space(./text()).
Hoja ya kurekebisha nafasi inaonyesha utumiaji wa utendakazi wa XPath, lakini pia hurekebisha tatizo lililojumuishwa katika hoja zingine. HTML imeundwa kama hii:
Kuendesha Majaribio Yako ya Kipengele Na Selenium WebDriver
Hoja inarudisha kulisha kwa mstari mwanzoni na mwisho wa nodi ya maandishi,na normalize-space huondoa hii. Kutumia kitendakazi chochote cha XPath ambacho hurejesha kitu kingine isipokuwa boolean na ingizo la XPath hutumika kwa vitendakazi vingine. Onyesho lifuatalo linaonyesha idadi ya mifano: Tazama mifano ya kazi za Pen xpath [iliyogawanywa] na Bryan Rasmussen. Mfano wa kwanza unaonyesha shida ambayo unapaswa kuangalia. Hasa, nambari ifuatayo:
document.queryXPaths("string-after(//a/@href,'https://')");
... inarejesha mfuatano mmoja:
"www.smashingmagazine.com/2018/04/feature-testing-selenium-webdriver/"
Inaleta maana, sawa? Chaguo hizi za kukokotoa hazirudishi safu bali mifuatano moja au nambari moja. Kuendesha chaguo la kukokotoa mahali popote na matokeo mengi hurejesha tu matokeo ya kwanza. Matokeo ya pili yanaonyesha kile tunachotaka kweli:
document.queryCSSSelectors("a").queryXPaths("substring-after(./@href,'https://')");
Ambayo inarudisha safu ya nyuzi mbili:
["www.smashingmagazine.com/2018/04/feature-testing-selenium-webdriver/","www.smashingmagazine.com/2022/11/automated-test-results-kuboresha-accessibility/"]
Vitendaji vya XPath vinaweza kuwekwa kama vitendaji katika JavaScript. Kwa hivyo, ikiwa tunajua muundo wa URL ya Jarida la Smashing, tunaweza kufanya yafuatayo (kutumia maandishi ya kiolezo kunapendekezwa): `tafsiri ( kamba ndogo ( substring-after(./@href, ‘www.smashingmagazine.com/') ,9), '/','')`
Hili linazidi kuwa tata kiasi kwamba linahitaji maoni kuelezea kile kinachofanya: chukua URL zote kutoka kwa sifa ya href baada ya www.smashingmagazine.com/, ondoa herufi tisa za kwanza, kisha utafsiri herufi ya mbele (/) kuwa bure ili kuondoa mwisho wa kufyeka mbele. Safu inayotokana:
["kipengele-kipengele-kiendeshaji-selenium-webdriver","matokeo-ya-mtihani-otomatiki-kuboresha-ufikivu"]
Kesi Zaidi za Matumizi ya XPath XPath inaweza kuangaza katika majaribio. Sababu sio ngumu kuona, kwani XPath inaweza kutumika kupata kila kitu kwenye DOM, kutoka kwa nafasi yoyote kwenye DOM, wakati CSS haiwezi. Huwezi kutegemea madarasa ya CSS kubaki thabiti katika mifumo mingi ya kisasa ya ujenzi, lakini kwa XPath, tunaweza kufanya ulinganifu thabiti zaidi kuhusu maudhui ya maandishi ya kipengele ni nini, bila kujali muundo wa DOM unaobadilika. Kumekuwa na utafiti juu ya mbinu zinazokuruhusu kufanya majaribio ya uthabiti ya XPath. Hakuna kitu kibaya zaidi kuliko kuwa na majaribio nje na kushindwa kwa sababu tu kiteuzi cha CSS hakifanyi kazi tena kwa sababu kitu kimepewa jina au kuondolewa. XPath pia ni nzuri sana katika uchimbaji wa locator nyingi. Kuna zaidi ya njia moja ya kutumia hoja za XPath kulinganisha kipengele. Ndivyo ilivyo na CSS. Lakini hoja za XPath zinaweza kufafanua mambo kwa njia inayolengwa zaidi ambayo inazuia kile kinachorejeshwa, kukuruhusu kupata inayolingana mahususi ambapo kunaweza kuwa na mechi kadhaa zinazowezekana. Kwa mfano, tunaweza kutumia XPath kurudisha kipengee mahususi cha h2 ambacho kimo ndani ya div ambayo hufuata mara moja div ya ndugu ambayo, kwa upande wake, ina kipengele cha picha ya mtoto chenye sifa ya data-testID="leader" juu yake:
usipate kichwa hiki
Usipate kichwa hiki pia
Kichwa cha picha ya kiongozi
Hili ndilo swali: document.queryXPaths(` // div[ ndugu-wafuatao::div[1] /img[@data-testID='kiongozi'] ] /h2/ maandishi () `);
Wacha tuandike onyesho ili kuona jinsi yote yanavyoungana: Tazama Hoja ya Pen Complex H2 [iliyogawanywa] na Bryan Rasmussen. Kwa hiyo, ndiyo. Kuna njia nyingi zinazowezekana kwa kitu chochote kwenye jaribio kwa kutumia XPath. Uachaji wa XSLT 1.0 Nilitaja mapema kwamba timu ya Chrome inapanga kuondoa msaada wa XSLT 1.0 kutoka kwa kivinjari. Hiyo ni muhimu kwa sababu XSLT 1.0 hutumia programu inayolenga XML kwa mabadiliko ya hati ambayo, kwa upande wake, inategemea XPath 1.0, ambayo ndiyo inayopatikana katika vivinjari vingi. Hilo likitokea, tutapoteza sehemu muhimu ya XPath. Lakini kwa kuzingatia ukweli kwamba XPath ni nzuri sana kwa uandishi wa majaribio, sioni uwezekano kwamba XPath kwa ujumla itatoweka hivi karibuni. Hiyo ilisema, nimegundua kuwa watu huvutiwa na kipengele kinapoondolewa. Na hiyo ni kweli katika kesi ya XSLT 1.0 kuwa inaacha kutumika. Kuna mjadala mzima unaofanyika kwenye Hacker News uliojaa hoja dhidi ya kuacha kujiendesha. Chapisho lenyewe ni mfano mzuri wa kuunda mfumo wa kublogi na XSLT. Weweunaweza kujisomea mjadala, lakini inaingia katika jinsi JavaScript inaweza kutumika kama shim kwa XLST kushughulikia aina hizo za kesi. Pia nimeona mapendekezo kwamba vivinjari vitumie SaxonJS, ambayo ni bandari ya Saxon XSLT ya JavaScript, XQUERY, na injini za XPath. Hilo ni wazo la kufurahisha, haswa kama Saxon-JS inavyotumia toleo la sasa la vipimo hivi, ilhali hakuna kivinjari kinachotumia toleo lolote la XPath au XSLT zaidi ya 1.0, na hakuna inayotumia XQuery. Niliwasiliana na Norm Tovey-Walsh huko Saxonica, kampuni iliyo nyuma ya SaxonJS na matoleo mengine ya injini ya Saxon. Alisema: "Ikiwa muuzaji yeyote wa kivinjari angependa kuchukua SaxonJS kama sehemu ya kuanzia ya kuunganisha teknolojia za kisasa za XML kwenye kivinjari, tungefurahi kuijadili nao." - Norm Tovey-Walsh.
Lakini pia aliongeza: "Ningeshangaa sana ikiwa mtu yeyote angefikiria kwamba kuchukua SaxonJS katika hali yake ya sasa na kuitupa kwenye muundo wa kivinjari bila kubadilika itakuwa njia bora. Muuzaji wa kivinjari, kwa asili ya ukweli kwamba wanaunda kivinjari, anaweza kukaribia ujumuishaji kwa kiwango cha ndani zaidi kuliko tunaweza 'kutoka nje'." - Norm Tovey-Walsh.
Inafaa kumbuka kuwa maoni ya Tovey-Walsh yalikuja karibu wiki moja kabla ya tangazo la uondoaji wa XSLT. Hitimisho Ningeweza kuendelea na kuendelea. Lakini natumai hii imeonyesha nguvu ya XPath na kukupa mifano mingi inayoonyesha jinsi ya kuitumia kufanikisha mambo makubwa. Ni mfano mzuri wa teknolojia ya zamani katika safu ya kivinjari ambayo bado ina matumizi mengi leo, hata kama hujawahi kujua ilikuwepo au haujawahi kufikiria kuifikia. Kusoma Zaidi
"Kuimarisha Ustahimilivu wa Majaribio ya Wavuti ya Kiotomatiki kwa Lugha Asilia" (Maktaba Dijiti ya ACM) na Maroun Ayli, Youssef Bakouny, Nader Jalloul, na Rima KilanyMakala haya yanatoa mifano mingi ya XPath ya kuandika majaribio dhabiti. XPath (MDN)Hapa ni pazuri pa kuanzia ikiwa unataka maelezo ya kiufundi yanayoelezea jinsi XPath inavyofanya kazi. XPath Tutorial (ZVON)Nimeona mafunzo haya kuwa ya manufaa zaidi katika ujifunzaji wangu mwenyewe, shukrani kwa wingi wa mifano na maelezo wazi. XPatherZana hii ingiliani hukuwezesha kufanya kazi moja kwa moja na msimbo.
Enjoyed This Article?
Get weekly tips on growing your audience and monetizing your content — straight to your inbox.
No spam. Join 138,000+ creators. Unsubscribe anytime.