diff --git a/packages/fiber/src/core/utils.ts b/packages/fiber/src/core/utils.ts index 71d8e38b71..efa7caefd2 100644 --- a/packages/fiber/src/core/utils.ts +++ b/packages/fiber/src/core/utils.ts @@ -260,6 +260,11 @@ export function diffProps( // Props changed, add them changedProps[prop] = newProps[prop] + + // Reset pierced props + for (const other in newProps) { + if (other.startsWith(`${prop}-`)) changedProps[other] = newProps[other] + } } // Reset removed props for HMR diff --git a/packages/fiber/tests/utils.test.ts b/packages/fiber/tests/utils.test.ts index 1fa17e8574..442b12fda9 100644 --- a/packages/fiber/tests/utils.test.ts +++ b/packages/fiber/tests/utils.test.ts @@ -262,6 +262,18 @@ describe('diffProps', () => { expect(filtered).toStrictEqual({ bar: false }) }) + it('invalidates pierced props when root is changed', async () => { + const texture1 = { needsUpdate: false, name: '' } as THREE.Texture + const texture2 = { needsUpdate: false, name: '' } as THREE.Texture + + const oldProps = { map: texture1, 'map-needsUpdate': true, 'map-name': 'test' } + const newProps = { map: texture2, 'map-needsUpdate': true, 'map-name': 'test' } + + const instance = prepare({}, storeMock, '', oldProps) + const filtered = diffProps(instance, newProps) + expect(filtered).toStrictEqual(newProps) + }) + it('should pick removed props for HMR', () => { const instance = prepare(new THREE.Object3D(), storeMock, '', { position: [0, 0, 1] }) const newProps = {}