@@ -99,10 +99,9 @@ Here's the inspection panel for result links:
9999
100100![ Inspecting the result link elements] ( images/inspect-result-links.png )
101101
102- Result links are ` a ` elements with the class ` result__a ` .
103- They are under ` h2 ` elements with the class ` result__title ` .
104- We could use the selector ` .result__title a.result__a ` to identify all result links on the page.
105- (If you look in the DevTools search bar, you'll see that this selector locates 10 elements.)
102+ Result links are ` a ` elements with a ` data-testid ` attribute set to ` "result-title-a" ` .
103+ We could use the CSS selector ` a[data-testid="result-title-a"] ` to identify all result links on the page.
104+ (If you look in the DevTools search bar, you'll see that this selector locates 12 elements.)
106105
107106Since we can get all elements with one selector,
108107we can take the following steps to verify that search result links pertain to the phrase:
@@ -121,7 +120,7 @@ Explicit waiting will be tricky.
121120Add the following line to the test:
122121
123122``` python
124- page.locator(' .result__title a.result__a ' ).nth(4 ).wait_for()
123+ page.locator(' a[data-testid="result-title-a"] ' ).nth(4 ).wait_for()
125124```
126125
127126Let's break this down:
@@ -130,7 +129,7 @@ Let's break this down:
130129 [ ` Locator ` ] ( https://playwright.dev/python/docs/api/class-locator ) object for the target element.
131130 A ` Locator ` object can make many of the same calls as a page, like clicking and getting text.
132131 However, it can also make calls for explicit waiting and calls that target multiple elements.
133- 2 . ` .result__title a.result__a ` is the selector for the result links.
132+ 2 . ` a[data-testid="result-title-a"] ` is the selector for the result links.
1341333 . ` nth(4) ` is an [ N-th element] ( https://playwright.dev/python/docs/api/class-locator#locator-nth ) fetcher.
135134 N-th element fetchers are zero-indexed and may be appended to any selector.
136135 In this call, it will fetch the fifth result link element.
@@ -145,7 +144,7 @@ Waiting for five links to appear should be good enough for our testing purposes.
145144After the links appear, we can scrape their text contents like this:
146145
147146``` python
148- titles = page.locator(' .result__title a.result__a ' ).all_text_contents()
147+ titles = page.locator(' a[data-testid="result-title-a"] ' ).all_text_contents()
149148```
150149
151150Again, we must use the ` locator ` method because we want to target a list of elements instead of one.
@@ -194,8 +193,8 @@ def test_basic_duckduckgo_search(page: Page) -> None:
194193 expect(page.locator(' #search_form_input' )).to_have_value(' panda' )
195194
196195 # And the search result links pertain to the phrase
197- page.locator(' .result__title a.result__a ' ).nth(4 ).wait_for()
198- titles = page.locator(' .result__title a.result__a ' ).all_text_contents()
196+ page.locator(' a[data-testid="result-title-a"] ' ).nth(4 ).wait_for()
197+ titles = page.locator(' a[data-testid="result-title-a"] ' ).all_text_contents()
199198 matches = [t for t in titles if ' panda' in t.lower()]
200199 assert len (matches) > 0
201200
@@ -245,8 +244,8 @@ def test_basic_duckduckgo_search(page: Page) -> None:
245244 expect(page.locator(' #search_form_input' )).to_have_value(' panda' )
246245
247246 # And the search result links pertain to the phrase
248- page.locator(' .result__title a.result__a ' ).nth(4 ).wait_for()
249- titles = page.locator(' .result__title a.result__a ' ).all_text_contents()
247+ page.locator(' a[data-testid="result-title-a"] ' ).nth(4 ).wait_for()
248+ titles = page.locator(' a[data-testid="result-title-a"] ' ).all_text_contents()
250249 matches = [t for t in titles if ' panda' in t.lower()]
251250 assert len (matches) > 0
252251
0 commit comments