SVG как ReactComponents, двойной щелчок выделяет следующий текст ⇐ CSS

[Гость]

Я использую несколько SVG-файлов в своем приложении React и импортирую их как ReactComponents:

import { ReactComponent as InfoIcon } из "../../resources/svg/icons/basic/info-icon.svg"; тогда я буду использовать его в своем компоненте следующим образом:

Моя проблема в том, что всякий раз, когда я дважды щелкаю любой SVG в приложении, он выделяет текст в следующем ближайшем элементе дерева html, содержащем текст. Обычно это родственный элемент, но если нет родственных элементов с текстом, он просто переходит к родственному элементу родителя и т. д.

Я попытался предотвратитьDefault и stopPropgation в обработчиках событий onClick, но это не повлияло на подсветку текста.

Я также заметил, что это происходит на большинстве сайтов, где изображение не взаимодействует, и это, похоже, специфичная для Chrome функция (в Firefox этого не происходит). Есть ли способ предотвратить такое поведение, кроме использования CSS user-select: none?