SDK33 Error on simple hook (useState)

Expo SDK
1

Using: expo-cli 2.19.1, react-native-cli 2.0.1, react-native 0.59.8

Is there some trick to get hooks working in SDK33 bare minimum project? If I install with expo init --template bare-minimum, fix the babel config so yarn test succeeds (SDK33 SyntaxError testing base bare-minimum template), then update the import from React and the App component in App.js as:

import React, { useState } from "react";

...

export default function App() {
  const [value, setValue] = useState(false);
  return (
    <View style={styles.container}>
      <Text style={styles.welcome}>Welcome to React Native!</Text>
      <Text style={styles.instructions}>To get started, edit App.js</Text>
      <Text style={styles.instructions}>{instructions}</Text>
    </View>
  );
}

The next yarn test fails:

yarn run v1.15.2
$ jest
 FAIL  __tests__/App.js (6.006s)
  × renders correctly (47ms)

  ● renders correctly

    Invariant Violation: Hooks can only be called inside the body of a function component. (https://fb.me/react-invalid-hook-call)

      10 |
      11 | export default function App() {
    > 12 |   const [value, setValue] = useState(false);
         |                             ^
      13 |   return (
      14 |     <View style={styles.container}>
      15 |       <Text style={styles.welcome}>Welcome to React Native!</Text>

      at invariant (node_modules/react/cjs/react.development.js:88:15)
      at resolveDispatcher (node_modules/react/cjs/react.development.js:1436:28)
      at useState (node_modules/react/cjs/react.development.js:1461:20)
      at App (App.js:12:29)
      at mountIndeterminateComponent (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:6889:13)
      at beginWork (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:7389:16)
      at performUnitOfWork (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:10149:12)
      at workLoop (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:10181:24)
      at renderRoot (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:10267:7)
      at performWorkOnRoot (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:11135:7)

  console.error node_modules/react-test-renderer/cjs/react-test-renderer.development.js:8075
    The above error occurred in the <App> component:
        in App

    Consider adding an error boundary to your tree to customize error handling behavior.
    Visit https://fb.me/react-error-boundaries to learn more about error boundaries.

Test Suites: 1 failed, 1 total
Tests:       1 failed, 1 total
Snapshots:   0 total
Time:        7.821s
Ran all test suites.
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
2

Is anyone else even able to reproduce this or does this seem to be a weird one-off on my machine? FWIW, I posted this as an Issue on the Expo Github site after a few days of no response here. For that, I set up a sample repository where (I believe) the issue can be easily reproduced at Expo SDK 33 Hooks Test.

3

This topic was automatically closed 15 days after the last reply. New replies are no longer allowed.