How to use InputValueAsync method of Microsoft.Playwright.Core.Frame class

The author is available via:

var author = (string)TestContext.CurrentContext.Test.Properties.Get("Author");

If there are multiple Author attributes, this will retrieve the first one. If you want to see them all, use

var authors = (IList)TestContext.CurrentContext.Test.Properties["Author"];

I hit the same issue recently.

1. The error you are getting means that the certificates presented by the moon server to your client is incomplete. Try to provide the full chain of certs there!
2. If later, you get the "WebSocket error: self signed certificate in certificate chain" then you need to set the NODE_EXTRA_CA_CERTS env variable pointing at your pem file. This is happening being Node cannot read the trusted CAs by default.

This is the question/solution I posted for the Playwright team along with the resolution.

Your page might be recreating the DOM. To overcome that you can use the locator feature from playwright.

var locator = page.Locator("inputSelector");
await locator.ClickAsync();

Using ideas from comments on my answer I was able to accomplish the goal. I ended up passing a cancellation token to a Task.Delay(30000, token). Then if I got the data I wanted and set the result value, I just cancelled the token.

string? result = null;
var tokenSource = new CancellationTokenSource();
var cancelToken = tokenSource.Token;

// Start listening for new pages (ClickAsync below opens in a new page)
context.Page += (_, newPage) =>
{
  // From the new page, start listening for requests that page generates
  newPage.Request += async (_, request) =>
  {
    if (request.Url.Contains("some_identifier"))
    {
      await newPage.GotoAsync(request.Url);
      result = await newPage.InnerTextAsync("body");
      tokenSource.Cancel(); // <-- Got what we needed, cancel 30 second timer
    }
  };
};

await mainPage.Locator("a#somelink").ClickAsync();

try {
  await Task.Delay(30000, cancelToken); // <-- Timeout after 30 seconds.
}
catch
{
  // Not a fan of tokenSource.Cancel() throwing an exception, but I can deal with it.
}

return result;

The error came from me not correctly understanding Docker stages. Here a fixed Dockerfile, where I installed Playwright in the base stage:

FROM mcr.microsoft.com/dotnet/aspnet:6.0 AS base
RUN apt-get update
RUN apt-get -y install curl gnupg
RUN curl -sL https://deb.nodesource.com/setup_16.x  | bash -
RUN apt-get -y install nodejs
RUN npx playwright install
RUN apt-get update && apt-get install -y --no-install-recommends \
    fonts-liberation\
    libasound2\
    libatk-bridge2.0-0\
    libatk1.0-0\
    libatspi2.0-0\
    libcairo2\
    libcups2\
    libdbus-1-3\
    libdrm2\
    libgbm1\
    libglib2.0-0\
    libgtk-3-0\
    libnspr4\
    libnss3\
    libpango-1.0-0\
    libx11-6\
    libxcb1\
    libxcomposite1\
    libxdamage1\
    libxext6\
    libxfixes3\
    libxrandr2
WORKDIR /app

FROM mcr.microsoft.com/dotnet/sdk:6.0-focal  AS build
WORKDIR /src
COPY ["Dashboard/Dashboard.csproj", "Dashboard/"]
RUN dotnet restore "Dashboard/Dashboard.csproj"
COPY . .
WORKDIR "/src/Dashboard"
RUN dotnet build "Dashboard.csproj" -c Release -o /app/build
FROM build AS publish
RUN dotnet publish "Dashboard.csproj" -c Release -o /app/publish

FROM base AS final
WORKDIR /app
COPY --from=publish /app/publish .
ENTRYPOINT ["dotnet", "Dashboard.dll"]

This should do it:

ILocator service17 = page.Locator("//span[text()=ServiceName" + ServiceName + "]");

I ended up raising a bug and it seems others had the same issue

https://github.com/microsoft/playwright-dotnet/issues/1841

With Visual Studio projects you can add post-build-events, which will run on you dev machine and in the Azure Pipeline during a build (tested with VSBuild@1)

Example using the VS UI: (you will need to adjust paths for ubuntu)

echo $(TargetDir).playwright\node\win32_x64\playwright.cmd install
$(TargetDir).playwright\node\win32_x64\playwright.cmd install
echo Done

or adding directly to a .csproj

  <Target Name="PostBuild" AfterTargets="PostBuildEvent">
    <Exec Command="echo $(TargetDir).playwright\node\win32_x64\playwright.cmd install;$(TargetDir).playwright\node\win32_x64\playwright.cmd install;echo Done" />
  </Target>

The right CSS selector for that is DIV.v-image__image.v-image__image--contain

const browser = await playwright.chromium.launch({ headless: false });
let page = await browser.newPage();
await page.setContent(`
<div class="v-image__image v-image__image--contain" 
style='background-image: url("https://example.com/myimage.jpg"); 
background-position: right center;'></div>
`);

const el = await page.$("DIV.v-image__image.v-image__image--contain");
const styleProperty = await el.getProperty("style");
const style = await styleProperty.jsonValue();
console.log(style.backgroundImage);
await browser.close();