199d9bbec9
Plan 3 of the web embedding SDK: @zseven-w/op-web-sdk-react and -vue — thin read-only framework adapters over the TS core. Each: <DesignView> (canvas + viewer lifecycle), provider/inject of OpViewer, and read-only useDocument/useViewport/useActivePage. React via useSyncExternalStore (cache-invalidate-on-event); Vue via an async shallowRef provider so children inject the viewer after load. Self-contained (no pen-* deps; framework peer); React 5/5 + Vue 4/4 tests; both tsc clean.
20 lines
794 B
TypeScript
20 lines
794 B
TypeScript
import { describe, it, expect } from 'vitest';
|
|
import { act } from '@testing-library/react';
|
|
import { renderHook } from '@testing-library/react';
|
|
import { makeMockViewer } from './mock-core.js';
|
|
import { DesignProvider, useViewport } from '../src/index.js';
|
|
import type { ReactNode } from 'react';
|
|
|
|
describe('useViewport', () => {
|
|
it('re-renders on viewportchange', () => {
|
|
const { viewer, emit } = makeMockViewer();
|
|
const wrapper = ({ children }: { children: ReactNode }) => (
|
|
<DesignProvider viewer={viewer as never}>{children}</DesignProvider>
|
|
);
|
|
const { result } = renderHook(() => useViewport(), { wrapper });
|
|
expect(result.current.zoom).toBe(1);
|
|
act(() => { viewer.setZoom(3); emit('viewportchange'); });
|
|
expect(result.current.zoom).toBe(3);
|
|
});
|
|
});
|