TabItem Does Not Obey Ordering with v-for and key

[Skinner927]

Overview of the problem

Buefy version: v0.7.5
Vuejs version: v2.6.10
OS/Browser: MacOS 10.14.4/Chrome 73.0.3683.103

Description

When using v-for with key on b-tab-item the order of the tabs is incorrect if items are removed and added back.

Steps to reproduce

I've made a demo: https://codepen.io/Skinner927/pen/vwNYLp

1. Observe the proper sorted order of the tabs: "April, Bob, Stan".
2. Click the "Remove Bob" button
3. Click the "Add Bob Back" button
4. Observe the order of the tabs is now "April, Stan, Bob" which is incorrect. The ul list (at the top under "Sorted:") uses the same key mechanism and is properly sorted.

Expected behavior

For the order of tabs to be in the same order as the underlying array.

Actual behavior

Because v-for is only adding the missing elements, b-tab-item's created() method always appends new items to the end of the tab list.

[service-paradis]

We get the same thing if we use v-if on tab-item. Even if the Books tab is before Videos, it will be displayed at the end when showing it.

ex.
https://codepen.io/service-paradis/pen/LYPQozm?&editable=true&editors=101

I'm working on it right now. I'm doing some tests, but should be able to make a PR tomorrow!

[service-paradis]

Created a PR that should solve this problem (#1535)