Conversation
…olish
## Bug Fix — Linux video export crash (modernFrameRenderer.ts)
On Linux with Intel/Mesa integrated graphics, video export was crashing with:
TypeError: Cannot read properties of undefined (reading '_resourceType')
Root cause 1 — WebGPU instability on Linux:
PixiJS v8 WebGPU backend has known upstream driver issues on Linux inside
Electron. The renderer was picking WebGPU by default whenever navigator.gpu
was present — which Electron exposes on Linux even though the implementation
is unstable on Intel/Mesa. Fixed by detecting Linux via navigator.userAgent
and forcing backend order to [webgl, webgpu] unless user has explicitly
opted into WebGPU in export settings.
Root cause 2 — Texture double-free / use-after-free:
Three hot-path methods were calling previousTexture.destroy(true)
unconditionally. When the new and previous texture shared the same underlying
GPU source, this destroyed a live GPU resource causing a crash on any backend.
Fixed by guarding: previousTexture.destroy(!isSameSource).
Root cause 3 — Retained VideoFrame / ImageBitmap lifetime bugs:
The resolveDetachedVideoFrameSource method had complex per-backend branching
(retained VideoFrame path for WebGPU, ImageBitmap cache, canvas staging) that
produced hard-to-reproduce texture lifetime bugs. Simplified to always use
stageVideoFrameOnCanvas for all backends. Removed now-unused fields
retainedSceneBitmapTimestamp and retainedBackgroundBitmapTimestamp.
## UI Improvements — Editor design polish
1. Sidebar rail navigation redesign (EditorSidebar)
- New animated active-section indicator using Framer Motion layoutId with
SVG inverted corner curves — connects the active icon flush into the
settings panel content area (macOS-style tab indicator)
- Replaced motion.button wrapper with plain button + motion.span for icon
- Icon size normalised to h-[24px] w-[24px]
- whileHover opacity added for inactive icons
2. Fullscreen preview mode (EditorPreviewPanel + EditorShell + index.css)
- index.css: body.preview-fullscreen class hides [data-editor-header],
[data-editor-sidebar], [data-editor-timeline], [data-editor-announcement]
via display:none — zero JS for the hide/show
- EditorShell: each panel section wrapped with its data-editor-* attribute
- EditorPreviewPanel: isFullscreen state, CornersIn exit button top-right
(hover-reveal with backdrop-blur), controls/toolbar hidden in fullscreen,
preview margin adapts to fullscreen layout
3. Theme token cleanup — remove hardcoded #2563EB across 17 files
Every occurrence of bg-[#2563EB], text-[#2563EB], border-[#2563EB]/x,
data-[state=checked]:bg-[#2563EB], selection:bg-[#2563EB]/30 replaced
with the semantic utilities bg-primary, text-primary, border-primary/x,
data-[state=checked]:bg-primary, selection:bg-primary/30.
This makes the UI respect the --primary CSS variable used for theming.
4. Undo/Redo button polish (EditorHeader)
- Removed border + background from inactive state
- Size: h-8 w-8 -> h-7 w-7, icon h-4 w-4 -> h-[14px] w-[14px]
Contributor
|
Note Currently processing new changes in this PR. This may take a few minutes, please wait... ⚙️ Run configurationConfiguration used: Path: .coderabbit.yaml Review profile: CHILL Plan: Advanced Run ID: 📒 Files selected for processing (32)
✨ Finishing Touches🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
This PR fixes a critical video export crash on Linux and includes UI polish improvements made while investigating the issue.
Bug Fix: Video export crash on Linux
Problem
On Linux — particularly with Intel integrated graphics and Mesa drivers inside Electron — video export was silently failing or crashing with the following error:
There were three root causes.
Root cause 1: WebGPU selected by default on Linux despite driver instability
PixiJS v8's WebGPU backend has known upstream driver-compatibility issues on Linux that are not yet resolved. Modern Electron exposes
navigator.gpuon Linux, which caused the renderer to pick WebGPU as its default backend even though the implementation is unstable on Intel/Mesa integrated graphics.Root cause 2: Texture double-free / use-after-free
In three hot-path methods —
updateLayerTexture,uploadVideoFrameToSprite, andupdateCaptionTexture— the previous texture was destroyed unconditionally:When the new texture shared the same underlying GPU source as the previous one, this destroyed a resource still in active use and caused a GPU crash on any backend, most visibly under WebGPU.
Root cause 3: Retained VideoFrame / ImageBitmap lifetime bugs
resolveDetachedVideoFrameSourcehad complex per-backend branching — an ImageBitmap cache for WebGPU, a retained VideoFrame path, and a canvas staging fallback — that produced hard-to-reproduce texture lifetime bugs across backends.Fix
Fix 1: Force WebGL on Linux by default
WebGPU remains available as an explicit opt-in for Linux users who have working drivers. This only changes the default.
Fix 2: Guard texture destroy with a same-source check
Applied consistently in all three hot-path methods.
Fix 3: Simplify frame source resolution
Removed the complex per-backend retained-VideoFrame and ImageBitmap cache from
resolveDetachedVideoFrameSource. All backends now usestageVideoFrameOnCanvas, which is the simplest and most tested path. The now-unused fieldsretainedSceneBitmapTimestampandretainedBackgroundBitmapTimestampare removed.UI Improvements
These improvements were made while auditing the codebase. They are non-breaking, presentation-only changes.
Sidebar rail navigation redesign
The active section indicator has been redesigned from a faint background pill with a small blue dot to an animated inverted-curve background that connects the active icon flush into the settings panel content area.
layoutId="rail-active-bg"provides a smooth spring animation when switching sections.motion.buttonwrapper is replaced with a plainbuttonelement with amotion.spanfor the icon, reducing DOM complexity.h-[27px] w-[27px]toh-[24px] w-[24px].whileHoveropacity added for inactive icons.Fullscreen preview mode
Adds a distraction-free fullscreen preview toggle to the editor.
index.css: A newbody.preview-fullscreenrule hides[data-editor-header],[data-editor-sidebar],[data-editor-timeline], and[data-editor-announcement]usingdisplay: none. The hide/show requires no JavaScript beyond toggling the body class.EditorShell.tsx: Each panel section is wrapped with its correspondingdata-editor-*attribute so the CSS rule can target it.EditorPreviewPanel.tsx: AddsisFullscreenstate with aCornersInexit button positioned in the top-right corner of the preview area. The button uses a semi-transparent backdrop-blur pill and reveals on hover. Toolbar controls are hidden while fullscreen is active. The preview container margin adapts to the fullscreen layout.Theme token cleanup
All occurrences of the hardcoded hex
#2563EBacross 17 component files are replaced with semantic Tailwind CSS variable utilities so the UI correctly responds to the--primaryCSS variable already used for theming.bg-[#2563EB]bg-primarytext-[#2563EB]text-primaryborder-[#2563EB]/20border-primary/20data-[state=checked]:bg-[#2563EB]data-[state=checked]:bg-primaryselection:bg-[#2563EB]/30selection:bg-primary/30Undo / Redo button polish
h-8 w-8toh-7 w-7. Icon size fromh-4 w-4toh-[14px] w-[14px].Files changed
src/lib/exporter/modernFrameRenderer.tssrc/components/video-editor/layout/EditorSidebar.tsxsrc/components/video-editor/layout/EditorPreviewPanel.tsxsrc/components/video-editor/layout/EditorShell.tsxsrc/index.csssrc/components/video-editor/layout/EditorHeader.tsx#2563EBtoprimary)Testing
--primaryis changed.Summary by CodeRabbit