DRAFT: Upgrade @testing-library/user-event to v14.5.2 (#2547)

package.json

@@ -154,7 +154,7 @@
     "@testing-library/dom": "^10.4.0",
     "@testing-library/jest-dom": "^6.6.2",
     "@testing-library/react": "^12.1.5",
-    "@testing-library/user-event": "^13.5.0",
+    "@testing-library/user-event": "^14.5.2",
     "@total-typescript/ts-reset": "^0.6.1",
     "@trivago/prettier-plugin-sort-imports": "^4.3.0",
     "@types/classnames": "^2.3.4",

src/components/__tests__/Bullet.ts

@@ -158,7 +158,8 @@ describe('expansion', () => {
 
     const bulletOfThoughtB = getBulletByContext(['a', 'b'])
 
-    userEvent.click(bulletOfThoughtB)
+    const user = userEvent.setup({ delay: null })
+    await user.click(bulletOfThoughtB)
 
     const thoughtCursor = await findCursor()
     expect(thoughtCursor).toHaveTextContent('a')
@@ -180,7 +181,8 @@ describe('expansion', () => {
 
     const bulletOfThoughtA = getBulletByContext(['x', 'a'])
 
-    userEvent.click(bulletOfThoughtA)
+    const user = userEvent.setup({ delay: null })
+    await user.click(bulletOfThoughtA)
 
     const thoughtCursor = await findCursor()
     expect(thoughtCursor).toHaveTextContent('x')
@@ -201,7 +203,8 @@ describe('expansion', () => {
 
     const bulletOfThoughtA = getBulletByContext(['a'])
 
-    userEvent.click(bulletOfThoughtA)
+    const user = userEvent.setup({ delay: null })
+    await user.click(bulletOfThoughtA)
 
     const thoughtCursor = await findCursor()
     expect(thoughtCursor).toBeNull()
@@ -221,7 +224,8 @@ describe('expansion', () => {
 
     const bulletOfThoughtB = getBulletByContext(['a', 'b'])
 
-    userEvent.click(bulletOfThoughtB)
+    const user = userEvent.setup({ delay: null })
+    await user.click(bulletOfThoughtB)
 
     const thoughtCursor = await findCursor()
     expect(thoughtCursor).toHaveTextContent('b')
@@ -244,7 +248,8 @@ describe('expansion', () => {
 
     const bulletOfThoughtB = getBulletByContext(['a', 'b'])
 
-    userEvent.click(bulletOfThoughtB)
+    const user = userEvent.setup({ delay: null })
+    await user.click(bulletOfThoughtB)
 
     const exported = exportContext(store.getState(), [HOME_TOKEN], 'text/plain')
     expect(exported).toEqual(`- __ROOT__
@@ -268,7 +273,8 @@ describe('expansion', () => {
 
     const bulletOfThoughtB = getBulletByContext(['a', 'b'])
 
-    userEvent.click(bulletOfThoughtB)
+    const user = userEvent.setup({ delay: null })
+    await user.click(bulletOfThoughtB)
 
     const exported = exportContext(store.getState(), [HOME_TOKEN], 'text/plain')
     expect(exported).toEqual(`- __ROOT__
@@ -297,7 +303,8 @@ describe('expansion', () => {
 
     const bulletOfThoughtB = getBulletByContext(['a', 'b'])
 
-    userEvent.click(bulletOfThoughtB)
+    const user = userEvent.setup({ delay: null })
+    await user.click(bulletOfThoughtB)
 
     const exported = exportContext(store.getState(), [HOME_TOKEN], 'text/plain')
     expect(exported).toEqual(`- __ROOT__

src/components/__tests__/Divider.ts

@@ -14,26 +14,22 @@ describe('Divider', () => {
       windowEvent('keydown', { key: 'Enter' })
     })
 
+    const user = userEvent.setup({ delay: null })
+
     const editable = await findThoughtByText('')
 
     // '-' is not a divider
-    await act(async () => {
-      userEvent.type(editable!, '-')
-    })
+    await user.type(editable!, '-')
     const divider1 = screen.queryByLabelText('divider')
     expect(divider1).toBeNull()
 
     // '--' is not a divider
-    await act(async () => {
-      userEvent.type(editable!, '-')
-    })
+    await user.type(editable!, '-')
     const divider2 = screen.queryByLabelText('divider')
     expect(divider2).toBeNull()
 
     // '--' is a divider
-    await act(async () => {
-      userEvent.type(editable!, '-')
-    })
+    await user.type(editable!, '-')
     const divider3 = screen.queryByLabelText('divider')
     expect(divider3).toBeTruthy()
   })

src/components/__tests__/let-focus.ts

@@ -28,7 +28,10 @@ it.skip('define =focus/Zoom in a =let expression and apply it to a thought', asy
   // Set the cursor on `a`, wait for the animation to complete, then `a` should have the zoomCursor
   // TODO: Find a way to detect if b is actually hidden
   const thoughtA = (await findThoughtByText('a')) as HTMLElement
-  userEvent.click(thoughtA)
+
+  const user = userEvent.setup({ delay: null })
+  await user.click(thoughtA)
+
   expect(subthoughts).toHaveClass('zoomCursor')
 })
 
@@ -49,6 +52,8 @@ it.skip('=focus/Zoom/=style', async () => {
   const thoughtA = (await findThoughtByText('apple'))!.closest('[aria-label="child"]')!
   expect(thoughtA).not.toHaveStyle({ color: 'rgba(255, 192, 203, 1)' })
 
-  userEvent.click(thoughtA)
+  const user = userEvent.setup({ delay: null })
+  await user.click(thoughtA)
+
   expect(thoughtA).toHaveStyle({ color: 'rgba(255, 192, 203, 1)' })
 })

yarn.lock

@@ -4914,14 +4914,12 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@testing-library/user-event@npm:^13.5.0":
-  version: 13.5.0
-  resolution: "@testing-library/user-event@npm:13.5.0"
-  dependencies:
-    "@babel/runtime": "npm:^7.12.5"
+"@testing-library/user-event@npm:^14.5.2":
+  version: 14.5.2
+  resolution: "@testing-library/user-event@npm:14.5.2"
   peerDependencies:
     "@testing-library/dom": ">=7.21.4"
-  checksum: 10c0/ff57edaeab31322c80c3f01d55404b4cebb907b9ec7672b96a1a14d053f172046b01c5f27b45677927ebee8ed91bce695a7d09edec9a48875cfacabe39d0426a
+  checksum: 10c0/68a0c2aa28a3c8e6eb05cafee29705438d7d8a9427423ce5064d44f19c29e89b5636de46dd2f28620fb10abba75c67130185bbc3aa23ac1163a227a5f36641e1
   languageName: node
   linkType: hard
 
@@ -8629,7 +8627,7 @@ __metadata:
     "@testing-library/dom": "npm:^10.4.0"
     "@testing-library/jest-dom": "npm:^6.6.2"
     "@testing-library/react": "npm:^12.1.5"
-    "@testing-library/user-event": "npm:^13.5.0"
+    "@testing-library/user-event": "npm:^14.5.2"
     "@total-typescript/ts-reset": "npm:^0.6.1"
     "@trivago/prettier-plugin-sort-imports": "npm:^4.3.0"
     "@types/classnames": "npm:^2.3.4"