В моем приложении React я заметил несколько ошибок в продакшене, о которых сообщил Sentry. В основном это было: NotFoundError: Failed to execute 'removeChild' on 'Node': The node to be removed is not a child of this node.
. Я обнаружил, что эти ошибки на самом деле вызваны Google Translate, который возится с React DOM: https://github.com/facebook/react/issues/11538
Итак, теперь, если я хочу, чтобы мое приложение React было более устойчивым к Google Translate и другие плагины, которые изменяют DOM страницы, я хотел бы убедиться, что текстовые узлы никогда не смешиваются с другими узлами. Для этого я ищу правило ESLint, которое:
вызывает ошибку для этого кода :
<div>
{condition && 'Welcome'}
<span>Something</span>
</div>
И вместо этого принимает следующий код :
<div>
{condition && <span>Welcome</span>}
<span>Something</span>
</div>
Существует ли уже такое правило ESLint? Если нет, знаете ли вы, как построить это правило?