QSelect don't open the dropdown after Update to 1.12.5

[marco-quintella]

Describe the bug After update from 1.11.3 to 1.12.5 the QSelects in my application stopped to open the options. When you click it gets the focus and doesn't open the dropdown and stay styled as it still has the focus. When I revert the update to 1.11.3 it is back to work.

Checked with other components using QSelect and found some working and most of it not. I could not find a reason why some work and some not, since all of them are carrying the right data when inspected with Vue Dev Tools.

Codepen/jsFiddle/Codesandbox (required) I could not reproduce it in Codesandbox but I can give access to the repo where this is happening. This is one of components where this is happening.

<template lang="pug">
  q-select(ref='select' :value='value' :rules='rules' :options='options' :label='label' :readonly='readonly' use-input emit-value map-options options-dense @input='handleInput')
    template(v-slot:no-option)
      q-item
        q-item-section.text-grey Nenhum Resultado
</template>
<script lang='ts'>
import { QInput } from 'quasar'
import { ValidationRule, SelectOption } from 'src/typings/quasar'
import TextToUser from 'utils/TextToUser'
import { Component, Prop, Vue } from 'vue-property-decorator'

@Component
export default class SelectFormaDePagamento extends Vue {
  @Prop({ default: '' }) value?: string;
  @Prop({ default: false }) required?: boolean;
  @Prop({ default: false }) readonly?: boolean;
  @Prop({ default: 'Forma de Pagamento' }) label?: string;

  options: SelectOption[] = [
    {
      label: 'Cartão de Crédito',
      value: 'Cartão de Crédito'
    },
    {
      label: 'Cartão de Débito',
      value: 'Cartão de Débito'
    },
    {
      label: 'Cheque',
      value: 'Cheque'
    },
    {
      label: 'Cobrança Bancária',
      value: 'Cobrança Bancária'
    },
    {
      label: 'Dinheiro',
      value: 'Dinheiro'
    }
  ];

  $refs!: {
    select: QInput;
  };

  get rules (): ValidationRule[] {
    const rls: ValidationRule[] = []
    if (this.required) rls.push(val => !!val || TextToUser.obrigatorio)
    return rls
  }

  get hasError (): boolean {
    this.$refs.select.validate()
    return this.$refs.select.hasError
  }

  handleInput (newVal: string): void {
    this.$emit('input', newVal)
  }

  validate (): boolean | Promise<boolean> {
    return this.$refs.select.validate()
  }

  focus (): void {
    return this.$refs.select.focus()
  }
}
</script>

Expected behavior The options get shown when the component its clicked.

Screenshots https://www.youtube.com/watch?v=HH7Pyg99TUQ

Platform (please complete the following information): OS: Windows 10 Node: 12.14.0 NPM: 6.13.4 Yarn: 1.21.1 Browsers: Chrome 83

[pdanpdan]

Duplicate of #7240