diff --git a/doc/api/wasi.md b/doc/api/wasi.md index ee0b321c6766cb..de0e4b8e8138b5 100644 --- a/doc/api/wasi.md +++ b/doc/api/wasi.md @@ -10,7 +10,7 @@ The WASI API provides an implementation of the [WebAssembly System Interface][] specification. WASI gives sandboxed WebAssembly applications access to the underlying operating system via a collection of POSIX-like functions. -```js +```js esm import fs from 'fs'; import { WASI } from 'wasi'; @@ -28,6 +28,26 @@ const instance = await WebAssembly.instantiate(wasm, importObject); wasi.start(instance); ``` +```js cjs +'use strict'; +const fs = require('fs'); +const { WASI } = require('wasi'); +const wasi = new WASI({ + args: process.argv, + env: process.env, + preopens: { + '/sandbox': '/some/real/path/that/wasm/can/access' + } +}); +const importObject = { wasi_snapshot_preview1: wasi.wasiImport }; + +(async () => { + const wasm = await WebAssembly.compile(fs.readFileSync('./demo.wasm')); + const instance = await WebAssembly.instantiate(wasm, importObject); + + wasi.start(instance); +})(); +``` To run the above example, create a new WebAssembly text format file named `demo.wat`: diff --git a/doc/api_assets/js-flavor-cjs.svg b/doc/api_assets/js-flavor-cjs.svg new file mode 100644 index 00000000000000..aa8bcc4a25f111 --- /dev/null +++ b/doc/api_assets/js-flavor-cjs.svg @@ -0,0 +1,5 @@ + + diff --git a/doc/api_assets/js-flavor-esm.svg b/doc/api_assets/js-flavor-esm.svg new file mode 100644 index 00000000000000..96e05c59fd70ef --- /dev/null +++ b/doc/api_assets/js-flavor-esm.svg @@ -0,0 +1,5 @@ + + diff --git a/doc/api_assets/style.css b/doc/api_assets/style.css index e1538d962e2545..c9f9d457e50a42 100644 --- a/doc/api_assets/style.css +++ b/doc/api_assets/style.css @@ -765,6 +765,33 @@ kbd { display: block; } +.js-flavor-selector { + appearance: none; + float: right; + background-image: url(./js-flavor-cjs.svg); + background-size: contain; + background-repeat: no-repeat; + width: 142px; + height: 20px; +} +.js-flavor-selector:checked { + background-image: url(./js-flavor-esm.svg); +} +.js-flavor-selector:not(:checked) ~ .esm, +.js-flavor-selector:checked ~ .cjs { + display: none; +} +.dark-mode .js-flavor-selector { + filter: invert(1); +} +@supports (aspect-ratio: 1 / 1) { + .js-flavor-selector { + height: 1.5em; + width: auto; + aspect-ratio: 2719 / 384; + } +} + @media print { html { height: auto; @@ -815,4 +842,24 @@ kbd { #apicontent { overflow: hidden; } + .js-flavor-selector { + display: none; + } + .js-flavor-selector + * { + margin-bottom: 2rem; + padding-bottom: 2rem; + border-bottom: 1px solid var(--color-text-primary); + } + .js-flavor-selector ~ * { + display: block !important; + background-position: top right; + background-size: 142px 20px; + background-repeat: no-repeat; + } + .js-flavor-selector ~ .cjs { + background-image: url(./js-flavor-cjs.svg); + } + .js-flavor-selector ~ .esm { + background-image: url(./js-flavor-esm.svg); + } } diff --git a/test/doctool/test-doctool-html.js b/test/doctool/test-doctool-html.js index 97d4f36d9e5bda..3129dcc5d75e79 100644 --- a/test/doctool/test-doctool-html.js +++ b/test/doctool/test-doctool-html.js @@ -129,7 +129,15 @@ const testData = [ { file: fixtures.path('document_with_special_heading.md'), html: '
` +
+ (getLanguage(node.lang || '') ?
+ highlight(node.lang, node.value) : node).value +
+ '
';
node.type = 'html';
- node.value = '' +
- `` +
- highlighted +
- '
';
+
+ if (isJSFlavorSnippet(node)) {
+ const previousNode = parent.children[index - 1] || {};
+ const nextNode = parent.children[index + 1] || {};
+
+ if (node.meta !== 'esm' && node.meta !== 'cjs') {
+ console.warn(
+ `Unknown JavaScript flavor in ${filename}` +
+ `:${node.position.start.line}:${node.position.start.column}`);
+ node.value = `${highlighted}`; + node.meta = null; + } else if (!isJSFlavorSnippet(previousNode) && + isJSFlavorSnippet(nextNode) && + nextNode.meta !== node.meta) { + node.value = highlighted; + } else if (isJSFlavorSnippet(previousNode)) { + node.value = '
' + + '' + + previousNode.value + + highlighted + + ''; + node.meta = null; + previousNode.value = ''; + previousNode.meta = null; + } else { + console.warn( + `Unused JavaScript flavored block in ${filename}` + + `:${node.position.start.line}:${node.position.start.column}`); + node.value = `
${highlighted}`; + node.meta = null; + } + } else { + node.value = `
${highlighted}`; + } } else if (node.type === 'html' && common.isYAMLBlock(node.value)) { node.value = parseYAML(node.value);