react / react/react-native

TypeError: pressability.getEventHandlers is not a function

Aperta
#43,935 5 commenti 0 reazioni 0 assegnatari Vedi su GitHub

Nessuno ha ancora preso questa issue.

Issue: Author Provided Repro
Lingua principale
C++
Stelle
127k
Fork
25.3k
Merge medio
1g 23h
PR unite (30g)
4

Descrizione

Description

While using the Pressable component in my component and testing it using @testing-library/react-native version 12.4.5, I am getting this issue as per the attached stack trace.

Steps to reproduce
  1. Testing the component - https://github.com/GetStream/stream-chat-react-native/blob/develop/package/src/components/Attachment/AudioAttachment.tsx with @testing-library/react-native version 12.4.5
React Native Version

0.73.6

Affected Platforms

Runtime - Android, Runtime - iOS

Output of npx react-native info
System:
  OS: macOS 14.3.1
  CPU: (12) arm64 Apple M2 Pro
  Memory: 1.01 GB / 32.00 GB
  Shell:
    version: "5.9"
    path: /bin/zsh
Binaries:
  Node:
    version: 18.19.0
    path: ~/.nvm/versions/node/v18.19.0/bin/node
  Yarn:
    version: 1.22.19
    path: /usr/local/bin/yarn
  npm:
    version: 7.24.2
    path: ~/Stream/stream-chat-react-native/node_modules/.bin/npm
  Watchman:
    version: 2024.01.22.00
    path: /opt/homebrew/bin/watchman
Managers:
  CocoaPods:
    version: 1.15.2
    path: /Users/khushalagarwal/.rvm/gems/ruby-3.1.2/bin/pod
SDKs:
  iOS SDK:
    Platforms:
      - DriverKit 23.4
      - iOS 17.4
      - macOS 14.4
      - tvOS 17.4
      - visionOS 1.1
      - watchOS 10.4
  Android SDK:
    API Levels:
      - "31"
      - "33"
      - "34"
    Build Tools:
      - 30.0.3
      - 31.0.0
      - 33.0.0
      - 33.0.1
      - 34.0.0
    System Images:
      - android-33 | Google APIs ARM 64 v8a
      - android-33 | Google Play ARM 64 v8a
      - android-34 | Google APIs ARM 64 v8a
    Android NDK: Not Found
IDEs:
  Android Studio: Not Found
  Xcode:
    version: 15.3/15E204a
    path: /usr/bin/xcodebuild
Languages:
  Java:
    version: 17.0.10
    path: /usr/bin/javac
  Ruby:
    version: 2.6.10
    path: /usr/bin/ruby
npmPackages:
  "@react-native-community/cli": Not Found
  react:
    installed: 18.2.0
    wanted: 18.2.0
  react-native:
    installed: 0.73.6
    wanted: 0.73.6
  react-native-macos: Not Found
npmGlobalPackages:
  "*react-native*": Not Found
Android:
  hermesEnabled: Not found
  newArchEnabled: Not found
iOS:
  hermesEnabled: Not found
  newArchEnabled: Not found
Stacktrace or Logs
TypeError: pressability.getEventHandlers is not a function

      52 |
      53 |     const onPlayPauseMock = jest.fn();
    > 54 |     render(
         |           ^
      55 |       getComponent({
      56 |         fileUploads: [generateFileUploadPreview({ type: 'audio/mp3' })],
      57 |         item: { file: { name: 'audio.mp3' }, paused: true, progress: 1 } as unknown as FileUpload,

      at getEventHandlers (node_modules/react-native/Libraries/Pressability/usePressability.js:49:53)
      at Pressable (node_modules/react-native/Libraries/Components/Pressable/Pressable.js:336:40)
      at Component (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:6351:18)
      at renderWithHooks (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:9150:20)
      at updateForwardRef (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:11361:16)
      at beginWork$1 (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:15811:12)
      at performUnitOfWork (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:15745:5)
      at workLoopSync (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:15717:7)
      at renderRootSync (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:15422:20)
      at callback (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:2597:22)
      at callback (node_modules/react/cjs/react.development.js:2667:24)
      at Object.flushActQueue [as act] (node_modules/react/cjs/react.development.js:2521:11)
      at act (node_modules/@testing-library/react-native/src/render-act.ts:11:21)
      at renderInternal (node_modules/@testing-library/react-native/src/render.tsx:58:33)
      at renderInternal (node_modules/@testing-library/react-native/src/render.tsx:29:10)
      
      console.error
    The above error occurred in the <Pressable> component:
    
        at accessible (/Users/khushalagarwal/Stream/stream-chat-react-native/package/node_modules/react-native/Libraries/Components/Pressable/Pressable.js:206:5)
        at View
        at Component (/Users/khushalagarwal/Stream/stream-chat-react-native/package/node_modules/react-native/jest/mockComponent.js:30:18)
        at item (/Users/khushalagarwal/Stream/stream-chat-react-native/package/src/components/Attachment/AudioAttachment.tsx:84:11)
        at AudioAttachment{messageInput{audioAttachment}}
        at children (/Users/khushalagarwal/Stream/stream-chat-react-native/package/src/contexts/themeContext/ThemeContext.tsx:48:11)
    
    Consider adding an error boundary to your tree to customize error handling behavior.
    Visit https://reactjs.org/link/error-boundaries to learn more about error boundaries.


### Reproducer

https://github.com/GetStream/stream-chat-react-native/pull/2475

### Screenshots and Videos

_No response_

Guida per i contributori

Apri la guida per i contributori

Come iniziare

  1. Leggi tutta la issue e poi la guida ai contributi del progetto.
  2. Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
  3. Fai un fork del repository e lavora su un branch.
  4. Apri una pull request che faccia riferimento al numero della issue.

Direzione di ricerca

Inizia eseguendo il riproduttore del test in PR #2475 e ispeziona package/src/components/Attachment/AudioAttachment.tsx. Segui il fallimento attraverso react-native/Libraries/Pressability/usePressability.js e Pressable.js, quindi verifica che il test pertinente venga renderizzato correttamente senza il TypeError.

Scritto dal modello di indicizzazione a partire dal testo della issue.

Valutazione

Stack tecnologico
react-native, typescript
Ambito
mobile-dev, testing-qa
Tipo di issue
Bug
Difficoltà
4/5
Tempo stimato
3-5 giorni
Stato di attività
Ferma
Chiarezza
Abbastanza chiara
Idoneità per principianti
32/100

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.