Skip to content

Commit 3ccc3f0

Browse files
Add top-level await support documentation
Document JavaScript top-level await feature that allows developers to write async code without IIFE wrappers. Include examples of automatic expression return behavior and state persistence across executions. Related PR: cloudflare/sandbox-sdk#261 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
1 parent 472918f commit 3ccc3f0

File tree

1 file changed

+55
-1
lines changed

1 file changed

+55
-1
lines changed

src/content/docs/sandbox/api/interpreter.mdx

Lines changed: 55 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,45 @@ import { TypeScriptExample } from "~/components";
99

1010
Execute Python, JavaScript, and TypeScript code with support for data visualizations, tables, and rich output formats. Contexts maintain state (variables, imports, functions) across executions.
1111

12-
JavaScript contexts support top-level `await` - no need to wrap async code in IIFE. The last expression is automatically returned as the result.
12+
## JavaScript top-level await support
13+
14+
JavaScript execution supports top-level `await` without requiring an async IIFE wrapper. The code interpreter automatically transforms your code to enable async operations and returns the value of the last expression.
15+
16+
<TypeScriptExample>
17+
```
18+
// No wrapper needed - just write async code directly
19+
const ctx = await sandbox.createCodeContext({ language: 'javascript' });
20+
21+
const result = await sandbox.runCode(`
22+
const response = await fetch('https://api.example.com/data');
23+
const data = await response.json();
24+
data.value
25+
`, { context: ctx });
26+
27+
console.log(result.results[0].text); // Returns data.value
28+
```
29+
</TypeScriptExample>
30+
31+
**Key features:**
32+
- **No IIFE wrapper**: Write `await` statements directly at the top level
33+
- **Auto-return**: The last expression is automatically returned (REPL-style behavior)
34+
- **State persistence**: Variables and functions persist across executions in the same context
35+
36+
<TypeScriptExample>
37+
```
38+
const ctx = await sandbox.createCodeContext({ language: 'javascript' });
39+
40+
// First execution sets up data
41+
await sandbox.runCode(`
42+
const result = await Promise.resolve(42);
43+
const doubled = result * 2;
44+
`, { context: ctx });
45+
46+
// Second execution accesses previous variables and returns the expression
47+
const output = await sandbox.runCode(`doubled`, { context: ctx });
48+
console.log(output.results[0].text); // "84"
49+
```
50+
</TypeScriptExample>
1351

1452
## Methods
1553

@@ -113,6 +151,8 @@ console.log(result.results[0]); // Last expression is automatically returned
113151
:::note[Default context behavior]
114152
If no `context` is provided, a default context is automatically created/reused for the specified `language`. While convenient for quick tests, **explicitly creating contexts is recommended** for production use to maintain predictable state.
115153

154+
**Python example**:
155+
116156
<TypeScriptExample>
117157
```
118158
const result = await sandbox.runCode(`
@@ -122,6 +162,20 @@ sum(data)
122162
`, { language: 'python' });
123163
124164
console.log(result.logs.stdout); // ["Sum: 15"]
165+
console.log(result.results[0].text); // "15"
166+
```
167+
</TypeScriptExample>
168+
169+
**JavaScript example with top-level await**:
170+
171+
<TypeScriptExample>
172+
```
173+
const result = await sandbox.runCode(`
174+
const numbers = [1, 2, 3, 4, 5];
175+
const sum = numbers.reduce((a, b) => a + b, 0);
176+
await Promise.resolve(sum)
177+
`, { language: 'javascript' });
178+
125179
console.log(result.results[0].text); // "15"
126180
```
127181
</TypeScriptExample>

0 commit comments

Comments
 (0)