Vue version

3.3.8

Link to minimal reproduction

https://play.vuejs.org/#eNqNVF1P2zAU/St3eUmRmmQSQpqywmAVk7aHMW085sUkt43BsS3bCSDU/75rh3y0ZWh9aHLP9Tn303mJrrROuxajPFrZ0nDtwKJrNQgmt+dF5GwRXRSSN1oZBy9Q4YZLXCuyJUq3BIObJdwaJi13XMkl1LCDjVENxCQbF7KQpZLWgdIo4dyfX2yYsHjiXYNzFKQTByEWL4WEPqnFCZDhTSAd1xoJBJ1feNRjI1ovBgDmuU3gSPC/LAOKg+YbZb0WzNocikjpJICJr6WIZtyJcFU63uExhQX8mCSQdXhMCvD7pFt1THCqiOZnJWswh1hpavqA7WZqH/wE0o6JFuHLnFgvYquZjJcQ38QnQEHedq7JObhoekHfP+hvF6a5yvoVooUhw2GjBXNIFsBqmnDWA7UZ3u5a55SEy1Lw8oF2rp/p676ErMMOhmGq7VZgYGU9LcTak5sGHlpCgkqPAitfDHQJ3wTcS0PpW0sml4IWL7kTqnyAOjmDx+SMiDdUFpH2BN6nkD7Shl+sZ8xVNuVFwCqbtYdM656Ff00Plojm56H5ivTL60a1nFrFSu6e4WN6ZgGZxc80ES87qfkt3tNyqtd55ebwsSdRyiGVaBn1lz5pmE7vrZL0iQgMqjo46MuQDxepiOiye7uIaue0zbOsrCTRKhS8M6lEl0ndZJd0LDOtdLzBpFLN5Wl6mn7KKm7dHE7RNsmdUY8WTaqNqkhpvBkhVkaejuoyKCs0aP439gFtHv/AtZeDDz+sOnXGWfpsbfj2oC8l7TgXaG60n8t+f5gQ6vFHwJxp/Vx7vKyxfHgDv7dPfU2/DIbMZvU7Zrboevf1n5/4RO+js1FVS1fkPedvtEq0Psf+2NdWVpT27FzI9nsYM5fbW3v95JDW7bUon2joRjgf5uGv979Kn9Klbo9d3P0FqAsXVQ==

https://github.com/vuejs/core/assets/41265413/a69ed32a-d955-4316-be6e-f472bbcc5992

Steps to reproduce

1. click toggle button
2. The one above didn't work. The one below, written with sfc, works.

What is expected?

1. all should works

What is actually happening?

1. component written in render function not working

System Info

No response

Any additional comments?

No response

https://play.vuejs.org/#eNqNU81uEzEQfpXBl6RSslupQkJLWgpVD3CgCHrDHNzdSeJ217Zsb9ooisQdiQsvw4mnAZ6DsZ1sNlFBKFLW/mbmm29+vGIvjckWLbKCTVxppfHg0LcGaqFmp5x5x9kZV7Ix2npYQYVTqfBC012h8iOwOB3BtRXKSS+1GsEc1jC1uoEB0Q64KrVyHrRBBafBezgVtcMjrsIvGTs68jhIMFxxBUnS8AjoEq5APL61Cgg6PQtowNJ/Z5sP+6pWoESDBXCmDWewJmTrDyGnaGtfbPg+7izDoDtbiLoNircowAsgfs6cEYoz4rrDZQGDX9++DoiZsyvO9tyLR91/f/nx8/vnFHGxF/Fpe1x3YPquw4f+As7VJE8jowHRxWNjauGRbgCTXU/zBMzt9nTTeq8VnJe1LO9oxqnqzYSehG+cech3rWezGmNUnsJirj26XZtjj4kwtHhDMAk1w2IspxGP1Fekm9ADD6StOLvomSb5jpmASd4rkK7OL+twzLQZU5lox6L0coGjBNUoFriB0qx9x1ZQsaKUfgnH2VMHKBw+p54G2h1b2OE9Lq8Tzya2gOMURJKjFDZi6ZmMG2GyW6cVPaoYwTcGektFt62Mnke4czb33rgiz8tKUViFtVzYTKHPlWnyc3LLbau8bHBc6eb8JDvJnuWVdL4PZ+ia8Y3V9w5tZqyuiIlWrZcrJ8uC6rKoKrRo/zf3QVg//4FpT0NIv11W6ox39NSncnbQl5K2VNZor0yYy35/RF3r+zcR87YNc014Ocfy7hH81j2kmt5ZjMp69XthZ+iT+fLDW3ygc2dsdNXSkv/L+B6drtugMbm9alVFsnt+Ue3rOGapZtfu8sEjrdumqCA0diP6x3mEB/q30ndyqdtdF9d/APNE3DQ=

This is equivalent to implementing the runtime code generated by the compiler yourself, so you need to add key

In the above example, I used the h function without adding a key, which caused a problem. I understand that a key needs to be added during the compilation process. So it is reasonable to add a key manually here.

However, if written in tsx , tsx should go through compilation and still not work.

           <Transition
              name="rotate"
            
            >
              {!isDark.value ? (
                <i
                  
                  class={'inline-block h-5 w-5 i-mingcute-sun-line'}
                />
              ) : (
                <i
                 
                  class={'inline-block h-5 w-5 i-mingcute-moon-line'}
                />
              )}
            </Transition>

https://vue-jsx.sxzz.moe/#PFRyYW5zaXRpb24KICAgICAgICAgICAgIG5hbWU9InJvdGF0ZSIKICAgICAgICAgICAgIAogICAgICAgICAgICA+CiAgICAgICAgICAgICAgeyFpc0RhcmsudmFsdWUgPyAoCiAgICAgICAgICAgICAgICA8aQogICAgICAgICAgICAgICAgICBjbGFzcz17J2lubGluZS1ibG9jayBoLTUgdy01IGktbWluZ2N1dGUtc3VuLWxpbmUnfQogICAgICAgICAgICAgICAgLz4KICAgICAgICAgICAgICApIDogKAogICAgICAgICAgICAgICAgPGkKICAgICAgICAgICAgICAgICAgY2xhc3M9eydpbmxpbmUtYmxvY2sgaC01IHctNSBpLW1pbmdjdXRlLW1vb24tbGluZSd9CiAgICAgICAgICAgICAgICAvPgogICAgICAgICAgICAgICl9CiAgICAgICAgICAgIDwvVHJhbnNpdGlvbj4=

This issue may be converted to @vue/babel-plugin-jsx