mcpField
P
playwright-release-notes

playwright-release-notes

github.com/microsoft開発98.8k14 回インストール今日更新
リポジトリ

playwright-release-notes について

playwright-release-notesは、Playwrightのリリース文書を準備するコントリビューター向けのスキルです。Node.jsのリリースノートとPython、Java、.NETの翻訳を作成し、各言語のGitHubリリース用Markdownに変換する手順を示します。

主な機能

  1. 01Node.jsリリースノートの作成
  2. 02Python、Java、.NETへの翻訳
  3. 03言語別のAPI名とサンプルへの適合
  4. 04GitHubリリース用Markdownへの変換
  5. 05ドキュメントリンクの確認

活用シーン

  1. 014言語のリリース文書の準備
  2. 02言語ごとのAPIサンプルの調整
  3. 03リリース告知Markdownの作成と検証

インストール

コマンドをコピーしてターミナルで実行します。

$npx skills add https://github.com/microsoft/playwright --skill playwright-release-notes

インストール後、Claude Code で/playwright-release-notesを入力して読み込まれたか確認します。

詳細

リリースノート

このスキルでは、1.xx はリリース(例:1.64)を表します。

各リリースの ## Version 1.xx セクションは、docs/src/ 内の4つのファイルにあります。

言語ノートドキュメントのベース URLGitHub リリースのリポジトリ
Node.jsrelease-notes-js.mdhttps://playwright.dev/docs/microsoft/playwright
Pythonrelease-notes-python.mdhttps://playwright.dev/python/docs/microsoft/playwright-python
Javarelease-notes-java.mdhttps://playwright.dev/java/docs/microsoft/playwright-java
.NETrelease-notes-csharp.mdhttps://playwright.dev/dotnet/docs/microsoft/playwright-dotnet

Node.js のノートと3つの翻訳を同じ PR で作成し、各言語のリリース開始時に、すべての言語でノートが用意されている状態にします。その後、各言語のリポジトリでは、その言語独自の重要な変更のみを追加し、それぞれのセクションから GitHub リリースを作成します(手順3)。

1. Node.js のノート

docs/src/release-notes-js.md で、前のバージョンより上に ## Version 1.xx セクションを追加し、過去のバージョンを参考にします。

  • ハイライトを最初に記載します。それぞれ絵文字付きの見出しと短いサンプルを付けます。チームメイトに協力を依頼してください。
  • 続けて ### New APIs と #### グループ、### Breaking Changes ⚠️、### Announcements、### Browser Versions を記載します。ブラウザーのバージョンは node utils/print_versions.js で出力します。
  • API にはドキュメントリンクマクロを使用します:[`method: Page.frameLocator`]、[`property: Page.webmcp`]、[`event: Page.dialogClosed`]、[`option: Tracing.start.ariaSnapshots`]、[Locator]。各言語のドキュメントでは、その言語の名称で表示されます。
  • 他のドキュメントページへのリンクには相対パスを使用します:テストロック。

2. Python、Java、.NET 向けの翻訳

release-notes-python.md、release-notes-java.md、release-notes-csharp.md の各ファイルで、前のバージョンより上に ## Version 1.xx セクションを追加します。Node.js セクションをもとに翻訳してください。過去の翻訳で抜け落ちたり変更されたりした箇所は、各ファイルの Version 1.63 セクションを比較して確認してください。

各言語で、以下の点に従ってください。

  • 構成を維持します。絵文字付きの見出し、### New APIs とその下の #### グループ、### Breaking Changes ⚠️、### Announcements、### Browser Versions を含めます。
  • その言語にないものは削除します。
    • テストランナー:@playwright/test、test.*、設定、フィクスチャ、プロジェクト、レポーター、npx playwright test のオプション
    • UI モード、HTML レポート、コンポーネントテスト、VS Code 拡張機能
    • TypeScript 専用の機能(ジェネリクス、JSX、tsconfig)と devices ディスクリプター
    • langs でその言語(python、java、csharp)が除外されている API。docs/src/api/ の langs を確認してください。複数のメソッドで共有されるオプションは、docs/src/api/params.md で定義されています。
  • Node.js と異なる場合は、その言語の API を使用します。
    • 言語固有のオプションには独自の langs があります。たとえば、recordVideoFps は langs: csharp, java, python ですが、Node.js では recordVideo.fps です。
    • alias-<lang> はメンバー名を変更します。例:LocatorAssertions.toBeVisible の alias-java: isVisible。
    • 生成された API を、兄弟チェックアウトで名前を確認してください。../playwright-python/playwright/sync_api/_generated.py、../playwright-java/playwright/src/main/java/com/microsoft/playwright/、../playwright-dotnet/src/Playwright/API/Generated/ を参照してください。
  • Node.js のサンプルで playwright.config.ts を使ってライブラリの機能を示している場合は、代わりに API 呼び出しを示します。たとえば、1.64 の動画設定は Screencast.start と Screencast.showActions の呼び出しになりました。
  • API リンクはドキュメントのリンクマクロのままにします。言語によって異なるオプションは、その言語のものにリンクします([`option: Browser.newContext.recordVideoFps`])。通常のテキストでは、その言語の名前を使用します。
  • 相対リンクは、その言語に存在するページを参照する必要があります。*-js.md のページは Node.js 専用です。npm run doc を実行すると、各言語の壊れたリンクが報告されます。
  • 言語ポートでのみ行われた変更は追加しないでください。そうした変更は、各言語のリポジトリのリリースノートに記載されています。

コードサンプルは、各言語のスタイルに合わせて書き換えてください。infra ワークフローでは、python、java、csharp のスニペットの構文がチェックされます。

Python
  • 同期 API を使用します:page.get_by_role("button").click()。名前にはスネークケースを使用し、Python の値(True、False、None)を使います。
  • オプションはキーワード引数にします:page.get_by_role("button", name="Save")。オブジェクトと配列は辞書とリストにします:size={"width": 1920, "height": 1080}。
  • ARIA ロールなどの文字列値は文字列のままにします:"button"、"ai"。
  • イベント:page.on("dialogclosed", handler)。アサーション:expect(locator).to_have_text([...])。出力には print(...) を使います。
  • alias-python の名前を使用します:route.continue_()、locator.or_()、page.expect_request()。
  • コマンドは npx playwright install ではなく、playwright install と記述します。
Java
Node.jsJava
await page.goto('...')page.navigate("...");:await は不要で、ダブルクォート、セミコロン、型付きローカル変数(Locator dialog = ...)を使用します
page.getByRole('button', { name: 'Save' })page.getByRole(AriaRole.BUTTON, new Page.GetByRoleOptions().setName("Save"))
オプションオブジェクト { path: 'video.webm', fps: 60 }オプションビルダー new Screencast.StartOptions().setPath(Paths.get("video.webm")).setFps(60)
オブジェクトリテラル { name: 'session-id', value: '42', url }値クラス new Cookie("session-id", "42").setUrl(url)
['a', 'b']、{ a: 2 }Arrays.asList("a", "b")、Map.of("a", 2)。アサーションの引数には new String[] {"a", "b"} を使用します
プロパティ page.webmcp、context.tracingゲッター page.webmcp()、context.tracing()
イベント page.on('dialogclosed', handler)page.onDialogClosed(handler)
expect(locator).toHaveText(...)assertThat(locator).hasText(...)。同様に、toBeX → isX、toHaveX → hasX、toContainX → containsX、toMatchX → matchesX です
alias-java を持つ route.continue() などのメンバーエイリアス。例:route.resume()
npx playwright install --no-removemvn exec:java -e -D exec.mainClass=com.microsoft.playwright.CLI -D exec.args="install --no-remove"
文章中の "array"、undefined、'ai'"list"、null、"ai"
.NET
Node.js.NET
await page.goto('...')await page.GotoAsync("...");:メンバーは PascalCase、非同期メソッドには Async サフィックスを付け、ローカル変数には var を使い、ダブルクォートとセミコロンを使用します
page.getByRole('button', { name: 'Save' })page.GetByRole(AriaRole.Button, new() { Name = "Save" })
オプションオブジェクト { path: 'video.webm', fps: 60 }オプション初期化子 new() { Path = "video.webm", Fps = 60 }
ネストされたオブジェクト size: { width: 1920, height: 1080 }Size = new() { Width = 1920, Height = 1080 }
オブジェクトリテラル { name: 'session-id', value: '42', url }new Cookie { Name = "session-id", Value = "42", Url = url }
['a', 'b']、自由形式のオブジェクト { a: 2 }new[] { "a", "b"}、匿名オブジェクト new { a = 2 }
文字列リテラルの共用体の値 'ai'、'button'列挙型メンバー AriaSnapshotMode.Ai、AriaRole.Button
プロパティ page.webmcp、context.tracingプロパティ page.Webmcp、context.Tracing
イベント page.on('dialogclosed', handler)page.DialogClosed += (_, dialog) => { ... };
expect(locator).toHaveText(...)await Expect(locator).ToHaveTextAsync(...);
console.log(x)Console.WriteLine(x);
alias-csharp を持つメンバーエイリアス。例:page.request → page.APIRequest
共用体型のオプション(例:リストとしての httpCredentials)型ごとにプロパティを1つ使用します。例:HttpCredentialsList
npx playwright install --no-removepwsh bin/Debug/netX/playwright.ps1 install --no-remove
文章中のオプション名(fontSize)、undefinedFontSize、null

4つすべてのファイルを対象に、タイトルを docs: release notes for v1.xx とした PR を1件作成します。マージ後、playwright-cherry-pick スキルを使って release-1.xx にチェリーピックします。

3. GitHub リリースの Markdown

各リポジトリでは、その言語の GitHub リリースを公開します。リリース内容は release-1.xx にある ## Version 1.xx セクションを Markdown に変換したものです。リリースノートは自分で変換してください。

  • ## Version 1.xx 見出しは省略します。それ以外の見出しはすべて1レベル上げます(### は ## に、#### は ### にします)。

  • 各リンクマクロを完全なリンクに置き換えます。リンクには、先頭の表にある言語別のドキュメントベース URL と、その下のパスを使用します。リンクテキストには言語名を使用します。

    マクロドキュメントのベース URL 以降のパスNode.jsPythonJava.NET
    [Locator]api/class-locatorLocatorLocatorLocatorLocator
    [`method: Page.frameLocator`]api/class-page#page-frame-locatorpage.frameLocator()page.frame_locator()page.frameLocator()Page.FrameLocator()
    [`method: Page.ariaSnapshot`]api/class-page#page-aria-snapshotpage.ariaSnapshot()page.aria_snapshot()page.ariaSnapshot()Page.AriaSnapshotAsync()
    [`method: Locator.first`]api/class-locator#locator-firstlocator.first()locator.firstlocator.first()Locator.First
    [`property: Page.webmcp`]api/class-page#page-webmcppage.webmcppage.webmcppage.webmcp()Page.Webmcp
    [`event: BrowserContext.dialogClosed`]api/class-browsercontext#browser-context-event-dialog-closedbrowserContext.on('dialogclosed')browser_context.on("dialogclosed")browserContext.onDialogClosed()BrowserContext.DialogClosed
    [`method: LocatorAssertions.toBeVisible`]api/class-locatorassertions#locator-assertions-to-be-visibleexpect(locator).toBeVisible()expect(locator).to_be_visible()assertThat(locator).isVisible()Expect(Locator).ToBeVisibleAsync()
    [`option: Page.content.includeShadow`]api/class-page#page-content-option-include-shadow`includeShadow``include_shadow``includeShadow``IncludeShadow`
    [Playwright MCP](./getting-started-mcp.md)getting-started-mcpPlaywright MCPPlaywright MCPPlaywright MCPPlaywright MCP
  • 画像 ![alt](./images/foo.png) は、すべての言語で ![alt](https://github.com/microsoft/playwright/blob/main/docs/src/images/foo.png?raw=true) になります。

ページは class- と小文字のクラス名で構成されます。アンカーはクラス名とメンバー名をケバブケースにしたもので、たとえば APIRequestContext.addCookies は api-request-context-add-cookies になります。オプションには -option-<name>、イベントには -event-<name> が追加されます。アンカーには、言語によってメンバー名が異なる場合も docs/src/api/ の名前を使用するため、Java の isVisible() は #locator-assertions-to-be-visible にリンクします。

リンクテキストは言語に応じて変わります。

  • Node.js: クラスはローワーキャメルケースです(page、apiRequestContext、testConfig)。メソッドには () を付け、プロパティには付けません。イベントは on('<小文字のイベント名>') になり、アサーションは expect(locator).、expect(page).、または expect(response). で始まります。
  • Python: クラスとメンバーはスネークケースです(browser_context、api_request_context)。メソッドには () を付けます。_generated.py でメンバーが @property として宣言されている場合は、() のないプロパティになります。イベントは on("<小文字のイベント名>") になり、アサーションは expect(locator). で始まります。
  • Java: クラスはローワーキャメルケースで、メンバー名には alias-java を使用します。メソッドとプロパティには () を付け、イベントは on<Event>() になり、アサーションは assertThat(locator). で始まります。
  • .NET: インターフェイスの I を除いたクラス名(Page、APIRequestContext)と、生成された I<Class>.cs で宣言されているとおりのメンバー名を使用します。非同期メソッドには Async サフィックスと () を付け、同期メソッドには () を付けます。プロパティとイベントには括弧を付けません。アサーションは Expect(Locator). で始まります。

すべてのリンクが解決されることを確認します。Node.js のドキュメントロールが反映されると、playwright.dev にはすでにリリースのドキュメントが掲載されています。HTML は最小化されて配信されるため、アンカーは引用符なしで表示される場合があります(id=page-webmcp>)。

grep -oE 'https://playwright\.dev/[^) ]+' <notes-file> | sort -u | while read -r url; do
  page=${url%%#*}
  html=$(curl -sfL "$page") || { echo "MISSING PAGE   $url"; continue; }
  if [[ "$url" == *"#"* ]]; then
    anchor=${url#*#}
    grep -qE "id=\"?${anchor}[\" >]" <<<"$html" || echo "MISSING ANCHOR $url"
  fi
done

次に、変換されていない箇所や、リンクテキスト内に余分なスペースがないか確認します([Page. DialogClosed]、[`HttpCredentialsList `])。最初のコマンドはすべての言語に適用し、その後に対象の言語用コマンドを実行します。どちらも何も出力しないはずです。

# every language
grep -nE '\[`(method|property|event|option|param): |\]\(\./|\[[A-Z][A-Za-z]*\]([^(]|$)|\[[A-Za-z_]+\. |\[`[^`]+ `\]' <notes-file>
# Python: camelCase names in link text
grep -nE '\[[a-z_]+\.[a-z_]*[A-Z]|\[`[a-z]+[A-Z]' <notes-file>
# Java: JS-style events, assertions and properties
grep -nE "\.on\('|\b(toBe|toHave|toContain|toMatch)[A-Z]|\bawait\b|\barray\b|\bundefined\b|\[[a-z][A-Za-z]*\.[a-z][A-Za-z]*\]\(" <notes-file>
# .NET: lower-case classes or members, JS-style events
grep -nE "\.on\('|\bundefined\b|\[[a-z][A-Za-z]*\.|\[[A-Z][A-Za-z]*\.[a-z]|\[Expect\([a-z]" <notes-file>

変換によって、言語に存在しない API や不適切なスタイルのサンプルなど、ノート自体に問題があると分かった場合は、ノートも修正します(ステップ 2)。そうでない場合、問題は playwright.dev に残ります。

コメント