Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat: fix vue3 render warning loop (#6014)
This patch fixes an infinite loop that would occur in Vue 3 apps with undeclared refs. Why this happens: 1. Vue3 supports the property `ref` in the second arg of `h` method (see https://cn.vuejs.org/guide/essentials/template-refs.html) 2. When a with an undeclared variable is rendered, Vue3 will call `console.warn` to print the error stack. 3. Sentry instruments `console` (for the `BreadCrumbs` integration), and adds the message to the `Breadcrumb` with `safeJoin`. 4. `safeJoin` converts variables to string. The ref variable is a proxied object via `Proxy` by Vue. so, when `String(value)` is called upon the undefined ref, it will trigger the getter of the Proxy, and which causes Vue3 to call `console.warn` again. 5. This repeats infinitely. Solutions: Because there's no reliable way of testing if an object is a `Proxy`, the solution in this case is tailored to this exact scenario. In the breadcrumbs integration code, we check if the passed arguments to the `console.warn` match the specific warning described above. In case of a match, we alter the following argument to not trigger a warning again, thus leaving us with the one warning we want and getting rid of the infinite loop.
- Loading branch information