275 lines
8.7 KiB
JavaScript
275 lines
8.7 KiB
JavaScript
// @ts-check
|
|
/**
|
|
* Nexus Smoke Tests — Zero LLM, pure headless browser.
|
|
*
|
|
* Tests that the 3D world renders, modules load, and basic interaction works.
|
|
* Run: npx playwright test tests/smoke.spec.js
|
|
* Requires: a local server serving the nexus (e.g., python3 -m http.server 8888)
|
|
*/
|
|
|
|
const { test, expect } = require('@playwright/test');
|
|
|
|
const BASE_URL = process.env.NEXUS_URL || 'http://localhost:8888';
|
|
|
|
// --- RENDERING TESTS ---
|
|
|
|
test.describe('World Renders', () => {
|
|
|
|
test('index.html loads without errors', async ({ page }) => {
|
|
const errors = [];
|
|
page.on('pageerror', err => errors.push(err.message));
|
|
|
|
const response = await page.goto(BASE_URL, { waitUntil: 'domcontentloaded' });
|
|
expect(response.status()).toBe(200);
|
|
|
|
// Give Three.js a moment to initialize
|
|
await page.waitForTimeout(2000);
|
|
|
|
// No fatal JS errors
|
|
const fatalErrors = errors.filter(e =>
|
|
!e.includes('ambient.mp3') && // missing audio file is OK
|
|
!e.includes('favicon') &&
|
|
!e.includes('serviceWorker')
|
|
);
|
|
expect(fatalErrors).toEqual([]);
|
|
});
|
|
|
|
test('canvas element exists (Three.js rendered)', async ({ page }) => {
|
|
await page.goto(BASE_URL, { waitUntil: 'domcontentloaded' });
|
|
await page.waitForTimeout(3000);
|
|
|
|
// Three.js creates a <canvas> element
|
|
const canvas = await page.locator('canvas');
|
|
await expect(canvas).toBeVisible();
|
|
|
|
// Canvas should have non-zero dimensions
|
|
const box = await canvas.boundingBox();
|
|
expect(box.width).toBeGreaterThan(100);
|
|
expect(box.height).toBeGreaterThan(100);
|
|
});
|
|
|
|
test('canvas is not all black (scene has content)', async ({ page }) => {
|
|
await page.goto(BASE_URL, { waitUntil: 'domcontentloaded' });
|
|
await page.waitForTimeout(4000);
|
|
|
|
// Sample pixels from the canvas
|
|
const hasContent = await page.evaluate(() => {
|
|
const canvas = document.querySelector('canvas');
|
|
if (!canvas) return false;
|
|
const ctx = canvas.getContext('webgl2') || canvas.getContext('webgl');
|
|
if (!ctx) return false;
|
|
|
|
// Read a block of pixels from center
|
|
const w = canvas.width;
|
|
const h = canvas.height;
|
|
const pixels = new Uint8Array(4 * 100);
|
|
ctx.readPixels(
|
|
Math.floor(w / 2) - 5, Math.floor(h / 2) - 5,
|
|
10, 10, ctx.RGBA, ctx.UNSIGNED_BYTE, pixels
|
|
);
|
|
|
|
// Check if at least some pixels are non-black
|
|
let nonBlack = 0;
|
|
for (let i = 0; i < pixels.length; i += 4) {
|
|
if (pixels[i] > 5 || pixels[i + 1] > 5 || pixels[i + 2] > 5) {
|
|
nonBlack++;
|
|
}
|
|
}
|
|
return nonBlack > 5; // At least 5 non-black pixels in the sample
|
|
});
|
|
|
|
expect(hasContent).toBe(true);
|
|
});
|
|
|
|
test('WebGL context is healthy', async ({ page }) => {
|
|
await page.goto(BASE_URL, { waitUntil: 'domcontentloaded' });
|
|
await page.waitForTimeout(2000);
|
|
|
|
const glInfo = await page.evaluate(() => {
|
|
const canvas = document.querySelector('canvas');
|
|
if (!canvas) return { error: 'no canvas' };
|
|
const gl = canvas.getContext('webgl2') || canvas.getContext('webgl');
|
|
if (!gl) return { error: 'no webgl context' };
|
|
return {
|
|
renderer: gl.getParameter(gl.RENDERER),
|
|
vendor: gl.getParameter(gl.VENDOR),
|
|
isLost: gl.isContextLost(),
|
|
};
|
|
});
|
|
|
|
expect(glInfo.error).toBeUndefined();
|
|
expect(glInfo.isLost).toBe(false);
|
|
});
|
|
});
|
|
|
|
// --- MODULE LOADING TESTS ---
|
|
|
|
test.describe('Modules Load', () => {
|
|
|
|
test('all ES modules resolve (no import errors)', async ({ page }) => {
|
|
const moduleErrors = [];
|
|
page.on('pageerror', err => {
|
|
if (err.message.includes('import') || err.message.includes('module') ||
|
|
err.message.includes('export') || err.message.includes('Cannot find')) {
|
|
moduleErrors.push(err.message);
|
|
}
|
|
});
|
|
|
|
await page.goto(BASE_URL, { waitUntil: 'domcontentloaded' });
|
|
await page.waitForTimeout(3000);
|
|
|
|
expect(moduleErrors).toEqual([]);
|
|
});
|
|
|
|
test('Three.js loaded from CDN', async ({ page }) => {
|
|
await page.goto(BASE_URL, { waitUntil: 'domcontentloaded' });
|
|
await page.waitForTimeout(2000);
|
|
|
|
const hasThree = await page.evaluate(() => {
|
|
// Check if THREE is accessible (it's imported as ES module, so check via scene)
|
|
const canvas = document.querySelector('canvas');
|
|
return !!canvas;
|
|
});
|
|
|
|
expect(hasThree).toBe(true);
|
|
});
|
|
});
|
|
|
|
// --- HUD ELEMENTS ---
|
|
|
|
test.describe('HUD Elements', () => {
|
|
|
|
test('block height display exists', async ({ page }) => {
|
|
await page.goto(BASE_URL, { waitUntil: 'domcontentloaded' });
|
|
const blockDisplay = page.locator('#block-height-display');
|
|
await expect(blockDisplay).toBeAttached();
|
|
});
|
|
|
|
test('weather HUD exists', async ({ page }) => {
|
|
await page.goto(BASE_URL, { waitUntil: 'domcontentloaded' });
|
|
const weather = page.locator('#weather-hud');
|
|
await expect(weather).toBeAttached();
|
|
});
|
|
|
|
test('audio toggle exists', async ({ page }) => {
|
|
await page.goto(BASE_URL, { waitUntil: 'domcontentloaded' });
|
|
const btn = page.locator('#audio-toggle');
|
|
await expect(btn).toBeAttached();
|
|
});
|
|
|
|
test('sovereignty message exists', async ({ page }) => {
|
|
await page.goto(BASE_URL, { waitUntil: 'domcontentloaded' });
|
|
const msg = page.locator('#sovereignty-msg');
|
|
await expect(msg).toBeAttached();
|
|
});
|
|
|
|
test('oath overlay exists', async ({ page }) => {
|
|
await page.goto(BASE_URL, { waitUntil: 'domcontentloaded' });
|
|
const oath = page.locator('#oath-overlay');
|
|
await expect(oath).toBeAttached();
|
|
});
|
|
});
|
|
|
|
// --- INTERACTION TESTS ---
|
|
|
|
test.describe('Interactions', () => {
|
|
|
|
test('mouse movement updates camera (parallax)', async ({ page }) => {
|
|
await page.goto(BASE_URL, { waitUntil: 'domcontentloaded' });
|
|
await page.waitForTimeout(3000);
|
|
|
|
// Get initial canvas snapshot
|
|
const canvas = page.locator('canvas');
|
|
const box = await canvas.boundingBox();
|
|
|
|
// Take screenshot before mouse move
|
|
const before = await page.screenshot({ clip: { x: box.x, y: box.y, width: 100, height: 100 } });
|
|
|
|
// Move mouse significantly
|
|
await page.mouse.move(box.x + box.width * 0.8, box.y + box.height * 0.2);
|
|
await page.waitForTimeout(1500);
|
|
|
|
// Take screenshot after
|
|
const after = await page.screenshot({ clip: { x: box.x, y: box.y, width: 100, height: 100 } });
|
|
|
|
// Screenshots should differ (camera moved)
|
|
expect(Buffer.compare(before, after)).not.toBe(0);
|
|
});
|
|
|
|
test('Tab key toggles overview mode', async ({ page }) => {
|
|
await page.goto(BASE_URL, { waitUntil: 'domcontentloaded' });
|
|
await page.waitForTimeout(3000);
|
|
|
|
// Press Tab for overview
|
|
await page.keyboard.press('Tab');
|
|
await page.waitForTimeout(1000);
|
|
|
|
// Overview indicator should be visible
|
|
const indicator = page.locator('#overview-indicator');
|
|
// It should have some visibility (either display or opacity)
|
|
const isVisible = await indicator.evaluate(el => {
|
|
const style = window.getComputedStyle(el);
|
|
return style.display !== 'none' && parseFloat(style.opacity) > 0;
|
|
});
|
|
|
|
// Press Tab again to exit
|
|
await page.keyboard.press('Tab');
|
|
|
|
expect(isVisible).toBe(true);
|
|
});
|
|
|
|
test('animation loop is running (requestAnimationFrame)', async ({ page }) => {
|
|
await page.goto(BASE_URL, { waitUntil: 'domcontentloaded' });
|
|
await page.waitForTimeout(2000);
|
|
|
|
// Check that frames are being rendered by watching a timestamp
|
|
const frameCount = await page.evaluate(() => {
|
|
return new Promise(resolve => {
|
|
let count = 0;
|
|
const start = performance.now();
|
|
function tick() {
|
|
count++;
|
|
if (performance.now() - start > 500) {
|
|
resolve(count);
|
|
} else {
|
|
requestAnimationFrame(tick);
|
|
}
|
|
}
|
|
requestAnimationFrame(tick);
|
|
});
|
|
});
|
|
|
|
// Should get at least 10 frames in 500ms (20+ FPS)
|
|
expect(frameCount).toBeGreaterThan(10);
|
|
});
|
|
});
|
|
|
|
// --- DATA / API TESTS ---
|
|
|
|
test.describe('Data Loading', () => {
|
|
|
|
test('portals.json loads', async ({ page }) => {
|
|
const response = await page.goto(`${BASE_URL}/portals.json`);
|
|
expect(response.status()).toBe(200);
|
|
const data = await response.json();
|
|
expect(Array.isArray(data) || typeof data === 'object').toBe(true);
|
|
});
|
|
|
|
test('sovereignty-status.json loads', async ({ page }) => {
|
|
const response = await page.goto(`${BASE_URL}/sovereignty-status.json`);
|
|
expect(response.status()).toBe(200);
|
|
});
|
|
|
|
test('style.css loads', async ({ page }) => {
|
|
const response = await page.goto(`${BASE_URL}/style.css`);
|
|
expect(response.status()).toBe(200);
|
|
});
|
|
|
|
test('manifest.json is valid', async ({ page }) => {
|
|
const response = await page.goto(`${BASE_URL}/manifest.json`);
|
|
expect(response.status()).toBe(200);
|
|
const data = await response.json();
|
|
expect(data.name || data.short_name).toBeTruthy();
|
|
});
|
|
});
|