💡 Add comments with instructions for Playwright screenshot scripts (f…

…astapi#12193)

scripts/playwright/request_form_models/image01.py

@@ -8,11 +8,13 @@
 # Run playwright codegen to generate the code below, copy paste the sections in run()
 def run(playwright: Playwright) -> None:
     browser = playwright.chromium.launch(headless=False)
-    context = browser.new_context()
+    # Update the viewport manually
+    context = browser.new_context(viewport={"width": 960, "height": 1080})
     page = context.new_page()
     page.goto("http://localhost:8000/docs")
     page.get_by_role("button", name="POST /login/ Login").click()
     page.get_by_role("button", name="Try it out").click()
+    # Manually add the screenshot
     page.screenshot(path="docs/en/docs/img/tutorial/request-form-models/image01.png")
 
     # ---------------------

scripts/playwright/separate_openapi_schemas/image01.py

@@ -3,13 +3,16 @@
 from playwright.sync_api import Playwright, sync_playwright
 
 
+# Run playwright codegen to generate the code below, copy paste the sections in run()
 def run(playwright: Playwright) -> None:
     browser = playwright.chromium.launch(headless=False)
+    # Update the viewport manually
     context = browser.new_context(viewport={"width": 960, "height": 1080})
     page = context.new_page()
     page.goto("http://localhost:8000/docs")
     page.get_by_text("POST/items/Create Item").click()
     page.get_by_role("tab", name="Schema").first.click()
+    # Manually add the screenshot
     page.screenshot(
         path="docs/en/docs/img/tutorial/separate-openapi-schemas/image01.png"
     )

scripts/playwright/separate_openapi_schemas/image02.py

@@ -3,14 +3,17 @@
 from playwright.sync_api import Playwright, sync_playwright
 
 
+# Run playwright codegen to generate the code below, copy paste the sections in run()
 def run(playwright: Playwright) -> None:
     browser = playwright.chromium.launch(headless=False)
+    # Update the viewport manually
     context = browser.new_context(viewport={"width": 960, "height": 1080})
     page = context.new_page()
     page.goto("http://localhost:8000/docs")
     page.get_by_text("GET/items/Read Items").click()
     page.get_by_role("button", name="Try it out").click()
     page.get_by_role("button", name="Execute").click()
+    # Manually add the screenshot
     page.screenshot(
         path="docs/en/docs/img/tutorial/separate-openapi-schemas/image02.png"
     )

scripts/playwright/separate_openapi_schemas/image03.py

@@ -3,14 +3,17 @@
 from playwright.sync_api import Playwright, sync_playwright
 
 
+# Run playwright codegen to generate the code below, copy paste the sections in run()
 def run(playwright: Playwright) -> None:
     browser = playwright.chromium.launch(headless=False)
+    # Update the viewport manually
     context = browser.new_context(viewport={"width": 960, "height": 1080})
     page = context.new_page()
     page.goto("http://localhost:8000/docs")
     page.get_by_text("GET/items/Read Items").click()
     page.get_by_role("tab", name="Schema").click()
     page.get_by_label("Schema").get_by_role("button", name="Expand all").click()
+    # Manually add the screenshot
     page.screenshot(
         path="docs/en/docs/img/tutorial/separate-openapi-schemas/image03.png"
     )

scripts/playwright/separate_openapi_schemas/image04.py

@@ -3,14 +3,17 @@
 from playwright.sync_api import Playwright, sync_playwright
 
 
+# Run playwright codegen to generate the code below, copy paste the sections in run()
 def run(playwright: Playwright) -> None:
     browser = playwright.chromium.launch(headless=False)
+    # Update the viewport manually
     context = browser.new_context(viewport={"width": 960, "height": 1080})
     page = context.new_page()
     page.goto("http://localhost:8000/docs")
     page.get_by_role("button", name="Item-Input").click()
     page.get_by_role("button", name="Item-Output").click()
     page.set_viewport_size({"width": 960, "height": 820})
+    # Manually add the screenshot
     page.screenshot(
         path="docs/en/docs/img/tutorial/separate-openapi-schemas/image04.png"
     )

scripts/playwright/separate_openapi_schemas/image05.py

@@ -3,13 +3,16 @@
 from playwright.sync_api import Playwright, sync_playwright
 
 
+# Run playwright codegen to generate the code below, copy paste the sections in run()
 def run(playwright: Playwright) -> None:
     browser = playwright.chromium.launch(headless=False)
+    # Update the viewport manually
     context = browser.new_context(viewport={"width": 960, "height": 1080})
     page = context.new_page()
     page.goto("http://localhost:8000/docs")
     page.get_by_role("button", name="Item", exact=True).click()
     page.set_viewport_size({"width": 960, "height": 700})
+    # Manually add the screenshot
     page.screenshot(
         path="docs/en/docs/img/tutorial/separate-openapi-schemas/image05.png"
     )