Web

A Web app runs in a Chrome session that Revyl streams to your browser, at a desktop or mobile-sized viewport. Revyl either serves a bundle built from your recipe or opens a preview deployment you already host. Web builds covers both in detail; this page sets up a project and shows recipes for Next.js and static Vite.

Set up with an agent

Paste one prompt and your coding agent does the rest.

Copy setup promptPreview prompt

Setup prompt

Copy

Set up Revyl for this Web app.

Read https://docs.revyl.com/frameworks/web.md and follow it. It's the current Revyl guide for this, so prefer it over anything you remember about Revyl.

Web is in alpha: if Revyl says Web isn't enabled for my organization, stop and tell me to email support@revyl.ai. If the app already deploys previews, register those URLs with `revyl build upload --platform web --url <url> --app <web-app-id>`; otherwise add a recipe so Revyl builds a bundle.

You're done when a Revyl Web session opens the app and you've given me its link.

Ask me before anything that needs my login or approval.

Set up the projectCopy Anchor Link

revyl init creates the project config but doesn't detect Web frameworks, package managers, or preview hosts, and it doesn't create a Web app. Create the app and add a profile yourself:

revyl init -y
revyl app create --name "My Web App" --platform web

build:
  profiles:
    preview:
      web:
        app_id: <web-app-id>

This app-ID-only profile is enough to register preview URLs and start sessions. To have Revyl build a bundle, add your own setup commands, build commands, and output directory, as in the examples below. A Web recipe can sit beside ios and android recipes in the same profile without changing mobile setup.

If your app already deploys previews, keep that deploy and register each preview's HTTPS URL after it succeeds:

revyl build upload --platform web --url "$PREVIEW_URL" --app <web-app-id>
revyl device start --platform web --app <web-app-id>

Next.jsCopy Anchor Link

This example assumes npm and output: "standalone" in your Next config; adapt the commands to your workspace and lockfile. It packages the standalone server, .next/static, and public (when present) into dist-revyl, and signs in through a test-only route:

build:
  profiles:
    preview:
      web:
        app_id: <web-app-id>
        setup_commands: [npm ci]
        build_commands:
          - npm run build
          - rm -rf dist-revyl && mkdir -p dist-revyl/.next
          - cp -RL .next/standalone/. dist-revyl/
          - cp -R .next/static dist-revyl/.next/static
          - if [ ! -d public ]; then exit 0; fi; cp -R public dist-revyl/public
        output_path: dist-revyl
        run:
          start: HOSTNAME=0.0.0.0 node server.js
          port: 3000
          secret_names: [REVYL_SIGN_IN_SECRET]
session:
  auth_bypass:
    sign_in:
      path: /revyl-login
      secret: REVYL_SIGN_IN_SECRET

The server must listen on 0.0.0.0 at the configured port. REVYL_SIGN_IN_SECRET is the name of an encrypted organization launch variable, never its value.

Add the /revyl-login route only to test deployments, and have it issue a session the way your app normally does. In the App Router, use app/revyl-login/route.ts (or src/app/...). Folders that start with an underscore, such as app/__e2e__/login, are private and don't become routes. Keep the secret out of NEXT_PUBLIC_* variables and browser code. The code the route must verify is described in Web sign-in links.

Static ViteCopy Anchor Link

For an npm site whose build writes dist/index.html:

build:
  profiles:
    preview:
      web:
        app_id: <web-app-id>
        setup_commands: [npm ci]
        build_commands: [npm run build]
        output_path: dist

No run block is needed: Revyl serves static output, and client-side routes load on reload or deep link. Don't add a signing secret to a static frontend. If the site needs sign-in, add the test-only route to its backend or use a hosted preview.

Build and open a sessionCopy Anchor Link

revyl build --profile preview --platform web
revyl device start --platform web

revyl build runs on Revyl's build runners by default; add --local to build with your own toolchain and upload the result. Check a screenshot and the signed-in account, then stop the session with revyl device stop --session-id <session-id>.

Web starts don't run session.before_script. If a session needs test data, seed it before you start, for example from the preview's own deploy.

Next stepsCopy Anchor Link

• Web builds: bundle limits, server apps, and registering previews from CI
• Sessions: start a Web session from the dashboard
• Proof of changes: have an agent exercise each pull request in a Web session