Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

【iOS】The contentOffset property is missing from TextInputView's onScroll callback #43428

Closed
rabbitmouse opened this issue Mar 12, 2024 · 4 comments
Labels
Component: TextInput Related to the TextInput component. Platform: iOS iOS applications. Resolution: PR Submitted A pull request with a fix has been provided. Type: New Architecture Issues and PRs related to new architecture (Fabric/Turbo Modules)

Comments

@rabbitmouse
Copy link

rabbitmouse commented Mar 12, 2024

Description

I found that in the onScroll callback of textInput, the old schema contained the contentOffset attribute, but the new schema did not, causing a crash!

Steps to reproduce

const onInputScroll = (e) => {
    if (Platform.OS !== "web") {
      const {
        nativeEvent: {
          contentOffset: { x, y },
        },
      } = e;
      console.log('onInputScroll ====', e?.nativeEvent)
    }
  };

<TextInput
        onScroll={onInputScroll}
        ref={inputRef}
        multiline
>

React Native Version

0.73.3

Affected Platforms

Runtime - iOS

Areas

Fabric - The New Renderer

Output of npx react-native info

OS: macOS 14.1
  CPU: (8) arm64 Apple M1 Pro
  Memory: 109.81 MB / 16.00 GB
  Shell:
    version: "5.9"
    path: /bin/zsh
Binaries:
  Node:
    version: 21.6.1
    path: ~/.nvm/versions/node/v21.6.1/bin/node
  Yarn:
    version: 1.22.19
    path: /opt/homebrew/bin/yarn
  npm:
    version: 10.2.4
    path: ~/.nvm/versions/node/v21.6.1/bin/npm
  Watchman:
    version: 2023.09.18.00
    path: /opt/homebrew/bin/watchman
Managers:
  CocoaPods:
    version: 1.12.1
    path: /Users/zhuzhiqin/.rvm/gems/ruby-2.7.2/bin/pod
SDKs:
  iOS SDK:
    Platforms:
      - DriverKit 23.0
      - iOS 17.0
      - macOS 14.0
      - tvOS 17.0
      - watchOS 10.0
  Android SDK: Not Found
IDEs:
  Android Studio: 2023.1 AI-231.9392.1.2311.11330709
  Xcode:
    version: 15.0.1/15A507
    path: /usr/bin/xcodebuild
Languages:
  Java:
    version: 17.0.10
    path: /usr/bin/javac
  Ruby:
    version: 2.7.2
    path: /Users/zhuzhiqin/.rvm/rubies/ruby-2.7.2/bin/ruby
npmPackages:
  "@react-native-community/cli": Not Found
  react: Not Found
  react-native:
    installed: 0.73.3
    wanted: 0.73.3
  react-native-macos: Not Found
npmGlobalPackages:
  "*react-native*": Not Found
Android:
  hermesEnabled: Not found
  newArchEnabled: Not found
iOS:
  hermesEnabled: true
  newArchEnabled: true

Stacktrace or Logs

Cannot read x from undefined

Reproducer

https://github.com/rabbitmouse

Screenshots and Videos

The old architecture scroll callback is as shown below
image

The new architecture scroll callback is as shown below
image

I confirm that this is still described in the official documentation.
image

Please fix it as soon as possible!

@rabbitmouse rabbitmouse added Needs: Triage 🔍 Type: New Architecture Issues and PRs related to new architecture (Fabric/Turbo Modules) labels Mar 12, 2024
Copy link

⚠️ Missing Reproducible Example
ℹ️ We could not detect a reproducible example in your issue report. Please provide either:
  • If your bug is UI related: a Snack
  • If your bug is build/update related: use our Reproducer Template. A reproducer needs to be in a GitHub repository under your username.

@github-actions github-actions bot added Needs: Repro This issue could be improved with a clear list of steps to reproduce the issue. Newer Patch Available labels Mar 12, 2024
Copy link

⚠️ Newer Version of React Native is Available!
ℹ️ You are on a supported minor version, but it looks like there's a newer patch available - 0.73.6. Please upgrade to the highest patch for your minor or latest and verify if the issue persists (alternatively, create a new project and repro the issue in it). If it does not repro, please let us know so we can close out this issue. This helps us ensure we are looking at issues that still exist in the most recent releases.

@github-actions github-actions bot added Component: TextInput Related to the TextInput component. Platform: iOS iOS applications. labels Mar 12, 2024
@cortinico
Copy link
Contributor

@rabbitmouse thanks for your report.

Can you provide:

  1. A valid reproducer (you linked your personal GH profile)
  2. The code snippets as code and not as image (for SEO reasons)

And then we could look into it

@rabbitmouse
Copy link
Author

#43445

Yes I think this submission is correct, thx

@github-actions github-actions bot added Needs: Attention Issues where the author has responded to feedback. and removed Needs: Author Feedback labels Mar 13, 2024
@cortinico cortinico added Resolution: PR Submitted A pull request with a fix has been provided. and removed Needs: Repro This issue could be improved with a clear list of steps to reproduce the issue. Newer Patch Available Needs: Attention Issues where the author has responded to feedback. labels Mar 13, 2024
cipolleschi pushed a commit that referenced this issue Jun 3, 2024
Summary:
Fixes #43428 . cc cortinico .

## Changelog:

[IOS] [FIXED] - [Fabric] iOS: Fixes textinput onscroll event payload

Pull Request resolved: #43445

Test Plan:
```
    const onInputScroll = (e) => {
      if (Platform.OS !== "web") {
        const {
          nativeEvent: {
            contentOffset: { x, y },
          },
        } = e;
        console.log('onInputScroll ====', e?.nativeEvent)
      }
    };

<TextInput
          onScroll={onInputScroll}
          // ref={inputRef}
          multiline
  />
```

Reviewed By: cortinico

Differential Revision: D54813378

Pulled By: sammy-SC

fbshipit-source-id: 76671fbb390c2fbc67a9c29b6c2a834ba699fff4
This issue was closed.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Component: TextInput Related to the TextInput component. Platform: iOS iOS applications. Resolution: PR Submitted A pull request with a fix has been provided. Type: New Architecture Issues and PRs related to new architecture (Fabric/Turbo Modules)
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants