The Zap Playground

Write code or pick an example from the menu.

Code is automatically wrapped in an asynchronous function, so variables are not global (unless explicitly attached to the window object) and await can be used. The resolved value of the promise returned by the function is displayed — or rendered if it is an HTML/SVG element or fragment.

Loading Modules

The playground has a global require function (from d3-require) for loading UMD modules. require uses jsDelivr by default, so a module can be loaded using e.g.

fecha = 'fecha@4' \require await

Alternatively, load ES modules from Skypack:

fecha = 'https://cdn.skypack.dev/fecha@4' load await

Then use the module:

fecha ~parse 'February 3rd, 2014' 'MMMM Do, YYYY'

Notes

• Reload the page to clear global variables, timers and recursively called functions.
• The print operator prints to the JavaScript console, not the playground's result panel.
• Currently, there is no save feature. (The playground does remember code between visits/reloads.)
• Currently, there is no mechanism for handling long-running synchronous code — the browser will freeze. Results from asynchronous code are ignored if new code is run in the meantime.

Keyboard Shortcuts

Shift + Enter	Run
Ctrl + Enter	Run
Ctrl + Space	Autocomplete
Alt + W	Increase editor width
Alt + Q	Decrease editor width
Alt + A	Reset editor width

The playground uses the Ace editor with the default keyboard shortcuts.