Spaces:

WaveCut
/

Bonsai-Chat-WebGPU

Running

File size: 10,215 Bytes

import { chromium } from '@playwright/test';
import { createServer as createHttpServer } from 'node:http';
import { dirname, resolve } from 'node:path';
import { fileURLToPath } from 'node:url';
import { createServer as createViteServer } from 'vite';

const root = resolve(dirname(fileURLToPath(import.meta.url)), '..');
const probeHits = [];

function listen(server) {
  return new Promise((resolveListen, reject) => {
    server.once('error', reject);
    server.listen(0, '127.0.0.1', () => {
      server.off('error', reject);
      const address = server.address();
      if (!address || typeof address === 'string') {
        reject(new Error('Local probe did not expose a TCP port'));
        return;
      }
      resolveListen(address.port);
    });
  });
}

function close(server) {
  return new Promise((resolveClose, reject) => {
    server.close((error) => error ? reject(error) : resolveClose());
  });
}

const probe = createHttpServer((request, response) => {
  probeHits.push(request.url ?? '/');
  response.writeHead(204, { 'Access-Control-Allow-Origin': '*' });
  response.end();
});

let browser;
let vite;
try {
  const probePort = await listen(probe);
  const probeBaseUrl = `http://127.0.0.1:${probePort}`;

  vite = await createViteServer({
    root,
    logLevel: 'error',
    server: { host: '127.0.0.1', port: 0 },
    plugins: [{
      name: 'artifact-csp-probe-page',
      configureServer(server) {
        server.middlewares.use('/artifact-csp-probe.html', (_request, response) => {
          response.setHeader('Content-Type', 'text/html; charset=utf-8');
          response.end('<!doctype html><title>Artifact CSP probe</title>');
        });
      },
    }],
  });
  await vite.listen();
  const viteAddress = vite.httpServer?.address();
  if (!viteAddress || typeof viteAddress === 'string') throw new Error('Vite probe page did not expose a TCP port');

  const controlResponse = await fetch(`${probeBaseUrl}/control`);
  if (!controlResponse.ok || probeHits.length !== 1) throw new Error('Local probe control request failed');
  probeHits.length = 0;

  browser = await chromium.launch({ headless: true });
  const page = await browser.newPage();
  await page.goto(`http://127.0.0.1:${viteAddress.port}/artifact-csp-probe.html`);

  const payloads = [
    { id: 'comment-head', html: `<!-- <head> --><img src="${probeBaseUrl}/probe/comment-head">`, rejected: false },
    { id: 'before-head', html: `<img src="${probeBaseUrl}/probe/before-head"><head><title>late head</title></head>`, rejected: false },
    { id: 'inline-script', html: `<script>location.href=${JSON.stringify(`${probeBaseUrl}/probe/inline-script`)}</script>`, rejected: true },
    { id: 'meta-refresh', html: `<meta http-equiv="refresh" content="0;url=${probeBaseUrl}/probe/meta-refresh">`, rejected: true },
  ];
  for (const payload of payloads) {
    await page.evaluate(async ({ artifactId, sourceHtml, shouldReject }) => {
      const { configureArtifactIframe, prepareHtmlArtifact } = await import('/src/lib/artifact-runtime.ts');
      let artifact;
      try {
        artifact = prepareHtmlArtifact(sourceHtml, 'CSP probe', artifactId);
      } catch (error) {
        if (shouldReject) return;
        throw error;
      }
      if (shouldReject) throw new Error(`${artifactId} was expected to be rejected`);
      const iframe = document.createElement('iframe');
      iframe.dataset.artifactId = artifactId;
      configureArtifactIframe(iframe);
      await new Promise((resolveLoad) => {
        iframe.addEventListener('load', resolveLoad, { once: true });
        iframe.srcdoc = artifact.sandboxedSource;
        document.body.append(iframe);
      });
    }, { artifactId: payload.id, sourceHtml: payload.html, shouldReject: payload.rejected });
  }

  const passingEvaluation = await page.evaluate(async ({ blockedUrl }) => {
    const { evaluateHtmlArtifact, prepareHtmlArtifact } = await import('/src/lib/artifact-runtime.ts');
    const artifact = prepareHtmlArtifact(
      `<!doctype html><html><head><title>Live artifact</title><style>#output{color:rgb(17, 34, 51);background:rgb(238, 244, 240)}</style></head><body><section id="output">Waiting</section><script>
        document.querySelector('#output').textContent = 'JavaScript artifact rendered';
        console.log('artifact booted', { ready: true });
        try { localStorage.setItem('forbidden', '1'); } catch (error) { console.warn('storage blocked', error.name); }
        fetch(${JSON.stringify(blockedUrl)}).catch(() => console.warn('fetch blocked'));
      </script></body></html>`,
      'Live artifact probe',
      'live-evaluation',
    );
    return evaluateHtmlArtifact(artifact);
  }, { blockedUrl: `${probeBaseUrl}/probe/fetch` });
  if (passingEvaluation.status !== 'passed') {
    throw new Error(`Passing artifact reported failure: ${JSON.stringify(passingEvaluation)}`);
  }
  if (!passingEvaluation.entries.some((entry) => entry.message.includes('artifact booted'))
    || !passingEvaluation.entries.some((entry) => entry.message.includes('storage blocked'))
    || passingEvaluation.dom?.textPreview !== 'JavaScript artifact rendered') {
    throw new Error(`Passing artifact diagnostics were incomplete: ${JSON.stringify(passingEvaluation)}`);
  }

  const failingEvaluation = await page.evaluate(async () => {
    const { evaluateHtmlArtifact, prepareHtmlArtifact } = await import('/src/lib/artifact-runtime.ts');
    const artifact = prepareHtmlArtifact(
      '<main>Broken artifact</main><script>console.error("deliberate runtime failure"); Promise.reject(new Error("async failure"));</script>',
      'Failure probe',
      'failure-evaluation',
    );
    return evaluateHtmlArtifact(artifact);
  });
  if (failingEvaluation.status !== 'failed'
    || !failingEvaluation.entries.some((entry) => entry.level === 'error' && entry.message.includes('deliberate runtime failure'))
    || !failingEvaluation.entries.some((entry) => entry.level === 'error' && entry.message.includes('async failure'))) {
    throw new Error(`Runtime errors were not returned: ${JSON.stringify(failingEvaluation)}`);
  }

  const lifecycle = await page.evaluate(async () => {
    const { executeAgentTool } = await import('/src/lib/agent-tools.ts');
    const context = { artifacts: new Map() };
    const create = await executeAgentTool({
      id: 'stable-tool-artifact',
      type: 'function',
      function: {
        name: 'html_artifact',
        arguments: JSON.stringify({
          title: 'Repair lifecycle',
          html: '<main>Broken</main><script>console.error("repair me")</script>',
        }),
      },
    }, undefined, context);
    const update = await executeAgentTool({
      id: 'repair-call',
      type: 'function',
      function: {
        name: 'artifact_update',
        arguments: JSON.stringify({
          artifact_id: 'stable-tool-artifact',
          html: '<main id="fixed">Fixed</main><script>document.querySelector("#fixed").dataset.ready="1"</script>',
        }),
      },
    }, undefined, context);
    const retest = await executeAgentTool({
      id: 'retest-call',
      type: 'function',
      function: {
        name: 'artifact_test',
        arguments: JSON.stringify({ artifact_id: 'stable-tool-artifact' }),
      },
    }, undefined, context);
    const inspect = await executeAgentTool({
      id: 'inspect-call',
      type: 'function',
      function: {
        name: 'artifact_inspect',
        arguments: JSON.stringify({ artifact_id: 'stable-tool-artifact', include_source: true }),
      },
    }, undefined, context);
    return {
      create: JSON.parse(create.output),
      update: JSON.parse(update.output),
      retest: JSON.parse(retest.output),
      inspect: JSON.parse(inspect.output),
      stableId: update.artifact?.id,
      artifactCount: context.artifacts.size,
    };
  });
  if (lifecycle.create.evaluation.status !== 'failed'
    || lifecycle.update.evaluation.status !== 'passed'
    || lifecycle.retest.evaluation.status !== 'passed'
    || lifecycle.inspect.artifact.evaluation.status !== 'passed'
    || !lifecycle.inspect.artifact.source.includes('dataset.ready')
    || lifecycle.stableId !== 'stable-tool-artifact'
    || lifecycle.artifactCount !== 1) {
    throw new Error(`Artifact repair lifecycle failed: ${JSON.stringify(lifecycle)}`);
  }

  await page.evaluate(async () => {
    const { configureArtifactIframe, prepareHtmlArtifact } = await import('/src/lib/artifact-runtime.ts');
    const artifact = prepareHtmlArtifact(
      '<style>#static-card{color:rgb(17, 34, 51);background:rgb(238, 244, 240)}</style><section id="static-card">Waiting</section><script>document.querySelector("#static-card").textContent="JavaScript artifact rendered"</script>',
      'Rendered probe',
      'static-render',
    );
    const iframe = document.createElement('iframe');
    iframe.dataset.artifactId = artifact.id;
    configureArtifactIframe(iframe);
    await new Promise((resolveLoad) => {
      iframe.addEventListener('load', resolveLoad, { once: true });
      iframe.srcdoc = artifact.sandboxedSource;
      document.body.append(iframe);
    });
  });

  await new Promise((resolveWait) => setTimeout(resolveWait, 400));
  if (probeHits.length > 0) {
    throw new Error(`Artifact CSP leaked ${probeHits.length} request(s): ${probeHits.join(', ')}`);
  }
  const staticCard = page.frameLocator('iframe[data-artifact-id="static-render"]').locator('#static-card');
  await staticCard.waitFor();
  const staticRender = await staticCard.evaluate((element) => ({
    text: element.textContent,
    color: getComputedStyle(element).color,
    background: getComputedStyle(element).backgroundColor,
  }));
  if (staticRender.text !== 'JavaScript artifact rendered'
    || staticRender.color !== 'rgb(17, 34, 51)'
    || staticRender.background !== 'rgb(238, 244, 240)') {
    throw new Error(`Static HTML/CSS render failed: ${JSON.stringify(staticRender)}`);
  }
  console.log(`artifact runtime probe passed: ${payloads.length} network bypasses emitted 0 requests; inline JS rendered; console errors returned; stable-ID repair and retest passed`);
} finally {
  await browser?.close();
  await vite?.close();
  await close(probe);
}