chore: MultiCombobox の E2E テストを単体テストで書き直す

[s-sasaki-0529]

関連URL

• チケット
  • https://smarthr.atlassian.net/browse/SHRUI-1058
• 関連ドキュメント
  • https://smarthr-inc.docbase.io/posts/3540935

概要

MultiComboBox コンポーネントには E2E テストがありますが、基本的には単体テストで十分なテストであるため、単体テスト(testing-library) に移植します。

これによって、 CI で時間がかかっている E2E テストのコスト削減及び、暗黙に発生している Storybook への依存の削減、自動テスト全体のポリシー整備を行います。

変更内容

• E2E テスト側を削除
• 同程度の内容の単体テストを実装

やらなかったこと

現行のE2Eテストにある以下のテストシナリオは単体テストで再現できませんでした。JSDOM に IntersectionObserver が実装されていないためです。

test('部分的レンダリングしているアイテム数がスクロールにより順次増加すること', async (t) => {
  const combobox = Selector('[data-test=multi-combobox-many]')
  const comboboxControls = ((await combobox.getAttribute('aria-controls')) || '').split(' ')
  const listbox = elementWithId(comboboxControls[0])

  await t
    .click(combobox)
    .expect(listbox.find('.smarthr-ui-ComboBox-selectButton').count)
    .eql(100)
    .scroll(listbox, 'bottom')
    .expect(listbox.find('.smarthr-ui-ComboBox-selectButton').count)
    .eql(200)
    .scroll(listbox, 'bottom')
    .expect(listbox.find('.smarthr-ui-ComboBox-selectButton').count)
    .eql(300)
})

最初の調査で見逃してしまってて恐縮なんですが、これのために testcafe を残すというのもつらいので、本PRにおいてはなくなく削除してます。Playwright による新しい E2E があるので、そちらで改めて対応すべきかは別途検討します。

確認方法

テストコードのみなのでCIが通ればOKです。

備考

基本的には以下の SingleCombobox のときのコピペをベースにしてます。

• chore: SingleComboBox の E2E テストを単体テストで書き直す #5006

[pkg-pr-new]

Open in Stackblitz

pnpm add https://pkg.pr.new/kufu/smarthr-ui@5021

commit: 3345256