docs(api): fix code snippets foe locator ele

This commit is contained in:
amaechi hope 2024-10-16 20:39:15 +01:00
parent 183720b56a
commit f009575dc4

View file

@ -62,11 +62,11 @@ expect(page.get_by_text("Welcome, John!")).to_be_visible()
```
```csharp
await page.GetByLabel("User Name").FillAsync("John");
await Page.GetByLabel("User Name").FillAsync("John");
await page.GetByLabel("Password").FillAsync("secret-password");
await Page.GetByLabel("Password").FillAsync("secret-password");
await page.GetByRole(AriaRole.Button, new() { Name = "Sign in" }).ClickAsync();
await Page.GetByRole(AriaRole.Button, new() { Name = "Sign in" }).ClickAsync();
await Expect(Page.GetByText("Welcome, John!")).ToBeVisibleAsync();
```
@ -101,7 +101,7 @@ page.get_by_role("button", name="Sign in").click()
```
```csharp
await page.GetByRole(AriaRole.Button, new() { Name = "Sign in" }).ClickAsync();
await Page.GetByRole(AriaRole.Button, new() { Name = "Sign in" }).ClickAsync();
```
:::note
@ -143,7 +143,7 @@ locator.click()
```
```csharp
var locator = page.GetByRole(AriaRole.Button, new() { Name = "Sign in" });
var locator = Page.GetByRole(AriaRole.Button, new() { Name = "Sign in" });
await locator.HoverAsync();
await locator.ClickAsync();
@ -180,7 +180,7 @@ locator.click()
```
```csharp
var locator = page
var locator = Page
.FrameLocator("#my-frame")
.GetByRole(AriaRole.Button, new() { Name = "Sign in" });
@ -249,11 +249,11 @@ await Expect(Page
.GetByRole(AriaRole.Heading, new() { Name = "Sign up" }))
.ToBeVisibleAsync();
await page
await Page
.GetByRole(AriaRole.Checkbox, new() { Name = "Subscribe" })
.CheckAsync();
await page
await Page
.GetByRole(AriaRole.Button, new() {
NameRegex = new Regex("submit", RegexOptions.IgnoreCase)
})
@ -298,7 +298,7 @@ page.get_by_label("Password").fill("secret")
```
```csharp
await page.GetByLabel("Password").FillAsync("secret");
await Page.GetByLabel("Password").FillAsync("secret");
```
:::note[When to use label locators]
@ -335,7 +335,7 @@ page.get_by_placeholder("name@example.com").fill("playwright@microsoft.com")
```
```csharp
await page
await Page
.GetByPlaceholder("name@example.com")
.FillAsync("playwright@microsoft.com");
```
@ -468,7 +468,7 @@ page.get_by_alt_text("playwright logo").click()
```
```csharp
await page.GetByAltText("playwright logo").ClickAsync();
await Page.GetByAltText("playwright logo").ClickAsync();
```
:::note[When to use alt locators]
@ -540,7 +540,7 @@ page.get_by_test_id("directions").click()
```
```csharp
await page.GetByTestId("directions").ClickAsync();
await Page.GetByTestId("directions").ClickAsync();
```
:::note[When to use testid locators]
@ -604,7 +604,7 @@ page.get_by_test_id("directions").click()
```
```csharp
await page.GetByTestId("directions").ClickAsync();
await Page.GetByTestId("directions").ClickAsync();
```
### Locate by CSS or XPath
@ -644,11 +644,11 @@ page.locator("//button").click()
```
```csharp
await page.Locator("css=button").ClickAsync();
await page.Locator("xpath=//button").ClickAsync();
await Page.Locator("css=button").ClickAsync();
await Page.Locator("xpath=//button").ClickAsync();
await page.Locator("button").ClickAsync();
await page.Locator("//button").ClickAsync();
await Page.Locator("button").ClickAsync();
await Page.Locator("//button").ClickAsync();
```
XPath and CSS selectors can be tied to the DOM structure or implementation. These selectors can break when the DOM structure changes. Long CSS or XPath chains below are an example of a **bad practice** that leads to unstable tests:
@ -688,9 +688,9 @@ page.locator('//*[@id="tsf"]/div[2]/div[1]/div[1]/div/div[2]/input').click()
```
```csharp
await page.Locator("#tsf > div:nth-child(2) > div.A8SBwf > div.RNNXgb > div > div.a4bIc > input").ClickAsync();
await Page.Locator("#tsf > div:nth-child(2) > div.A8SBwf > div.RNNXgb > div > div.a4bIc > input").ClickAsync();
await page.Locator("//*[@id='tsf']/div[2]/div[1]/div[1]/div/div[2]/input").ClickAsync();
await Page.Locator("//*[@id='tsf']/div[2]/div[1]/div[1]/div/div[2]/input").ClickAsync();
```
:::note[When to use this]