Skip to content

Jest/Enzyme snapshots show 'Component' instead of the native component #21937

@rajivshah3

Description

@rajivshah3

Environment

React Native Environment Info:
    System:
      OS: macOS 10.14
      CPU: x64 Intel(R) Core(TM) i5-3210M CPU @ 2.50GHz
      Memory: 189.02 MB / 8.00 GB
      Shell: 3.2.57 - /bin/bash
    Binaries:
      Node: 8.11.4 - /usr/local/bin/node
      Yarn: 1.10.1 - /usr/local/bin/yarn
      npm: 6.4.1 - ~/.config/yarn/global/node_modules/.bin/npm
      Watchman: 4.9.0 - /usr/local/bin/watchman
    SDKs:
      iOS SDK:
        Platforms: iOS 12.1, macOS 10.14, tvOS 12.1, watchOS 5.1
      Android SDK:
        Build Tools: 27.0.3, 28.0.1, 28.0.3
        API Levels: 27, 28
    IDEs:
      Android Studio: 3.2 AI-181.5540.7.32.5056338
      Xcode: 10.1/10O23u - /usr/bin/xcodebuild
    npmPackages:
      react: 16.6.0-alpha.8af6728 => 16.6.0-alpha.8af6728 
      react-native: 0.57.3 => 0.57.3 

Description

In React Native 0.57, the snapshots taken by Jest and Enzyme show Component instead of the actual native component (e.g. View, Text). See diff. This is not only an issue when used with Jest, but also with Enzyme (enzymejs/enzyme#1743).

Reproducible Demo

This can be reproduced by simply upgrading react-native as shown here.

A full example is located at https://github.com/rajivshah3/rn-broken-snapshot. The master branch is the latest version of React Native with a working snapshot test, the 0.55 branch is v0.55 of React Native, and broken-example is an example of a project that is trying to upgrade from v0.55 to the latest version.

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions