Ionic 来自fireEvent.click@testing-library/angular的www.example.com()不适用于“离子按钮”组件,但适用于正常按钮

hiz5n14c  于 2022-12-08  发布在  Ionic
关注(0)|答案(1)|浏览(162)

我正在使用Ionic Angular开发一个应用程序。当我使用@testing-library/angular进行测试时,该测试不适用于ion-button,但适用于正常的button字段。问题可能是什么?

**fireEvent.click()**事件对以下代码不起作用(离子角):

<ion-button data-testid="button-submit" class="login-submit-btt" type="submit" size="large">Test</ion-button>

和**fireEvent.click()**事件一起使用的代码如下:

<button data-testid="button-submit" class="login-submit-btt" type="submit" size="large">Test</button>

我用于测试的代码如下:

import {
  LoginFormData,
  LoginFormPresentationComponent,
} from './login-form.component';
import { fireEvent, render, screen } from '@testing-library/angular';
import { ReactiveFormsModule } from '@angular/forms';
import { IonicModule } from '@ionic/angular';

test('Login button should not be disabled', async () => {
  const loginData: LoginFormData = {
    login: 'dev',
    password: 'dev',
    stayLoggedIn: false,
  };
  await render(LoginFormPresentationComponent, {
    componentProperties: {
      loginData: loginData,
      commitChanges: {
        // because the output is an `EventEmitter` we must mock `emit`
        // the component uses `output.emit` to interact with the parent component
        emit: submitAction,
      } as any,
    },
    imports: [ReactiveFormsModule, IonicModule], 
  });

  fireEvent.click(screen.getByTestId('button-submit'));
  expect(submitAction).toHaveBeenCalledWith(loginData);
});

我使用的版本:

"@angular/cli": "~14.1.1",
 .....
"@testing-library/angular": "12.1.2",
"@testing-library/dom": "^8.17.1",
"@testing-library/user-event": "^14.4.3",
"@ionic/angular": "6.2.5",
"@ionic/core": "6.2.5",
 .....
7qhs6swi

7qhs6swi1#

我不确定ionic是如何工作的,但可能是它们没有监听本机的click事件。尝试使用user-event而不是fireEvent。这代表一个“真实的”用户,它不仅触发一个click事件,而且触发更多的事件。
https://testing-library.com/docs/user-event/intro

相关问题