Add rule to warn against DOM queries in computed

[panstromek]

Please describe what the rule should do:

I've just reviewed a piece of code with DOM queries in computed prop. This is subtly wrong, because the computed is not recomputed when DOM changes. The right way to do this is to either use ref binding in template or query the in event handlers where the element is needed.

What category should the rule belong to?

[ ] Enforces code style (layout) [x] Warns about a potential error (problem) [ ] Suggests an alternate way of doing something (suggestion) [ ] Other (please specify:)

Provide 2-3 code examples that this rule should warn about:

const current = ref(0)
// following computed is only updated when `current` changes, but not when DOM changes
const currentPostElement = computed(() => document.querySelectorAll('post')[current.value])