Try at removing instances renderer directly after removal

newIDE/app/src/InstancesEditor/InstancesRenderer/LayerRenderer.js

@@ -743,6 +743,18 @@ export default class LayerRenderer {
     }
   }
 
+  destroyInstanceRenderers(instances: gdInitialInstance[]) {
+    console.log('layer.destroyInstanceRenderers: ', instances.length)
+    for (let instanceToDestroy of instances) {
+      console.log('instance to destroy for object ', instanceToDestroy.getObjectName())
+      const renderedInstance = this.renderedInstances[instanceToDestroy.ptr]
+      if (renderedInstance) {
+        console.log("DESTROY")
+        renderedInstance.onRemovedFromScene();
+      }
+    }
+  }
+
   /**
    * Remove rendered instances that are not associated to any instance anymore
    * (this can happen after an instance has been deleted).
@@ -753,7 +765,9 @@ export default class LayerRenderer {
       if (this.renderedInstances.hasOwnProperty(i)) {
         const renderedInstance = this.renderedInstances[i];
         if (!renderedInstance.wasUsed) {
+          console.log("was not used, on remove from scene")
           renderedInstance.onRemovedFromScene();
+          console.log("delete rendered instance")
           delete this.renderedInstances[i];
         } else renderedInstance.wasUsed = false;
       }

newIDE/app/src/InstancesEditor/InstancesRenderer/index.js

@@ -329,6 +329,18 @@ export default class InstancesRenderer {
     }
   }
 
+  destroyInstanceRenderers(instances: gdInitialInstance[]) {
+    console.log("DESTROY INSTANCES RENDERERS")
+    for (let i in this.layersRenderers) {
+      if (this.layersRenderers.hasOwnProperty(i)) {
+        const layerRenderer = this.layersRenderers[i];
+
+        console.log("DESTROY INSTANCES RENDERERS in layer")
+        layerRenderer.destroyInstanceRenderers(instances);
+      }
+    }
+  }
+
   /**
    * Clean up rendered layers that are not existing anymore
    */

newIDE/app/src/InstancesEditor/SelectedInstances.js

@@ -234,6 +234,8 @@ export default class SelectedInstances {
       }
 
       const instance = selection[i];
+    console.log(instance, instance.getObjectName())
+
       const instanceRect = this.instanceMeasurer.getInstanceAABB(
         instance,
         new Rectangle()

newIDE/app/src/InstancesEditor/index.js

@@ -621,6 +621,11 @@ export default class InstancesEditor extends Component<Props> {
     );
   };
 
+  destroyInstanceRenderers = (instances: gdInitialInstance[]) => {
+    console.log('instancesEditor.destroyInstanceRenderers: ', instances.length);
+    this.instancesRenderer.destroyInstanceRenderers(instances);
+  };
+
   /**
    * Immediately add serialized instances at the given
    * position (in scene coordinates).
@@ -783,6 +788,10 @@ export default class InstancesEditor extends Component<Props> {
       return;
     }
 
+    console.log(
+      'on down instance, select, object name:',
+      instance.getObjectName()
+    );
     this.props.instancesSelection.selectInstance({
       instance,
       multiSelect: this.keyboardShortcuts.shouldMultiSelect(),
@@ -790,6 +799,7 @@ export default class InstancesEditor extends Component<Props> {
     });
 
     if (this.props.onInstancesSelected) {
+      console.log('now call onInstancesSelected');
       this.props.onInstancesSelected(
         this.props.instancesSelection.getSelectedInstances()
       );

newIDE/app/src/SceneEditor/EditorsDisplay.flow.js

@@ -155,5 +155,6 @@ export type SceneEditorsDisplayInterface = {|
       preventSnapToGrid?: boolean,
       addInstancesInTheForeground?: boolean,
     |}) => Array<gdInitialInstance>,
+    destroyInstanceRenderers: (gdInitialInstance[]) => void,
   |},
 |};

newIDE/app/src/SceneEditor/MosaicEditorsDisplay/index.js

@@ -206,6 +206,9 @@ const MosaicEditorsDisplay = React.forwardRef<
         addSerializedInstances: editor
           ? editor.addSerializedInstances
           : () => [],
+        destroyInstanceRenderers: editor
+          ? editor.destroyInstanceRenderers
+          : () => {},
       },
     };
   });

newIDE/app/src/SceneEditor/SwipeableDrawerEditorsDisplay/index.js

@@ -196,6 +196,9 @@ const SwipeableDrawerEditorsDisplay = React.forwardRef<
         addSerializedInstances: editor
           ? editor.addSerializedInstances
           : () => [],
+        destroyInstanceRenderers: editor
+          ? editor.destroyInstanceRenderers
+          : () => {},
       },
     };
   });

newIDE/app/src/SceneEditor/index.js

@@ -661,6 +661,7 @@ export default class SceneEditor extends React.Component<Props, State> {
   };
 
   _onInstancesSelected = (instances: Array<gdInitialInstance>) => {
+    console.log('on instances selected');
     if (instances.length === 0) {
       this.setState(
         { selectedObjectFolderOrObjectsWithContext: [] },
@@ -673,7 +674,9 @@ export default class SceneEditor extends React.Component<Props, State> {
     // representing all the instances selected.
     const lastSelectedInstance = instances[instances.length - 1];
     const objectName = lastSelectedInstance.getObjectName();
+    console.log('object name', objectName);
     if (project.hasObjectNamed(objectName)) {
+      console.log('object is global');
       this.setState(
         {
           selectedObjectFolderOrObjectsWithContext: [
@@ -688,6 +691,7 @@ export default class SceneEditor extends React.Component<Props, State> {
         this.updateToolbar
       );
     } else if (layout.hasObjectNamed(objectName)) {
+      console.log('object is scene');
       this.setState(
         {
           selectedObjectFolderOrObjectsWithContext: [
@@ -757,6 +761,7 @@ export default class SceneEditor extends React.Component<Props, State> {
     multiSelect: boolean,
     targetPosition?: 'center' | 'upperCenter'
   ) => {
+    console.log('selecting instances');
     this.instancesSelection.selectInstances({
       instances,
       multiSelect,
@@ -771,8 +776,10 @@ export default class SceneEditor extends React.Component<Props, State> {
         offset = [0, viewPosition.toSceneScale(viewPosition.getHeight() / 4)];
       }
 
+      console.log('centering view');
       viewControls.centerViewOnLastInstance(instances, offset);
     }
+    console.log('updating toolbar after selecting instance');
     this.updateToolbar();
   };
 
@@ -1202,16 +1209,28 @@ export default class SceneEditor extends React.Component<Props, State> {
   };
 
   deleteSelection = () => {
+    console.log('deleteSelection');
     const selectedInstances = this.instancesSelection.getSelectedInstances();
     selectedInstances.forEach(instance => {
       if (instance.isLocked()) return;
+      console.log('removeInstance');
       this.props.initialInstances.removeInstance(instance);
     });
+    const { editorDisplay } = this;
+    if (editorDisplay) {
+      editorDisplay.instancesHandlers.destroyInstanceRenderers(
+        selectedInstances
+      );
+    }
 
+    console.log('clearSelection', selectedInstances.length);
     this.instancesSelection.clearSelection();
-    if (this.editorDisplay)
-      this.editorDisplay.instancesHandlers.clearHighlightedInstance();
+    if (editorDisplay) {
+      console.log('clearHighlightedInstance', selectedInstances.length);
+      editorDisplay.instancesHandlers.clearHighlightedInstance();
+    }
 
+    console.log('setting state');
     this.setState(
       {
         selectedObjectFolderOrObjectsWithContext: [],
@@ -1222,6 +1241,7 @@ export default class SceneEditor extends React.Component<Props, State> {
         ),
       },
       () => {
+        console.log('setting state callback');
         this.updateToolbar();
         this.forceUpdatePropertiesEditor();
       }