QSelect no-option template does not work with Typescript

engineertdog commented 1 year ago

What happened?

When reproducing the Github example layout, everyone except for the no-option template for QSelect works. What I've noticed is that vanilla JavaScript allows the template to work. However, when the Search bar is converted to TypeScript, the no-option template no longer works.

When you click on the search bar for the first time, it should display the contents of the no-option template. When the refs and functions for the search bar are converted to TypeScript, the contents of the no-option template no longer display. There are no errors in the log when this occurs.

What did you expect to happen?

When you convert the QSelect component's refs and functions to TypeScript, I would expect that the no-option template continues to work as it did with vanilla JavaScript.

Reproduction URL

https://github.com/engineertdog/quasar-qselect-demo

How to reproduce?

Clone reproduction repository
Run npm install
Run quasar dev
Click on the search bar

Flavour

Quasar CLI with Webpack (@quasar/cli | @quasar/app-webpack)

Areas

Components (quasar), TypeScript Support

Platforms/Browsers

Firefox

Quasar info output

Operating System - Windows_NT(10.0.22621) - win32/x64
NodeJs - 18.7.0

Global packages
  NPM - 8.15.0
  yarn - 1.22.15
  @quasar/cli - 1.3.2
  @quasar/icongenie - Not installed
  cordova - Not installed

Important local packages
  quasar - 2.10.0 -- Build high-performance VueJS user interfaces (SPA, PWA, SSR, Mobile and Desktop) in record time
  @quasar/app-webpack - 3.6.2 -- Quasar Framework App CLI with Webpack
  @quasar/extras - 1.15.5 -- Quasar Framework fonts, icons and animations
  eslint-plugin-quasar - Not installed
  vue - 3.2.41 -- The progressive JavaScript framework for building modern web UI.
  vue-router - 4.1.5
  pinia - 2.0.23 -- Intuitive, type safe and flexible Store for Vue
  vuex - Not installed
  electron - Not installed
  electron-packager - Not installed
  electron-builder - Not installed
  @babel/core - 7.19.3 -- Babel compiler core.
  webpack - 5.74.0 -- Packs CommonJs/AMD modules for the browser. Allows to split your codebase into multiple bundles, which can be loaded on demand. Support loaders to preprocess files, i.e. json, jsx, es7, css, less, ... and your custom stuff.
  webpack-dev-server - 4.9.3 -- Serves a webpack app. Updates the browser on changes.
  workbox-webpack-plugin - Not installed
  register-service-worker - 1.7.2 -- Script for registering service worker, with hooks
  typescript - 4.5.5 -- TypeScript is a language for application scale JavaScript development
  @capacitor/core - Not installed
  @capacitor/cli - Not installed
  @capacitor/android - Not installed
  @capacitor/ios - Not installed

Quasar App Extensions
  *None installed*

Relevant log output

No response

Additional context

No response

pdanpdan commented 1 year ago

please make your reproduction work and we'll reopen

engineertdog commented 1 year ago

Codesandbox doesn't work as it should. I've replaced the reproduction URL with a repository with the issue.

quasarframework / quasar