Skip to main content

Bridge API

The bridge exposes window.__R3F_DOM__ — test frameworks call it via page.evaluate(). The Playwright r3f fixture and Cypress cy.r3f* commands wrap this API.

Properties

PropertyTypeDescription
_readybooleantrue when setup completed successfully
_errorstring | undefinedError message if _ready is false
canvasIdstring | undefinedCanvas identifier for multi-canvas apps
versionstringLibrary version

Query Methods

MethodReturnsDescription
getObject(id)ObjectMetadata | nullBy testId or uuid
getByTestId(id)ObjectMetadata | nullBy testId only
getByUuid(uuid)ObjectMetadata | nullBy uuid only
getByName(name)ObjectMetadata[]All objects with this name
getChildren(id)ObjectMetadata[]Direct children
getParent(id)ObjectMetadata | nullParent object
getByType(type)ObjectMetadata[]e.g. 'Mesh', 'Group', 'PointLight'
getByGeometryType(type)ObjectMetadata[]e.g. 'BoxGeometry'
getByMaterialType(type)ObjectMetadata[]e.g. 'MeshStandardMaterial'
getByUserData(key, value?)ObjectMetadata[]By userData key/value
getCount()numberTotal object count
getCountByType(type)numberCount by Three.js type
getObjects(ids[])Record<string, ObjectMetadata | null>Batch lookup
getWorldPosition(id)[x,y,z] | nullWorld-space position
fuzzyFind(query, limit?)ObjectMetadata[]Fuzzy search by testId/name

Inspection

MethodReturnsDescription
inspect(id, options?)ObjectInspection | nullDeep inspection (bounds, material, geometry)
snapshot()SceneSnapshotFull scene tree as JSON
getCameraState()CameraStateCamera position, rotation, fov, etc.
getDiagnostics()BridgeDiagnosticsBridge health and scene stats

Pass { includeGeometryData: true } to inspect() for vertex/index buffers.

Selection

MethodDescription
select(id)Select an object (shows highlight)
clearSelection()Clear all selections
getSelection()Get UUIDs of selected objects

Registration

MethodDescription
r3fRegister(obj)Manually register a Three.js object into the mirror DOM. Warns if the object isn't in the scene graph.
r3fUnregister(obj)Unregister a manually registered object. Won't remove auto-registered objects.

Utility

MethodDescription
setInspectMode(on)Enable/disable inspect mode for DevTools
sweepOrphans()Remove orphaned objects from store
getObject3D(id)Raw Three.js Object3D access

Examples

Playwright

const cube = await r3f.getObject('hero-cube');
console.log(cube.position); // [0, 1, 0]

const meshes = await r3f.getByType('Mesh');
const objects = await r3f.getObjects(['wall-1', 'wall-2', 'floor']);

const inspection = await r3f.inspect('hero-cube');
console.log(inspection.material.color); // '#ffa500'

Cypress

cy.r3fGetObject('hero-cube').then((obj) => {
expect(obj.type).to.equal('Mesh');
});

cy.r3fInspect('hero-cube').then((inspection) => {
expect(inspection.material.color).to.equal('#ffa500');
});