1

我正在为我的 VueJs/Laravel 应用程序使用 Laravel Dusk 开发一些浏览器测试。我正在尝试“检查”一个复选框，但我遇到了问题。我设法等待它的父元素可见，但是当我检查复选框并断言值以查看它是否为真时，我得到一个错误。

我的测试文件

$this->browse(function ($browser) {
        
        $browser->visit(route('login'))
                ->assertPathIs('/login')
                ->type('email', $this->user->email)
                ->type('password', 'password')
                ->press(trans('auth.login'))
                ->assertPathIs('/dashboard')
                ->visit(route('settings.edit', $this->customer->uuid))
                ->assertPathIs('/settings/edit/'.$this->customer->uuid)
                ->whenAvailable('@switch-input-tfa', function() use ($browser) {
                    $browser->check('switch-input')
                            ->pause(2000)  
                            //This fails                            
                            ->assertInputValue('switch-input', true);
                }, 4)
                ->press(trans('nav-side.logout'))
                ->assertPathIs('/login');


    });

Vue JS 文件

<div class="flex">
    <h3 class="flex-grow text-lg leading-6 font-medium text-gray-900 mb-2">
        {{ __('settings.2fa_global') }}
    </h3>
    <switch-input
        dusk="switch-input-tfa"
        v-model="form.tfa_enabled"
        @change="settingChanged($event,'tfa_enabled')"
        show-icons
        :inactive-value="false"
        :active-value="true"
        inactive-icon="times"
        active-icon="check"
        :show-on-right="false"
    />
</div>

开关量输入元件

<div>
    <input name="switch-input" 
           class="w-full h-full absolute inset-0 opacity-0" 
           type="checkbox" 
           @change="handleChange" 
           ref="input" 
           v-bind="$attrs" 
           :class="[$attrs.disabled ? '' : 'cursor-pointer']"
    >
</div>

错误信息

[switch-input] 输入的预期值 [1] 不等于实际值 [on]。断言 'on' 与预期的 true 匹配失败。

我也尝试了“取消选中”功能，但我仍然得到与实际值为 ON 相同的错误

4

0 回答 0