Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Example Tests: Implement resolution, ppr, and multiplier params #104

Merged
merged 1 commit into from
Dec 7, 2023
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 6 additions & 0 deletions examples/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -44,8 +44,14 @@ pnpm watch
- `overlay` (boolean, default: "true")
- Whether or not to show the text overlay in the bottom-right corner that
displays the current test and driver being used.
- `resolution` (number, default: 720)
- Resolution (height) of to render the test at (in logical pixels)
- `fps` (boolean, default: "false")
- Whether or not to log the latest FPS to the console every 1 second.
- `ppr` (number, default: 1)
- Device physical pixel ratio.
- `multiplier` (number, default: 1)
- In tests that support it, multiply the number of objects created by this number. Useful for performance tests.
- `automation` (boolean, default: "false")
- Automation mode.
- Executes the exported `automation()` function for every Example Test
Expand Down
8 changes: 8 additions & 0 deletions examples/common/ExampleSettings.ts
Original file line number Diff line number Diff line change
Expand Up @@ -48,6 +48,14 @@ export interface ExampleSettings {
* Whether the test is being run in automation mode.
*/
automation: boolean;
/**
* For performance tests that want to support it, use this number as a multiplier
* for the number of objects created by a test.
*
* @remarks
* This value is `1` by default.
*/
perfMultiplier: number;
/**
* If the test is run in automation mode, this method will take a visual
* snapshot of the current state of the renderer's canvas for the Visual
Expand Down
54 changes: 48 additions & 6 deletions examples/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -54,30 +54,57 @@ const testModules = import.meta.glob('./tests/*.ts') as Record<
() => Promise<TestModule>
>;

const appWidth = 1920;
const appHeight = 1080;
const defaultResolution = 720;
const defaultPhysicalPixelRatio = 1;

(async () => {
// URL params
// - driver: main | threadx (default: threadx)
// - test: <test name> (default: test)
// - resolution: <number> (default: 720)
// - Resolution (height) of to render the test at (in logical pixels)
// - ppr: <number> (default: 1)
// - Device physical pixel ratio
// - showOverlay: true | false (default: true)
// - fps: true | false (default: false)
// - Log FPS to console every second
// - multiplier: <number> (default: 1)
// - In tests that support it, multiply the number of objects created by
// this number. Useful for performance tests.
// - finalizationRegistry: true | false (default: false)
// - Use FinalizationRegistryTextureUsageTracker instead of
// ManualCountTextureUsageTracker
// - automation: true | false (default: false)
// - Run all tests in automation mode
const urlParams = new URLSearchParams(window.location.search);
const automation = urlParams.get('automation') === 'true';
const test = urlParams.get('test') || (automation ? null : 'test');
const showOverlay = urlParams.get('overlay') !== 'false';
const logFps = urlParams.get('fps') === 'true';
const perfMultiplier = Number(urlParams.get('multiplier')) || 1;
const resolution = Number(urlParams.get('resolution')) || 720;
const physicalPixelRatio =
Number(urlParams.get('ppr')) || defaultPhysicalPixelRatio;
const logicalPixelRatio = resolution / appHeight;

let driverName = urlParams.get('driver');
if (driverName !== 'main' && driverName !== 'threadx') {
driverName = 'main';
}

if (test) {
await runTest(test, driverName, urlParams, showOverlay, logFps);
await runTest(
test,
driverName,
urlParams,
showOverlay,
logicalPixelRatio,
physicalPixelRatio,
logFps,
perfMultiplier,
);
return;
}
assertTruthy(automation);
Expand All @@ -91,7 +118,10 @@ async function runTest(
driverName: string,
urlParams: URLSearchParams,
showOverlay: boolean,
logicalPixelRatio: number,
physicalPixelRatio: number,
logFps: boolean,
perfMultiplier: number,
) {
const testModule = testModules[getTestPath(test)];
if (!testModule) {
Expand All @@ -109,6 +139,8 @@ async function runTest(
const { renderer, appElement } = await initRenderer(
driverName,
logFps,
logicalPixelRatio,
physicalPixelRatio,
customSettings,
);

Expand Down Expand Up @@ -137,6 +169,7 @@ async function runTest(
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
testRoot: renderer.root!,
automation: false,
perfMultiplier: perfMultiplier,
snapshot: async () => {
// No-op
},
Expand All @@ -149,6 +182,8 @@ async function runTest(
async function initRenderer(
driverName: string,
logFps: boolean,
logicalPixelRatio: number,
physicalPixelRatio: number,
customSettings?: Partial<RendererMainSettings>,
) {
let driver: ICoreDriver | null = null;
Expand All @@ -163,10 +198,10 @@ async function initRenderer(

const renderer = new RendererMain(
{
appWidth: 1920,
appHeight: 1080,
deviceLogicalPixelRatio: 0.6666667,
devicePhysicalPixelRatio: 1,
appWidth,
appHeight,
deviceLogicalPixelRatio: logicalPixelRatio,
devicePhysicalPixelRatio: physicalPixelRatio,
clearColor: 0x00000000,
coreExtensionModule: coreExtensionModuleUrl,
fpsUpdateInterval: logFps ? 1000 : 0,
Expand All @@ -190,7 +225,13 @@ async function initRenderer(
}

async function runAutomation(driverName: string, logFps: boolean) {
const { renderer, appElement } = await initRenderer(driverName, logFps);
const logicalPixelRatio = defaultResolution / appHeight;
const { renderer, appElement } = await initRenderer(
driverName,
logFps,
logicalPixelRatio,
defaultPhysicalPixelRatio,
);

// Iterate through all test modules
for (const testPath in testModules) {
Expand All @@ -216,6 +257,7 @@ async function runAutomation(driverName: string, logFps: boolean) {
driverName: driverName as 'main' | 'threadx',
appElement,
automation: true,
perfMultiplier: 1,
snapshot: async () => {
const snapshot = (window as any).snapshot as
| ((testName: string) => Promise<void>)
Expand Down
12 changes: 9 additions & 3 deletions examples/tests/stress.ts
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,11 @@ import type { ExampleSettings } from '../common/ExampleSettings.js';
const randomIntBetween = (from: number, to: number) =>
Math.floor(Math.random() * (to - from + 1) + from);

export default async function ({ renderer, testRoot }: ExampleSettings) {
export default async function ({
renderer,
testRoot,
perfMultiplier,
}: ExampleSettings) {
// create 100 nodes
const nodes: INode[] = [];

Expand All @@ -35,7 +39,7 @@ export default async function ({ renderer, testRoot }: ExampleSettings) {
parent: testRoot,
});

for (let i = 0; i < 103; i++) {
for (let i = 0; i < 100 * perfMultiplier; i++) {
const node = renderer.createNode({
width: 505,
height: 101,
Expand All @@ -61,6 +65,8 @@ export default async function ({ renderer, testRoot }: ExampleSettings) {
{
duration: 3000,
easing: 'ease-out',
loop: true,
stopMethod: 'reverse',
},
)
.start();
Expand All @@ -69,5 +75,5 @@ export default async function ({ renderer, testRoot }: ExampleSettings) {

animate();

setInterval(animate, 3000);
// setInterval(animate, 3000);
}