core
core copied to clipboard
vuejs
fix(runtime-core): properly get anchor when next sibling node is teleported
close #9071
simple reproduction 1(click toggle 2 times)
simple reproduction 2(click toggle)
The root cause is that use a teleported node as an anchor and the teleported node is a child of n1 (the unmounting node)
Size Report
Bundles
| File | Size | Gzip | Brotli |
|---|---|---|---|
| runtime-dom.global.prod.js | 90.9 kB (+426 B) | 34.5 kB (+121 B) | 31.1 kB (+131 B) |
| vue.global.prod.js | 148 kB (+426 B) | 53.8 kB (+116 B) | 48 kB (+116 B) |
Usages
| Name | Size | Gzip | Brotli |
|---|---|---|---|
| createApp | 51 kB (+225 B) | 19.9 kB (+93 B) | 18.1 kB (+64 B) |
| createSSRApp | 54.3 kB (+225 B) | 21.2 kB (+73 B) | 19.3 kB (+76 B) |
| defineCustomElement | 53.2 kB (+225 B) | 20.6 kB (+74 B) | 18.8 kB (+57 B) |
| overall | 64.6 kB (+225 B) | 24.9 kB (+73 B) | 22.6 kB (+56 B) |
![github-actions[bot] avatar](https://avatars.githubusercontent.com/in/15368?v=4 "Published by a pub.dev verified publisher"){kind=small}
CodSpeed Performance Report
Merging #9313 will not alter performance
Comparing edison1105:9071 (64b98ca) with main (04d2c05)
Summary
✅ 53 untouched benchmarks
![codspeed-hq[bot] avatar](https://avatars.githubusercontent.com/in/257293?v=4 "Published by a pub.dev verified publisher"){kind=small}
📝 Ran ecosystem CI: Open
| suite | result | latest scheduled |
|---|---|---|
| language-tools | :x: failure | :x: failure |
| nuxt | :white_check_mark: success | :white_check_mark: success |
| pinia | :white_check_mark: success | :white_check_mark: success |
| quasar | :white_check_mark: success | :white_check_mark: success |
| router | :white_check_mark: success | :white_check_mark: success |
| test-utils | :white_check_mark: success | :white_check_mark: success |
| vant | :white_check_mark: success | :white_check_mark: success |
| vite-plugin-vue | :white_check_mark: success | :white_check_mark: success |
| vitepress | :white_check_mark: success | :white_check_mark: success |
| vue-i18n | :white_check_mark: success | :white_check_mark: success |
| vue-macros | :white_check_mark: success | :white_check_mark: success |
| vuetify | :x: failure | :x: failure |
| vueuse | :white_check_mark: success | :white_check_mark: success |
| vue-simple-compiler | :white_check_mark: success | :white_check_mark: success |
📝 Ran ecosystem CI: Open
| suite | result | latest scheduled |
|---|---|---|
| language-tools | :white_check_mark: success | :white_check_mark: success |
| nuxt | :white_check_mark: success | :white_check_mark: success |
| pinia | :x: failure | :x: failure |
| quasar | :white_check_mark: success | :white_check_mark: success |
| radix-vue | :white_check_mark: success | :white_check_mark: success |
| router | :white_check_mark: success | :white_check_mark: success |
| test-utils | :white_check_mark: success | :white_check_mark: success |
| vant | :white_check_mark: success | :white_check_mark: success |
| vite-plugin-vue | :white_check_mark: success | :white_check_mark: success |
| vitepress | :white_check_mark: success | :white_check_mark: success |
| vue-i18n | :white_check_mark: success | :white_check_mark: success |
| vue-macros | :white_check_mark: success | :white_check_mark: success |
| vuetify | :white_check_mark: success | :white_check_mark: success |
| vueuse | :white_check_mark: success | :white_check_mark: success |
| vue-simple-compiler | :white_check_mark: success | :white_check_mark: success |
这种场景下，按照代码逻辑会插入到teleported1下面吧，但实际应该在上面 @edison1105 另外请教下，我该如何在playground调试你最新提交的commit呢
@cicada-ah
点击这里可以看到这个 PR 的 playground.
https://deploy-preview-9313--vue-sfc-playground.netlify.app/#eNp9ks1OwzAQhF/FmAMglUYITlVa8aMe4AAIevQlJJvUrWNb9iatVOXdWSdNKFXVi2XvfDser7zjT9aO6wr4hMc+ddIi84CVnQktS2scsh1zkLOG5c6U7IrQK6GFTo32hC7Nhk0DcJ0nysON0HHU2ZABHRBKqxIEOjEW/1SIRrPHVMl0PRU8tE8vwir4DE1RKIijDuoaMlkzmRGJiSsAiQplEhagoE1X38p87yQ4Q0P7yyOYcG8TPcN9D2SUMRT2XlFv1t0Z0aXdbrjkpO2x6d2B6z/POBqmwEccPY0ul8V45Y2mqe8CL3hqSisVuA+LkkYr+IS1StASpczmra2hq2DU19MlpOsT9ZXfhprgnw48uBoEH7T+EUGef7/DlvaDWJqsUkSfEb/AG1WFjB32XOmMYh9wbdrX9u9IXSz8fIugff+oEDSQTcsLTv/p5czT/+Lejx/aPqEb3vwCW93nDQ==
@edison1105 请看下面示例，对比修改前后，在一次切换后，foo的位置发生了变化，同时包括一些其它issues里对insetBefore第二个参数做兜底，也应该会有这个问题，且更加粗暴，会规避掉一些本该报错的场景，我可能相对比较赞成，先unmount，再重新找anchor的做法 修改前
📝 Ran ecosystem CI: Open
| suite | result | latest scheduled |
|---|---|---|
| language-tools | :x: failure | :white_check_mark: success |
| nuxt | :x: failure | :white_check_mark: success |
| pinia | :white_check_mark: success | :x: failure |
| quasar | :white_check_mark: success | :white_check_mark: success |
| radix-vue | :white_check_mark: success | :white_check_mark: success |
| router | :white_check_mark: success | :white_check_mark: success |
| test-utils | :white_check_mark: success | :white_check_mark: success |
| vant | :white_check_mark: success | :white_check_mark: success |
| vite-plugin-vue | :white_check_mark: success | :white_check_mark: success |
| vitepress | :white_check_mark: success | :white_check_mark: success |
| vue-i18n | :white_check_mark: success | :white_check_mark: success |
| vue-macros | :white_check_mark: success | :white_check_mark: success |
| vuetify | :white_check_mark: success | :white_check_mark: success |
| vueuse | :white_check_mark: success | :white_check_mark: success |
| vue-simple-compiler | :white_check_mark: success | :white_check_mark: success |
📝 Ran ecosystem CI: Open
| suite | result | latest scheduled |
|---|---|---|
| language-tools | :x: failure | :x: failure |
| nuxt | :white_check_mark: success | :white_check_mark: success |
| pinia | :white_check_mark: success | :white_check_mark: success |
| quasar | :white_check_mark: success | :white_check_mark: success |
| radix-vue | :white_check_mark: success | :white_check_mark: success |
| router | :white_check_mark: success | :white_check_mark: success |
| test-utils | :white_check_mark: success | :white_check_mark: success |
| vant | :white_check_mark: success | :white_check_mark: success |
| vite-plugin-vue | :white_check_mark: success | :white_check_mark: success |
| vitepress | :white_check_mark: success | :white_check_mark: success |
| vue-i18n | :white_check_mark: success | :white_check_mark: success |
| vue-macros | :white_check_mark: success | :white_check_mark: success |
| vuetify | :white_check_mark: success | :white_check_mark: success |
| vueuse | :white_check_mark: success | :white_check_mark: success |
| vue-simple-compiler | :white_check_mark: success | :white_check_mark: success |
@edison1105 还是有遗漏场景 https://deploy-preview-9313--vue-sfc-playground.netlify.app/#eNqdU11r2zAU/SuaNogDmc3YnjIndCt92GAfrIW9+MW1rx21smSkKzcQ8t97JSGnKaUPfTDI9xwdnft14N/GMZ8c8DUvEYZR1gjbSjFWtmJiot1UHGvTA1Y8hAlINDZ9FB3h7+xOP/w39ThTiHS5E7JNDE8IgYqzC9R9L8HrhgOFiqRcnDsoyAKdzsL0axsjRmSyVr1XsaRgAd1IqBhGbZAdmFa/tFMI7YoZ6NiRdUYPbEGJLr7OtOgxInkR/nwpPKNSjVYWWUqNbbxO1tXSwpLwExpFnsHz81m2ZJstO/h8ZnY+1dIB3UHjgNjHk2KsCUGZsNfEX7NbrSXU6lzGW5pVItPr0FcWsTxUDL6i4pBsJ/r8zmpFLQ4CFW/0MAoJ5s+Igp6t+DpKe6yWUj/8DDFvb5XizQ6a+xfid3bvYxX/a8CCmaihM5Ymx8NX179hT+cZHHTrfPtfAf+B1dJ5j5H23amWbD/hBbc/QjuF6m/s1R5B2ZSUN+qZx8CvODX38pXUT3Y/51/CPaopVXGejBeXJA3vrUPUil00UjT3NJgfYBCYLWJHF6tgZkkrEgNlEfnp9g1ICEOJmu6+f7ZzRNh92iJYLAs6pHVJl966Lk+H5fgIKv9YFg==