Fix navigaton for <div> with extra style

[pavlyuts]

In a case of any extra style applied to <div>, assigned as Editor container, move canva stop work normally:

1. In the normal mode it work only if click to child drawflow <div>, and won't work if it moved and click goes to prawflow-parent.
2. In the fxed mode move of canva donot work at all.

All of this becuase code rely on e.target.classList[0], assuming then it is always only one class assigned to any element, and these classes are pre-defined. It looks true for all the elements, created by editor, but it is not true for container <div> which is used to put editor in.

Fix: change e.target.classList[0] to matches() for conditions and add looping over all the classes of the element in the esecution part.

[fbe2125] includes meaningful code change.
[17b7841] Incluses just indents change, coming from the code taken into extra loop.

Hope you found it usefull, this made the code a bit more immue to some factors behind of control.

[jerosoler]

Hello @pavlyuts

Thanks for the pull request.

It would not be better to force "parent-drawflow" to be the first class. So we avoid the loop issue.

In the function start.

Something like that:

var elem = document.getElementById('drawflow');
const copyClass = elem.className;
elem.className = ""; // Remove All clases
elem.classList.add("parent-drawflow") // Add class
copyClass.split(" ").forEach(item => elem.classList.add(item)); // Add copied clases

What do you think?

[pavlyuts]

Hi!
There should not be any loop issue. Even a loop via all the assigned classes the loop will do nothing on unknown classes but will do what required for every internal class regardless of order. I think my code is more general to resolve the issue.

In other hand, this only matters for top-level container class. You may fix order at the moment of assigning parent-drawflow to ensure it is the first one and this shoud work too.

It is up to you, it is your code, I only wish the issue be fixed ;)

Pls let me know your decision, I may do you way too.