Breaking Change in Rendering v-textarea (and others components) with Node-RED Dashboard v1.16

[andrea-tomassi]

Current Behavior

After upgrading to @flowfuse/node-red-dashboard v1.16, the v-textarea with v-model="form.body" template no longer works as it did in v1.14.

In version 1.16, the v-textarea appears as shown in the image below:

The same apply to many similar components.

Expected Behavior

In version 1.14, the widget displayed correctly as shown in the image below:

Steps To Reproduce

Use this widged code:

<template>
  <v-textarea v-model="form.body" label="Body"></v-textarea>
</template>

<script>
export default {
  data() {
    return {
      form: {
        body: ''
      }
    }
  }
}
</script>

Environment

• Dashboard version: 1.16.0
• Node-RED version: 4.0.2
• Node.js version: 20.x
• npm version:
• Platform/OS: Ubuntu
• Browser: Chrome

Have you provided an initial effort estimate for this issue?

I have provided an initial effort estimate

[joepavitt]

Thanks for raising,I suspect, although haven't investigated in detail that some underlying Vuetify CSS has changed when we;'ve done our version bump which impacts this.