VueJS加价:
<v-menu
lazy
:close-on-content-click="false"
v-model="modal"
transition="scale-transition"
offset-y
full-width
:nudge-right="40"
max-width="290px"
min-width="290px">
<v-text-field
slot="activator"
label="Issue Date"
v-model="date"
append-icon="event"
readonly
>
</v-text-field>
<v-date-picker v-model="date" no-title scrollable actions>
<template scope="{ save, cancel }">
<v-card-actions>
<v-spacer></v-spacer>
<v-btn flat color="primary" @click="cancel">Cancel</v-btn>
<v-btn flat color="primary" @click="save">OK</v-btn>
</v-card-actions>
</template>
</v-date-picker>
</v-menu>
HTML:
`<div class="menu__activator">
<div data-v-386ef34c="" class="input-group input-group--dirty input-group--append-icon input-group--text-field">
<label>Issue Date</label>
<div class="input-group__input">
<input readonly="readonly" tabindex="0" aria-label="Issue Date" type="text">
<i aria-hidden="true" class="material-icons icon input-group__append-icon input-group__icon-cb">event</i>
</div>
<div class="input-group__details">
<div class="input-group__messages"></div>
</div>
</div>
</div>`
它在浏览器中的显示方式:
我想写e2e来断言日历日期的某些逻辑。生成日期的时刻与当天匹配。但是我无法弄清楚如何使用xpath访问该文本值。
获取元素的Xpath:
$x('//div[contains(@class, "input-group--text-field")]//input[@readonly]')
元素在开发者控制台中的显示方式:
我需要的属性位于最底层:
我试过的Xpaths导致空数组:
$x('//div[contains(@class, "input-group--text-field")]//input[@readonly]//@value')
$x('//div[contains(@class, "input-group--text-field")]//input[@readonly]/@value')
$x('//div[contains(@class, "input-group--text-field")]//input[@readonly][0]//@value')
编辑: 管理以获取chrome控制台中的值:
$x('//div[contains(@class, "input-group--text-field")]//input[@aria-label="Issue Date"]')[0].value
但仍在与守夜人挣扎
欢迎使用xpath或css的任何解决方案!谢谢!
答案 0 :(得分:0)
不得不进口柴,但这终于奏效了:
.getValue('//div[contains(@class, "input-group--text-field")]//input[@aria-label="Issue Date"]', function(result) {
expect(result.value).to.equal('2017-10-17')
})