playwrong/.vscode/extensions/playwrong-syntax

PlayWrong Test Language Extension

A VSCode extension that provides syntax highlighting and real-time linting for PlayWrong test files (.test extension).

Features

Syntax Highlighting

• Commands: use, open, wait, click, scroll, fill, break, sleep, dump
• Parameters: element, name, id, class, href, type, childText, value
• Strings with environment variable support ($VARIABLE)
• Comments: //, #, /* */
• Numbers and HTML elements

Real-time Linting

• Errors: Invalid commands, syntax errors, missing parameters
• Warnings: Semantic issues, best practice violations
• Info: Helpful suggestions and environment variable usage

Commands

• PlayWrong: Lint PlayWrong Test File - Run linter on current file
• PlayWrong: Lint PlayWrong Test File (Strict) - Run linter with warnings as errors

Usage

1. Open any .test file in VSCode

2. The extension will automatically:

   • Apply syntax highlighting
   • Show real-time linting feedback in the Problems panel
   • Underline errors, warnings, and info messages in the editor

3. Right-click in a .test file to access linting commands from the context menu

Installation

This extension is automatically loaded when you open this workspace. The .test files will be automatically associated with the PlayWrong language.

Example

use "Chrome"
open "https://example.com"
wait element=button childText="Login"
click element=button childText="Login"
fill element=input type="email" value="user@example.com"
sleep 2000 "login processing"
dump "login_page"

Linting Rules

Errors

• Invalid commands
• Unclosed quotes
• Missing required parameters

Warnings

• Unknown HTML elements
• Generic element selectors
• Semantic misuse (e.g., click on input fields)

Info

• Environment variable usage
• Command placement suggestions
• Best practice tips