✨ Add Ember.js SDK for visual testing with Testem

[Robdel12]

Summary

Introduces @vizzly-testing/ember package that enables visual regression testing in Ember.js projects using Testem and Playwright.

• Custom Testem launcher that uses Playwright for browser control (supports Chromium, Firefox, WebKit)
• vizzlySnapshot() helper for capturing screenshots in acceptance tests
• Automatic viewport sizing and #ember-testing container expansion (captures just the app, not QUnit UI)
• TDD server auto-discovery via .vizzly/server.json
• Mobile viewport testing with customizable dimensions
• Test app fixture for SDK development and verification

Architecture

Browser (Ember test)
    │
    │ fetch() to snapshot server
    ▼
Snapshot Server (Node.js)
    │
    │ Playwright screenshot
    │
    │ forward to TDD server
    ▼
Vizzly TDD Server
    │
    │ Compare, save baselines
    ▼
.vizzly/baselines/

Usage

// testem.cjs
const { configure } = require('@vizzly-testing/ember');

module.exports = configure({
  cwd: 'dist',
  test_page: 'tests/index.html?hidepassed',
  launch_in_ci: ['Chrome'],
});

// tests/acceptance/visual-test.js
import { vizzlySnapshot } from '@vizzly-testing/ember/test-support';

test('captures homepage', async function(assert) {
  await visit('/');
  await vizzlySnapshot('homepage');
  await vizzlySnapshot('homepage-mobile', { width: 375, height: 667 });
});

Test plan

• Unit tests for testem-config and snapshot-server
• Integration tests for launcher
• E2E test with real Ember app (npm run test:ember in clients/ember)
• Verified screenshots capture just the app content at correct viewport sizes