diff --git a/packages/core/src/renderer/scene.ts b/packages/core/src/renderer/scene.ts index 64ff0e51f..cde1a56e8 100644 --- a/packages/core/src/renderer/scene.ts +++ b/packages/core/src/renderer/scene.ts @@ -141,7 +141,9 @@ export function renderNode( canvas.saveLayer(r.opacityPaint) } - const layerBlur = node.effects.find((e) => e.visible && e.type === 'LAYER_BLUR') + const layerBlur = node.effects.find( + (e) => e.visible && (e.type === 'LAYER_BLUR' || e.type === 'FOREGROUND_BLUR') + ) if (layerBlur) { r.effectLayerPaint.setImageFilter(r.getCachedBlur(layerBlur.radius / 2)) canvas.saveLayer(r.effectLayerPaint) @@ -443,10 +445,7 @@ export function renderEffects( } } - if ( - (pass === 'behind' && effect.type === 'BACKGROUND_BLUR') || - (pass === 'front' && effect.type === 'FOREGROUND_BLUR') - ) { + if (pass === 'behind' && effect.type === 'BACKGROUND_BLUR') { r.applyClippedBlur(canvas, node, rect, hasRadius, effect.radius / 2) } diff --git a/tests/engine/renderer-effects.test.ts b/tests/engine/renderer-effects.test.ts index fb10c65f6..ae910d3ff 100644 --- a/tests/engine/renderer-effects.test.ts +++ b/tests/engine/renderer-effects.test.ts @@ -44,8 +44,8 @@ describe('Renderer handles all effect types', () => { expect(rendererSource).toContain("effect.type === 'BACKGROUND_BLUR'") }) - test('handles FOREGROUND_BLUR', () => { - expect(rendererSource).toContain("effect.type === 'FOREGROUND_BLUR'") + test('handles FOREGROUND_BLUR as layer blur', () => { + expect(rendererSource).toContain("e.type === 'FOREGROUND_BLUR'") }) }) @@ -107,9 +107,8 @@ describe('Blur effects use saveLayer pattern', () => { expect(layerBlurSection).toContain('saveLayer') }) - test('background and foreground blur use applyClippedBlur', () => { + test('background blur uses applyClippedBlur', () => { expect(rendererSource).toContain("effect.type === 'BACKGROUND_BLUR'") - expect(rendererSource).toContain("effect.type === 'FOREGROUND_BLUR'") expect(rendererSource).toContain('applyClippedBlur') })