diff --git a/src/frontend/src/features/rooms/livekit/components/blur/index.ts b/src/frontend/src/features/rooms/livekit/components/blur/index.ts index 568098bc..4700c520 100644 --- a/src/frontend/src/features/rooms/livekit/components/blur/index.ts +++ b/src/frontend/src/features/rooms/livekit/components/blur/index.ts @@ -32,6 +32,10 @@ export enum ProcessorType { } export class BackgroundProcessorFactory { + static hasModernApiSupport() { + return ProcessorWrapper.hasModernApiSupport + } + static isSupported() { return ( ProcessorWrapper.isSupported || diff --git a/src/frontend/src/features/rooms/livekit/components/effects/EffectsConfiguration.tsx b/src/frontend/src/features/rooms/livekit/components/effects/EffectsConfiguration.tsx index 6a1c7026..4584e52c 100644 --- a/src/frontend/src/features/rooms/livekit/components/effects/EffectsConfiguration.tsx +++ b/src/frontend/src/features/rooms/livekit/components/effects/EffectsConfiguration.tsx @@ -114,6 +114,13 @@ export const EffectsConfiguration = ({ type, options )! + // IMPORTANT: Must explicitly stop previous processor before setting a new one + // in browsers without modern API support to prevent UI crashes. + // This workaround is needed until this issue is resolved: + // https://github.com/livekit/track-processors-js/issues/85 + if (!BackgroundProcessorFactory.hasModernApiSupport()) { + await videoTrack.stopProcessor() + } await videoTrack.setProcessor(newProcessor) onSubmit?.(newProcessor) } else {