examples: Add automated Cross-Framework testing for Web Component (React, Vue, Svelte)

[lerrybe]

Related Issue

#140

• The CI integration work has been deferred due to repository forking limitations. (Testing revealed that the functionality works properly within the forked repository.)
• To properly test workflows, It needs either same-repository testing (fork-to-fork) or cross-repository workflow configuration enabled, which appears to require additional setup. This will be addressed in a follow-up PR.

Summary

Add a simple bash script to test framework compatibility across React, Vue, and Svelte examples.

What the Script Does

The scripts/cross-framework-build-test.sh script:

Auto-Discovery

• Automatically finds all framework directories in example/

Build Validation

• Checks each framework has a valid directory and package.json
• Installs dependencies (npm install) if node_modules is missing
• Runs npm run build for each framework
• Tracks success/failure for each build

Usage

$ ./scripts/cross-framework-build-test.sh

Screenshots

Vue	Svelte	React

All successful cases	Some failure cases

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Preview	Comments	Updated (UTC)
thorvg-perf-test	Ready	Preview	Comment	Sep 15, 2025 4:30pm

[lerrybe]

@tinyjin
I’ve drafted a proposal for issue 140. The diff is a bit large, but I believe that’s mainly because configuration files are included. 😅 If further clarification is needed, I’ll be glad to add comments. Please review with a focus on (1) the example setup and (2) the script structure. Thank you.

[Copilot]

Pull Request Overview

This PR adds automated cross-framework build testing infrastructure to verify Web Component compatibility across React, Vue, and Svelte frameworks, addressing issue #140 for thorvg.web.

• Implements a comprehensive build testing script with auto-discovery, validation, and reporting
• Creates example projects for React, Vue, and Svelte demonstrating ThorVG Lottie Player integration
• Adds npm script aliases for convenient framework-specific and comprehensive testing

Reviewed Changes

Copilot reviewed 36 out of 43 changed files in this pull request and generated 2 comments.

Show a summary per file

File	Description
scripts/cross-framework-test/	Core testing infrastructure with modular architecture for framework build validation
example/react/	React example project with Vite configuration and ThorVG integration
example/vue/	Vue example project with TypeScript and Vite setup
example/svelte/	Svelte example project with modern Svelte 5 configuration
package.json	Added npm script aliases for cross-framework testing
README.md	Updated documentation with build testing instructions

Files not reviewed (2)

• example/svelte/package-lock.json: Language not supported
• example/vue/package-lock.json: Language not supported

---

_{Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.}

[Copilot]

There are duplicate entries for 'declarations.d.ts' in the include array, and there's an extra comma before the first entry. Remove the duplicates and fix the syntax.

Suggested change

	"vite.config.ts"
	, "declarations.d.ts", "declarations.d.ts" ]
	"vite.config.ts",
	"declarations.d.ts"
	]

[tinyjin]

Please check comment I think testing script is over spec

[tinyjin]

I think example related command shouldn't be here. Also I see we don't need example build scripts

[tinyjin]

javascript is too much. I think simple shell scripts would be enough

[tinyjin]

1. Please check comments.
2. Please make sure each examples are valid page. I see example does not render animation. Even if we don't have to run visual check, at least it should be running correctly when we open local build page.

[tinyjin]

wrong version, v1.0.0-beta.1 is unavailable.

Also invalid approach, in the testing, we expect example run build test with local build.

Please check this with another examples as well.