quasar: [v1] QSelect does not accept data attributes anymore since beta-20

Since beta-20 QSelect does not accept data attributes anymore, for example, prior to beta-20:

QSelect(
 ...
 data-cy="select-element"
)

would apply the data-cy attribute to the select. Since beta-20, the data-cy attribute is not added anymore to the element in the DOM.

1.0.0-beta.20

Global packages NPM - 6.9.0 yarn - 1.13.0 @quasar/cli - 1.0.0-beta.4 cordova - Not installed

Important local packages quasar - 1.0.0-beta.20 – High performance, Material Design 2, full front end stack with Vue.js – build SPA, SSR, PWA, Hybrid Mobile Apps and Electron apps, all simultaneously using the same codebase @quasar/app - 1.0.0-beta.22 – Quasar Framework App CLI @quasar/extras - 1.1.1 – Quasar Framework fonts, icons and animations vue - 2.6.10 – Reactive, component-oriented view layer for modern web interfaces. vue-router - 3.0.6 – Official router for Vue.js 2 vuex - 3.1.0 – state management for Vue.js electron - Not installed electron-packager - Not installed electron-builder - Not installed @babel/core - 7.3.4 – Babel compiler core. webpack - 4.30.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 - 3.3.1 – Serves a webpack app. Updates the browser on changes. workbox-webpack-plugin - 4.3.0 – A plugin for your Webpack build process, helping you generate a manifest of local files that workbox-sw should precache. register-service-worker - 1.6.2 – Script for registering service worker, with hooks

Quasar App Extensions @quasar/quasar-app-extension-testing-unit-jest - 1.0.0-beta.14 – A Quasar App Extension for running Jest tests @quasar/quasar-app-extension-testing-e2e-cypress - 1.0.0-beta.5 – A Quasar App Extension for Cypress e2e @quasar/quasar-app-extension-testing - 1.0.0-beta.7 – A Quasar App Extension for managing Test Harnesses

Pen

https://codepen.io/anon/pen/NmQZWr

About this issue

  • Original URL
  • State: closed
  • Created 5 years ago
  • Comments: 15 (7 by maintainers)

Most upvoted comments

For anyone in need of a solution, just hack the thing like this

import { QSelect } from 'quasar';

export default {
  functional: true,
  components: { QSelect },

  render(createElement, context) {
    return createElement('div', {
      attrs: {
        'data-cy': context.data.attrs['data-cy'],
      },
    },
    [createElement(QSelect, {
      ...context.data,
    }]
})}};