retejs / connection-plugin

https://retejs.org
MIT License
15 stars 36 forks source link

Проблема с подключениями и ПКМ #10

Closed shift-reality closed 5 years ago

shift-reality commented 5 years ago

Здравствуйте! Подскажите, в чем может быть проблема? Воспроизводиться так: нужно сначала открыть контекстное меню, затем нажимать ПКМ Результат: все связи начинают пропадать, по очереди... Браузер: firefox 60.5.1esr (64-bit) Снимок: Peek 2019-03-11 09-41

shift-reality commented 5 years ago

В г.хроме все ОК, система Debian 9.9 64bit

Ni55aN commented 5 years ago

Какие плагины установлены?

shift-reality commented 5 years ago

editor.use(VueRenderPlugin); editor.use(ConnectionPlugin); editor.use(ContextMenuPlugin); editor.use(JsRenderPlugin);

Ni55aN commented 5 years ago

Действительно, вопроизводится такой баг. Причем не только на firefox, на chrome тоже. Контекстное меню здесь не при чем. Все дело в SVG области, в которой отрисовывается path.

Сама фича, из-за которой это проиходит, работает следующим образом: при клике на path нужно отсоединить соединение.

По умолчанию SVG имеет размеры где-то 300x100 px, но остается прозрачной и кликабельной.

Решением могло бы быть обнулить размеры SVG, но тогда по какой-то причине пути внутри смещаются. Похоже на баг на уровне движка для рендеринга в браузере

shift-reality commented 5 years ago

Можно как-то заменить это поведение? т.е. убрать удаление связи по ПКМ

Ni55aN commented 5 years ago

Можно уменьшить размеры svg

svg.connection { // dirty fix, path coordinates are incorrect with default 1px for some reason
  width: 12px;
  height: 12px;
}

в общем в комментарии изложена суть. И блокировать события на самом SVG не получается без ущерба для path

shift-reality commented 5 years ago

работает костыль выше, спасибо

Ni55aN commented 5 years ago

пока закрывать нет смысла, все же проблема с svg с единичными размерами или игнорированием событий (pointer-event: none) не работает для SVG

https://stackoverflow.com/a/13977580/3853903

Ni55aN commented 5 years ago

https://github.com/retejs/connection-plugin/issues/5 https://github.com/retejs/rete/issues/261#issuecomment-467164852

С выходом этого плагина можно будет удалить el.addEventListener('contextmenu' из rete-connection-plugin

UPD: удалил в 0.4.4

Ni55aN commented 5 years ago

Начиная с версии 0.4.5 проблема с отображением и лишней занимаемой областью исправлены:

  1. ширина и высота SVG равны 1px, теперь он не перекрывает другие элементы
  2. добавлен "магический" position: absolute, который исправляет позицию при слишком маленьком размере SVG. Подробнее