Shortcut: Ctrl+Enter
Getting Started
This is the Pas2JS online Pascal compiler. Write Pascal code in the editor on the left and see compiler output on the right. Click Compile to compile your code, or Run to compile and execute it immediately.
Toolbar
The toolbar at the top of the page provides quick access to all major actions.
Examples
The Examples dropdown loads sample programs into the editor. Selecting an example replaces the current code. If you have unsaved changes you will be asked to confirm before the code is replaced.
A custom set of examples can be loaded via the
?examples=URL query parameter. See the
Embed Guide
for details.
Compile
Compiles your Pascal source to JavaScript. Compiler messages (errors, warnings, hints) appear in the console panel on the right.
Run
Compiles and then immediately runs the program. The output is shown in the Run tab inside an iframe.
Shortcut: Ctrl+Shift+Enter
Format
Auto-formats the Pascal source code in the editor.
Shortcut: Ctrl+Shift+F
Download
The Download dropdown offers two options: download the
Pascal source as a .pas file, or the compiled JavaScript as a
.js file.
Reset
Resets the editor to the initial program. A confirmation dialog appears to prevent accidental loss of your work. In assignment mode, Reset also clears all revealed hints and validation results.
Share
Encodes your current code into a shareable URL and copies it to the clipboard. Anyone who opens the link will see your code in the editor.
Note: Share does not preserve assignment context — it only shares the code itself.
Dark Mode
Toggles between light and dark themes. The button shows ☽ (moon) in light mode and ☀ (sun) in dark mode. Your preference is saved across sessions.
Editor
The code editor uses the Ace editor with Pascal syntax highlighting. It automatically switches between a light theme and a dark theme to match your dark mode setting.
Standard editor features are available: Ctrl+F to find, Ctrl+H to find and replace, Ctrl+Z to undo, Ctrl+Shift+Z to redo.
Console Output
The right panel shows compiler messages after compilation. Use the filter buttons to toggle visibility of different message types:
- Errors (red) — compilation errors
- Warnings (yellow) — compiler warnings
- Hints (blue) — compiler hints
- Info (blue) — informational messages
Click Copy All to copy the entire console output to the clipboard.
Run View
The Run tab shows the output of your compiled program running inside an iframe. Click the ← Editor button or the Editor tab to return to the code editor.
Sidebar Panels
Click the icons on the left strip to open sidebar panels. Click the same icon again to close it. Only one panel can be open at a time.
Preloaded Units 📚
Lists the RTL (Run-Time Library) units that are pre-loaded at startup and
available for use in your uses clauses. These include
commonly needed units such as SysUtils, Classes,
JS, Web, and Math.
User Units 📄
Upload your own .pas, .pp, or .inc
files by dragging them into the upload zone or clicking Browse.
Uploaded units become available in uses clauses, letting you
split your code across multiple files.
Settings ⚙
JIT syntax checking — enable this to get live error checking as you type. The compiler runs automatically in the background after you stop typing.
The debounce delay controls how long (in seconds) after your last keystroke before the check runs. The minimum is 3 seconds.
Snippets ✍
The Snippets panel lets you browse and insert code templates. Use the ☰ button to toggle between grouped (by category) and flat (alphabetical) views. Click any snippet to insert it at the current cursor position. The cursor is automatically positioned inside the inserted code where you are most likely to type next.
Custom Snippet Manifests
Teachers and embedders can provide a custom set of snippets by using
the ?snippets=URL query parameter or the
p2js_configure postMessage API. See the
Embed Guide
for details.
Ctrl+J Picker
For faster insertion, type a snippet trigger name (or prefix) in the editor and press Ctrl+J (Cmd+J on Mac). If exactly one snippet matches, it inserts immediately. If multiple snippets match, a popup picker appears near the cursor — click one to insert it, or press Escape to dismiss.
Available Snippets
| Trigger | Category | Description |
|---|---|---|
be | Control Flow | Begin/end block |
for | Control Flow | For loop with counter |
while | Control Flow | While loop |
repeat | Control Flow | Repeat-until loop |
ifthen | Control Flow | If-then-else block |
case | Control Flow | Case statement |
proc | Control Flow | Procedure skeleton |
func | Control Flow | Function skeleton |
writeln | Console I/O | WriteLn to console |
readln | Console I/O | ReadLn from browser prompt |
button | DOM / Web | Create a button element |
div | DOM / Web | Create a div element |
input | DOM / Web | Create an input element |
getelid | DOM / Web | document.getElementById |
onclick | Events | addEventListener click handler |
onchange | Events | addEventListener change handler |
timer | Events | window.setInterval timer |
array | Data Structures | Dynamic array declaration |
record | Data Structures | Record type declaration |
class | Data Structures | Class skeleton with constructor |
Assignments
When you open an assignment link provided by your instructor, a panel appears above the editor with the assignment instructions. Starter code is loaded into the editor automatically.
Assignment Panel
The assignment panel shows the title and a description of what you need to accomplish. Read the instructions carefully before you start coding. The starter code in the editor gives you a starting point.
Hints
If you get stuck, click the Need a hint? button to reveal a hint. Hints are revealed one at a time — each click shows the next hint. The button also shows how many hints remain.
- Text hints appear in yellow boxes with guidance on how to proceed.
- Solution hints appear in green boxes and include a Load Solution button that replaces the editor content with a working solution.
Use the ◀ and ▶ arrow buttons to navigate between hints you have already revealed. The counter shows which hint you are viewing (e.g. "Hint 1 of 2").
Automatic Validation
After you run your program, the system automatically checks your output against the assignment's expected results.
- A green notification with "All checks passed!" means your solution is correct.
- A red notification shows which checks failed, with specific messages explaining what was expected.
You can dismiss the results and keep iterating on your solution.
Reset in Assignments
The Reset button restores the original starter code and clears all revealed hints and validation results, giving you a fresh start.
Keyboard Shortcuts
On Mac, use Cmd instead of Ctrl for most shortcuts.
| Shortcut | Action |
|---|---|
| Ctrl+Enter | Compile |
| Ctrl+Shift+Enter | Compile & Run |
| Ctrl+Shift+F | Format code |
| Ctrl+J | Open snippet picker |
| Ctrl+F | Find in editor |
| Ctrl+H | Find and replace |
| Ctrl+Z | Undo |
| Ctrl+Shift+Z | Redo |
| Escape | Dismiss snippet picker |