英文:
How to assign id to quasar input validation error message?
问题
我想要使用Selenium测试来检查我的q-input下是否出现错误消息,为此我需要它有一个id,这样我就可以找到该Webelement:
<q-input v-model="emailInput" 
     :rules="[(val) => validateEmail(val) || 'Valós email címet adj meg.']"
     for="username" label="Email" square type="email">  
</q-input>
我想要的只是在具有role="alert"的这个div上添加一个id,以便能够获取其文本并进行断言。
有办法做到这一点吗?
英文:
I want to check with Selenium test if the error message appears under my q-input or not, for this I would need it to have an id, so I can find the Webelement:
 <q-input v-model="emailInput" 
      :rules="[(val) => validateEmail(val) || 'Valós email címet adj meg.']"
      for="username" label="Email" square type="email">  
 </q-input>
All I want is to add an id somehow to this div that has role="alert" to be able to get it text and assert.
Is there a way to do this?
答案1
得分: 1
<div id="q-app" style="min-height: 100vh">
  <div class="q-pa-md" style="max-width: 300px">
    <q-input
      ref="inputRef"
      v-model="model"
      filled
      label="在此输入"
      hint="最多3个字符"
      bottom-slots
      :error="!isValid"
    >
      <template #error>
        <div id="error-alert">自定义错误消息</div>
      </template>
    </q-input>
  </div>
</div>
英文:
You could add a slot for error messages to the q-input and add id to your own custom alert element
<div id="q-app" style="min-height: 100vh">
  <div class="q-pa-md" style="max-width: 300px">
    <q-input
      ref="inputRef"
      v-model="model"
      filled
      label="Type here"
      hint="Max 3 characters"
      bottom-slots
      :error="!isValid"
    >
      <template #error>
        <div id="error-alert">custom error message</div>
      </template>
    </q-input>
  </div>
</div>
Alternatively, you could select the q-input by id and then xpath to the child alert element.
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。



评论