Invalid dropdown position when append-to-body is true

[Eternal-Rise]

Please respect maintainers time by filling in these sections. Your issue will likely be closed without this information.

• Vue Version: ^2
• Vue Select Version: ^3
• Chrome

Describe the bug
When we set the page height to 100vh/100% (which is a common behavior), the dropdown list will be rendered with incorrect positioning. This happens because the appearance of the dropdown list triggers the appearance of a scrollbar, so getBoundingClientRect will return the position of the select element taking the scrollbar into account. However, once the dropdown list appears in its designated position, there will be no scrollbar (and we won't even notice its appearance), causing the positioning to be incorrect.

Reproduction Link
https://codepen.io/Eternal_Rise/pen/bGQLQQm

Steps To Reproduce

1. Toggle select - renders correctly
2. Second and all following toggle - renders incorrectly

Expected behavior
Dropdown list should renders properly

Screenshots

Possible solution
Add extra class for dropdown list when append-to-body is true, and set default "top" to 0.

[mylmz10]

same issue