Runs the result page after any required compilation of code.
This method triggers the compilation and execution of all code in the playground (markup, style, and script editors) and displays the output in the result page.
Signature
playground.run(): Promise<void>
Parameters
None.
Returns
A promise that resolves when the code has been executed and the result page is displayed.
Usage
Basic Usage
import { createPlayground } from "livecodes";
const playground = await createPlayground("#container", {
config: {
markup: {
language: "html",
content: "<h1>Hello, World!</h1>",
},
script: {
language: "javascript",
content: "console.log('Running...');",
},
},
});
// Manually trigger code execution
await playground.run();
// Result page is now displayed with the output
Run After Code Changes
import { createPlayground } from "livecodes";
const playground = await createPlayground("#container", {
config: {
autoupdate: false, // Disable auto-run
},
});
// Load new code
await playground.setConfig({
markup: {
language: "html",
content: "<h1>Updated Content</h1>",
},
});
// Manually run the updated code
await playground.run();
Notes
- This method is particularly useful when
autoupdate is set to false in the configuration.
- The method waits for any necessary compilation to complete before displaying results.
- If the playground is not yet loaded, calling this method will load it first.
setConfig() - Load new configuration before runninggetCode() - Get the current code and compiled outputwatch() - Watch for code changes and other events