[Tarulatapriya]

Summary

Fixes #1475

Valid video files dropped or picked via OS file pickers or certain browsers sometimes come with empty ("") or generic MIME types (application/octet-stream, application/x-matroska). Previously, both useVideoEditor and FileUpload strictly required file.type.startsWith("video/"), causing valid videos to be rejected before magic byte inspection could verify them.

Changes

• src/hooks/useVideoEditor.ts:
  • Allowed files with valid video extensions (.mp4, .mov, .avi, .webm, .mkv) and generic/empty MIME types ("", application/octet-stream, application/x-matroska) through Layer 1 and Layer 2 validation into Layer 3 (magic byte verification).
• src/components/FileUpload.tsx:
  • Updated upload drop/selection validation to accept valid video extensions with generic or empty MIME types.
  • Added common extensions (.mp4,.mov,.avi,.webm,.mkv) to the file input's accept attribute alongside video/*.
• src/hooks/tests/useVideoEditor.test.ts:
  • Added unit tests verifying acceptance of valid video extensions with empty/generic MIME types and rejection of non-video files.
  • Cleared test history state in beforeEach to prevent query param test leakage.

Testing

• npm run test / vitest (all tests passing)
• npx tsc --noEmit (clean)
• npm run lint (clean)
• npm run build (clean)

[netlify]

👷 Deploy request for reframe-os pending review.

Visit the deploys page to approve it

Name	Link
🔨 Latest commit	760bc49

[github-actions]

✅ PR Format Check Passed — @Tarulatapriya

Basic format checks passed. A maintainer will review your code changes.

This does not mean the PR is approved — it just means the format is correct.

[github-actions]

👋 Thanks for your PR, @Tarulatapriya!

Welcome to Reframe — a browser-based video editor built for everyone 🎬

What happens next

1. 🤖 Automated checks — build & TypeScript typecheck will run automatically
2. ✅ Vercel preview — a preview deployment will be created (requires maintainer authorization for fork PRs)
3. 👀 Code review — a maintainer will review your changes
4. 🚀 Merge — once approved, your PR will be merged!

Quick checklist

• PR title follows Conventional Commits (e.g. feat: add dark mode)
• Linked the issue this PR closes (e.g. Closes #123)
• Tested the changes locally (bun run dev)
• Build passes (bun run build)

Useful links

• 📖 CONTRIBUTING.md
• 🐛 Open Issues
• ⭐ Star the repo to support the project!

Happy coding! 🎉

[chiragjangiir]

This is a solid fix for issue #1475. Allowing generic MIME types (application/octet-stream, application/x-matroska, or empty "") when the filename extension matches a known video format addresses browser variance across OS file pickers (especially for .mkv files).

A couple of observations:

1. DRY constants: validExtensions ([".mp4", ".mov", ".avi", ".webm", ".mkv"]) is defined identically in both FileUpload.tsx and useVideoEditor.ts. Moving it to src/lib/constants.ts (e.g. SUPPORTED_VIDEO_EXTENSIONS) would keep the validation rules synchronized in one place.
2. Accept attribute: Adding ,.mp4,.mov,.avi,.webm,.mkv to the <input type="file" accept="..." /> attribute is great because some desktop environments fail to match .mkv against video/*.
3. Tests: Nice unit tests in useVideoEditor.test.ts verifying both generic MIME acceptance with valid extension and rejection with non-video extensions.