[Bug Report] v-tabs slider disappears for nested routes or route with query when optional

Environment

Vuetify Version: 2.3.10 Vue Version: 2.6.12 Browsers: Chrome 85.0.4183.102 OS: Windows 10

Steps to reproduce

Route with query:

• Click “Go to /bar”
• Click “Go to /bar?q=42”

Nested route:

• Click “Go to /bar/42”
• Click “Go to /bar”

Expected Behavior

Optional v-tabs should ignore the query params and only consider the route path when matching tab items (e.g. /bar should match /bar?q=42). Additionally, when v-tab are not exact, the slider should remain when a tab matches the current route as prefix (e.g. /bar should match /bar/42 when exact: false).

Actual Behavior

In both cases, the tabs slider disappears by alternance when navigating between routes starting by /bar.

Reproduction Link

https://codepen.io/simonbrunel/pen/mdPQBbV

[simonbrunel]

@econic As a workaround, you can explicitly compute the v-tabs value: it needs to be the route full path but with a trailing / added to the route path:

<template>
  <v-tabs :value="value" optional>
    <v-tab v-for="(item, index) in items"  :key="index" :to="item.to" :exact="item.exact">
      {{ item.text }}
    </v-tab>
  </v-tabs>
</template>

  computed: {
    value() {
      const path = this.$route.path;
      const full = this.$route.fullPath;
      return path[path.length - 1] !== '/' ?
        `${path}/${full.substring(path.length)}` :
        full;
    },
  }

Codepen: https://codepen.io/simonbrunel/pen/eYZapLP

[KaelWD]

Duplicate of #14156