> ## Content Index
> Fetch the complete content index at: https://blog.anthea.day/llms.txt
> Use this file to discover other available public pages before exploring further.

# Debug 日記：setPointerCapture is not a function：React Testing Library 中 userEvent 與 vaul 庫的相容性問題
- URL: https://blog.anthea.day/debug-e6-97-a5-e8-a8-98-setpointercapture-is-not-a-function/
- Published: 2025-07-18T06:01:52.000Z
- Updated: 2026-11-07T20:07:45.000Z
- Author: Anthea / 芫荽
- Tags: #Migrated-1792241843742, #Import 2026-10-17 12:57, Coding

最近在為一個使用 shadcnDrawer 的 React component 寫測試時，遇到了一個令人困惑的問題：當我使用 `fireEvent.click()` 撰寫測試時會正常通過，但改成使用 `userEvent.click()` 卻出現錯誤：

![](https://blog.anthea.day/content/images/2026/10/1-u8m6ompfqoohtgvnttkjbg.png)

---

### 問題一：setPointerCapture is not a function

當使用 `userEvent` 進行測試時，會出現第一個錯誤：

![](https://blog.anthea.day/content/images/2026/10/1-vlki-7c0_vwlk4xrh9sjtw.png)

從 stack trace 的 `node_modules/vaul/dist/index.js:990:22` 可以看出，vaul 庫在 `onPress` 函數中嘗試呼叫 `setPointerCapture` API，但在 JSDOM 測試環境中這個 API 不存在，導致測試失敗。

而這個 vaul library 其實是 MUI Drawer 所需要的依賴，因此我才遇到這個錯誤。

那為什麼 `userEvent` 才會遇到問題， `fireEvent` 卻不會呢？

#### userEvent vs fireEvent 的差異

- `fireEvent` ：直接觸發 DOM 事件，不會觸發 vaul 的邏輯
- `userEvent` ：模擬真實使用者行為，包括 pointerdown、pointermove 等事件，觸發了 vaul 的機制

#### 要怎麼修好他

測試中加入 pointer capture API 的 polyfill：

![](https://blog.anthea.day/content/images/2026/10/1-xhx47inhl8lgtukcprpvea.png)

---

### 問題二：Cannot read properties of undefined (reading ‘match’)

修復第一個問題後，可能會遇到第二個錯誤：

![](https://blog.anthea.day/content/images/2026/10/1-gax4m0kaivjllytnewtwuq.png)

#### 為什麼會發生這個錯誤？

從 stack trace 的 `node_modules/vaul/dist/index.js:426:25` 可以看出，問題發生在 `getTranslate` 函數中：

![](https://blog.anthea.day/content/images/2026/10/1-pyhds1ak5dje_oozom1pkq.png)

JSDOM 的 `getComputedStyle()` 對於 `transform` 屬性回傳 `undefined`，當 vaul 嘗試對 `undefined` 呼叫 `.match()` 方法時就會出錯。

#### 要怎麼修好他

在測試中 mock `getComputedStyle` 的 transform 屬性：

![](https://blog.anthea.day/content/images/2026/10/1-rq940s8zjqoximlbrzzwcq.png)

---

希望今天的文章對你有幫助，我們下次見 👋🏻