Modeling exercises: Apollon freezes locally

[FelixTJDietrich]

Describe the bug

In some diagrams, like BPMN and Component Diagrams, when dragging some elements on the canvas the browser freezes and then crashes.

To Reproduce

This issue only appears to exist in the development environment:

1. Go to 'Create modeling exercise'
2. Click on 'Class Diagram' and change to 'Component Diagram'
3. Scroll up to 'Solution Diagram'
4. Drag a component onto the canvas
5. ...
6. Crash

Expected behavior

No crash

Screenshots

No response

Which version of Artemis are you seeing the problem on?

7.4.2

What browsers are you seeing the problem on?

Chrome

Additional context

No response

Relevant log output

No response

[FelixTJDietrich]

I debugged for a really long time. I used Apollon as a local dependency for Artemis and could put breakpoints in the React code (tsx) using the browser's debugging tools.

There is an infinite loop in ./droppable/droppable.tsx, the owner is a uuid for two calls and then it is undefined , maybe that has to do something with the issue. @LeonWehrhahn also has problems with it and we are somewhat out of ideas.

@matthiaslehnertum, @loreanvictor do you have an idea?

[FelixTJDietrich]

@loreanvictor sent me another insight which might be helpful:

So I played around with the issue, and the main issue is the erroneous element ID being passed around. This is not specific to diagram type and happens for any element that is a container (e.g. Package elements on the Class Diagrams). I couldn’t figure out why this happens under the circumstances, and also handling the undefined ID gracefully requires a lot of changes across Apollon, which doesn’t seem like the correct approach for an issue that at least right now is not critical.

I suspect someone who understands the component composition of Apollon better might be able to find something more?

It is a peculiar issue as also I couldn’t find any way to reproduce it on Apollon itself.

[FelixTJDietrich]

I think the problem is fixable by using the signal-based change detection? This issue of causing infinite rerenders, is somehow related to the current change detection.

[egenerse]

@FelixTJDietrich I'm still investigating the browser freeze issue and wanted to share what I've found so far. The freeze occurs consistently when users add the following elements:

• Class Diagram: Package
• Activity Diagram: Activity
• Use Case Diagram: System
• Component Diagram: Component, Subsystem
• Deployment Diagram: Node, Component
• BPMN: All elements

I'll keep looking into it and will update with any progress or findings.

[krusche]

@egenerse Sounds like this happens specifically for container elements that can have sub elements? Maybe there is an issue in the processing or rendering here that leads to some kind of endless loop?

[egenerse]

This issue also occurs with a vanilla JavaScript setup. To verify, I created a separate repository, apollon-uml-vanilla-js. Given this, it appears that there’s no action required on the Artemis side. Interestingly, this issue does not appear in the React-based Apollon implementation and in Apollon/standalone.