docs: allow lang-specific sh snippets (#5024)

docs/src/api/class-browsercontext.md

@@ -124,7 +124,7 @@ the JavaScript environment, e.g. to seed `Math.random`.
 
 An example of overriding `Math.random` before the page loads:
 
-```js
+```js browser
 // preload.js
 Math.random = () => 42;
 ```

docs/src/api/class-page.md

@@ -429,7 +429,7 @@ the JavaScript environment, e.g. to seed `Math.random`.
 
 An example of overriding `Math.random` before the page loads:
 
-```js
+```js browser
 // preload.js
 Math.random = () => 42;
 ```

docs/src/cli.md

@@ -9,10 +9,14 @@ Playwright comes with the command line tools that run via `npx` or as a part of
 
 ## Usage
 
-```sh
+```sh js
 $ npx playwright --help
 ```
 
+```sh python
+$ python -m playwright
+```
+
 Running from `package.json` script
 ```json
 {
@@ -24,10 +28,14 @@ Running from `package.json` script
 
 ## Generate code
 
-```sh
+```sh js
 $ npx playwright codegen wikipedia.org
 ```
 
+```sh python
+$ python -m playwright codegen wikipedia.org
+```
+
 Run `codegen` and perform actions in the browser. Playwright CLI will generate JavaScript code for the user interactions. `codegen` will attempt to generate resilient text-based selectors.
 
 <img src="https://user-images.githubusercontent.com/284612/92536033-7e7ebe00-f1ed-11ea-9e1a-7cbd912e3391.gif"></img>
@@ -36,53 +44,89 @@ Run `codegen` and perform actions in the browser. Playwright CLI will generate J
 
 Run `codegen` with `--save-storage` to save [cookies](https://developer.mozilla.org/en-US/docs/Web/HTTP/Cookies) and [localStorage](https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage) at the end. This is useful to separately record authentication step and reuse it later.
 
-```sh
+```sh js
 $ npx playwright --save-storage=auth.json codegen
 # Perform authentication and exit.
 # auth.json will contain the storage state.
 ```
 
+```sh python
+$ python -m playwright --save-storage=auth.json codegen
+# Perform authentication and exit.
+# auth.json will contain the storage state.
+```
+
 Run with `--load-storage` to consume previously loaded storage. This way, all [cookies](https://developer.mozilla.org/en-US/docs/Web/HTTP/Cookies) and [localStorage](https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage) will be restored, bringing most web apps to the authenticated state.
 
-```sh
+```sh js
 $ npx playwright --load-storage=auth.json open my.web.app
 $ npx playwright --load-storage=auth.json codegen my.web.app
 # Perform actions in authenticated state.
 ```
 
+```sh python
+$ python -m playwright --load-storage=auth.json open my.web.app
+$ python -m playwright --load-storage=auth.json codegen my.web.app
+# Perform actions in authenticated state.
+```
+
 ## Open pages
 
 With `open`, you can use Playwright bundled browsers to browse web pages. Playwright provides cross-platform WebKit builds that can be used to reproduce Safari rendering across Windows, Linux and macOS.
 
-```sh
+```sh js
 # Open page in Chromium
-npx playwright open example.com
+$ npx playwright open example.com
 ```
 
-```sh
+```sh python
+# Open page in Chromium
+$ python -m playwright open example.com
+```
+
+```sh js
 # Open page in WebKit
-npx playwright wk example.com
+$ npx playwright wk example.com
+```
+
+```sh python
+# Open page in WebKit
+$ python -m playwright wk example.com
 ```
 
 ### Emulate devices
 `open` can emulate mobile and tablet devices ([see all devices](https://github.com/microsoft/playwright/blob/master/src/server/deviceDescriptors.ts)).
 
-```sh
+```sh js
 # Emulate iPhone 11.
-npx playwright --device="iPhone 11" open wikipedia.org
+$ npx playwright --device="iPhone 11" open wikipedia.org
+```
+
+```sh python
+# Emulate iPhone 11.
+$ python -m playwright --device="iPhone 11" open wikipedia.org
 ```
 
 ### Emulate color scheme and viewport size
-```sh
+```sh js
 # Emulate screen size and color scheme.
-npx playwright --viewport-size=800,600 --color-scheme=dark open twitter.com
+$ npx playwright --viewport-size=800,600 --color-scheme=dark open twitter.com
+```
+```sh python
+# Emulate screen size and color scheme.
+$ python -m playwright --viewport-size=800,600 --color-scheme=dark open twitter.com
 ```
 
 ### Emulate geolocation, language and timezone
-```sh
+```sh js
 # Emulate timezone, language & location
 # Once page opens, click the "my location" button to see geolocation in action
-npx playwright --timezone="Europe/Rome" --geolocation="41.890221,12.492348" --lang="it-IT" open maps.google.com
+$ npx playwright --timezone="Europe/Rome" --geolocation="41.890221,12.492348" --lang="it-IT" open maps.google.com
+```
+```sh python
+# Emulate timezone, language & location
+# Once page opens, click the "my location" button to see geolocation in action
+$ python -m playwright --timezone="Europe/Rome" --geolocation="41.890221,12.492348" --lang="it-IT" open maps.google.com
 ```
 
 ## Inspect selectors
@@ -130,14 +174,19 @@ Generates selector for the given element.
 
 ## Take screenshot
 
-```sh
+```sh js
 # See command help
 $ npx playwright screenshot --help
 ```
 
-```sh
+```sh python
+# See command help
+$ python -m playwright screenshot --help
+```
+
+```sh js
 # Wait 3 seconds before capturing a screenshot after page loads ('load' event fires)
-npx playwright \
+$ npx playwright \
   --device="iPhone 11" \
   --color-scheme=dark \
   screenshot \
@@ -145,19 +194,39 @@ npx playwright \
     twitter.com twitter-iphone.png
 ```
 
-```sh
+```sh python
+# Wait 3 seconds before capturing a screenshot after page loads ('load' event fires)
+$ python -m playwright \
+  --device="iPhone 11" \
+  --color-scheme=dark \
+  screenshot \
+    --wait-for-timeout=3000 \
+    twitter.com twitter-iphone.png
+```
+
+```sh js
 # Capture a full page screenshot
-npx playwright screenshot --full-page en.wikipedia.org wiki-full.png
+$ npx playwright screenshot --full-page en.wikipedia.org wiki-full.png
+```
+
+```sh python
+# Capture a full page screenshot
+$ python -m playwright screenshot --full-page en.wikipedia.org wiki-full.png
 ```
 
 ## Generate PDF
 
 PDF generation only works in Headless Chromium.
 
-```sh
+```sh js
 # See command help
 $ npx playwright pdf https://en.wikipedia.org/wiki/PDF wiki.pdf
 ```
 
+```sh python
+# See command help
+$ python -m playwright pdf https://en.wikipedia.org/wiki/PDF wiki.pdf
+```
+
 ## Known limitations
 Opening WebKit Web Inspector will disconnect Playwright from the browser. In such cases, code generation will stop.

docs/src/debug.md

@@ -85,7 +85,7 @@ chromium.launch(devtools=True)
 Set the `PWDEBUG` environment variable to run your scripts in debug mode. This
 configures the browser for debugging.
 
-```sh
+```sh js
 # Linux/macOS
 $ PWDEBUG=1 npm run test
 
@@ -94,6 +94,15 @@ $ set PWDEBUG=1
 $ npm run test
 ```
 
+```sh python
+# Linux/macOS
+$ PWDEBUG=1 pytest -s
+
+# Windows
+$ set PWDEBUG=1
+$ pytest -s
+```
+
 ### Defaults
 
 With PWDEBUG, the following defaults are configured for you:
@@ -132,7 +141,7 @@ This improves the debugging experience for JavaScript executions in the page con
 
 Playwright supports verbose logging with the `DEBUG` environment variable.
 
-```sh
+```sh js
 # Linux/macOS
 $ DEBUG=pw:api npm run test
 
@@ -140,3 +149,12 @@ $ DEBUG=pw:api npm run test
 $ set DEBUG=pw:api
 $ npm run test
 ```
+
+```sh python
+# Linux/macOS
+$ DEBUG=pw:api pytest -s
+
+# Windows
+$ set DEBUG=pw:api
+$ pytest -s
+```

docs/src/intro-python.md

@@ -10,8 +10,8 @@ title: "Getting Started"
 Use pip to install Playwright in your Python project. See [system requirements](#system-requirements).
 
 ```sh
-pip install playwright
-python -m playwright install
+$ pip install playwright
+$ python -m playwright install
 ```
 
 These commands download the Playwright package and install browser binaries for Chromium, Firefox and WebKit. To modify this behavior see [installation parameters](./installation.md).
@@ -74,7 +74,7 @@ firefox.launch(headless=False, slowMo=50)
 Command Line Interface [CLI](./cli.md) can be used to record user interactions and generate Python code.
 
 ```sh
-python -m playwright codegen wikipedia.org
+$ python -m playwright codegen wikipedia.org
 ```
 
 ## System requirements

docs/src/intro.md

@@ -10,7 +10,7 @@ title: "Getting Started"
 Use npm or Yarn to install Playwright in your Node.js project. See [system requirements](#system-requirements).
 
 ```sh
-npm i -D playwright
+$ npm i -D playwright
 ```
 
 This single command downloads the Playwright NPM package and browser binaries for Chromium, Firefox and WebKit. To modify this behavior see [installation parameters](./installation.md).
@@ -65,7 +65,7 @@ firefox.launch({ headless: false, slowMo: 50 });
 Command Line Interface [CLI](./cli.md) can be used to record user interactions and generate JavaScript code.
 
 ```sh
-npx playwright codegen wikipedia.org
+$ npx playwright codegen wikipedia.org
 ```
 
 ## TypeScript support

docs/src/test-runners-python.md

@@ -11,7 +11,7 @@ in Python.
 ## Usage
 
 ```sh
-pip install pytest-playwright
+$ pip install pytest-playwright
 ```
 
 Use the `page` fixture to write a basic test. See [more examples](#examples).
@@ -27,16 +27,16 @@ To run your tests, use pytest CLI.
 
 ```sh
 # Run tests (Chromium and headless by default)
-pytest
+$ pytest
 
 # Run tests in headful mode
-pytest --headful
+$ pytest --headful
 
 # Run tests in a different browser (chromium, firefox, webkit)
-pytest --browser firefox
+$ pytest --browser firefox
 
 # Run tests in multiple browsers
-pytest --browser chromium --browser webkit
+$ pytest --browser chromium --browser webkit
 ```
 
 If you want to add the CLI arguments automatically without specifying them, you can use the [pytest.ini](https://docs.pytest.org/en/stable/reference.html#ini-options-ref) file:
@@ -114,7 +114,7 @@ def test_visit_example(page):
 Start Pytest with the `base-url` argument.
 
 ```sh
-pytest --base-url http://localhost:8080
+$ pytest --base-url http://localhost:8080
 ```
 
 ```py

types/types.d.ts

@@ -1227,7 +1227,7 @@ export interface Page {
    * 
    * An example of overriding `Math.random` before the page loads:
    * 
-   * ```js
+   * ```js browser
    * // preload.js
    * Math.random = () => 42;
    * ```
@@ -4790,7 +4790,7 @@ export interface BrowserContext {
    * 
    * An example of overriding `Math.random` before the page loads:
    * 
-   * ```js
+   * ```js browser
    * // preload.js
    * Math.random = () => 42;
    * ```