Skip to content

static snapshots

Marcos Cáceres edited this page May 10, 2021 · 17 revisions

Creating Static Snapshots

From browser

Open the ReSpec UI and select "Export..."

Screen shot of ReSpec UI

Select the format to export as.

Screen Shot of export options

Using command line

One off...

npx respec --src source.html --out index.html

Or, to install ReSpec for repeated use:

respec --src source.html --out index.html

then:

npm install --global respec
``

For more options, run `respec --help`.

Description Converts a ReSpec source file to HTML and writes to destination.

Usage $ respec [source] [destination] [options]

Options -s, --src URL to ReSpec source file. -o, --out Path to output file. -t, --timeout How long to wait before timing out (in seconds). (default 10) --use-local Use locally installed ReSpec instead of the one in document. (default false) -e, --haltonerror Abort if the spec has any errors. (default false) -w, --haltonwarn Abort if ReSpec generates warnings. (default false) --disable-sandbox Disable Chromium sandboxing if needed. (default false) --devtools Enable debugging and show Chrome's DevTools. (default false) --verbose Log processing status to stdout. (default false) --localhost Spin up a local server to perform processing. (default false) --port Port override for --localhost. (default 3000) -v, --version Displays current version -h, --help Displays this message


<aside class="note">
If you already have Chrome installed on your computer, you can speed up the process by not installing a new copy of Chrome on each install. To do so, add following two environment variables before installing or running above steps:

```bash
export PUPPETEER_SKIP_CHROMIUM_DOWNLOAD=1
export PUPPETEER_EXECUTABLE_PATH="/usr/bin/google-chrome"
# replace "/usr/bin/google-chrome" with path to Chrome executable on your system.
# On MacOS, it's generally:
# "/Applications/Google Chrome.app/Contents/MacOS/Google chrome"

Guides

Configuration options

W3C Configuration options

Linter rules

Internal properties

Handled by ReSpec for you.

Special <section> IDs

HTML elements

Custom Elements

WebIDL

HTML attributes

CSS Classes

Special properties

Clone this wiki locally