Couldn't hide header with `headerShown` with some specific device

まず、iOS 15.8.3を搭載した実機のiPhone 7 Plusで、カスタムtabBarを使用し、headerShownをfalseに設定したTab.Navigatorの構成を再現し、その後、動作しているiPhone 16 Pro Maxの構成と比較します。影響を受けるデバイスでheaderが非表示のままになり、動作している構成にリグレッションが発生しなければ完了です。

Before submitting a new issue

• I tested using the latest version of the library, as the bug might be already fixed.
• I tested using a supported version of react native.
• I checked for possible duplicate issues, with possible answers.

Bug summary

Code

<Tab.Navigator
  tabBar={(props: any) => <BottomTabs {...props} />}
  screenOptions={{
    headerShown: false,
  }}
>

Result

• iPhone 7Plus (physical device): ios 15.8.3 (the one got issue)

• iPhone 16 Pro Max (emulator): ios 18.2 (working fine)

Library version

0.8.6

Environment info

npx react-native info
info Fetching system and libraries information...
System:
  OS: macOS 15.3
  CPU: (10) arm64 Apple M4
  Memory: 146.67 MB / 16.00 GB
  Shell:
    version: "5.9"
    path: /bin/zsh
Binaries:
  Node:
    version: 18.20.5
    path: ~/.nvm/versions/node/v18.20.5/bin/node
  Yarn:
    version: 3.6.4
    path: ~/.nvm/versions/node/v18.20.5/bin/yarn
  npm:
    version: 10.8.2
    path: ~/.nvm/versions/node/v18.20.5/bin/npm
  Watchman:
    version: 2024.12.02.00
    path: /opt/homebrew/bin/watchman
Managers:
  CocoaPods:
    version: 1.14.3
    path: /Users/tuanluong/.rvm/gems/ruby-3.3.1/bin/pod
SDKs:
  iOS SDK:
    Platforms:
      - DriverKit 24.2
      - iOS 18.2
      - macOS 15.2
      - tvOS 18.2
      - visionOS 2.2
      - watchOS 11.2
  Android SDK:
    API Levels:
      - "34"
      - "35"
    Build Tools:
      - 28.0.3
      - 29.0.2
      - 29.0.3
      - 30.0.2
      - 30.0.3
      - 31.0.0
      - 32.0.0
      - 33.0.0
      - 33.0.1
      - 34.0.0
      - 35.0.0
    System Images:
      - android-34 | Google Play ARM 64 v8a
      - android-35 | Google Play ARM 64 v8a
    Android NDK: Not Found
IDEs:
  Android Studio: Not Found
  Xcode:
    version: 16.2/16C5032a
    path: /usr/bin/xcodebuild
Languages:
  Java:
    version: 23.0.1
    path: /Users/tuanluong/.sdkman/candidates/java/current/bin/javac
  Ruby:
    version: 3.3.1
    path: /Users/tuanluong/.rvm/rubies/ruby-3.3.1/bin/ruby
npmPackages:
  "@react-native-community/cli":
    installed: 15.0.1
    wanted: 15.0.1
  react:
    installed: 18.3.1
    wanted: 18.3.1
  react-native:
    installed: 0.77.0
    wanted: 0.77.0
  react-native-macos: Not Found
npmGlobalPackages:
  "*react-native*": Not Found
Android:
  hermesEnabled: true
  newArchEnabled: true
iOS:
  hermesEnabled: true
  newArchEnabled: true

Steps to reproduce

Just add tab navigator with custom tabBar and headerShown is false

Reproducible sample code

<Tab.Navigator
  tabBar={(props: any) => <BottomTabs {...props} />}
  screenOptions={{
    headerShown: false,
  }}
>