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

react native support #1

Closed
sibelius opened this Issue Nov 9, 2016 · 7 comments

Comments

Projects
None yet
3 participants
@sibelius

sibelius commented Nov 9, 2016

Awesome idea!

How can we improve this package to work better with react native?

Maybe using https://github.com/necolas/react-native-web to render the snapshots

@guigrpa

This comment has been minimized.

Show comment
Hide comment
@guigrpa

guigrpa Nov 10, 2016

Owner

That's interesting! I managed to pull off the integration you're suggesting adding the following configuration to the RN project's package.json (current Jest version: 17.0.0):

    "jest": {
        "preset": "jest-react-native",
        "moduleNameMapper": {
            "react-native": "<rootDir>/node_modules/react-native-web"
        },
        "snapshotSerializers": [
            "<rootDir>/node_modules/jest-html"
        ]
    }

You'll need to add both jest-html and react-native-web to your dependencies. The current version of react-native-web (0.0.49) worked for me. In addition, for this to work you'll need version 15.4.0-rc.4 of react and react-test-renderer, due to this issue.

Caveats: you'll no longer have the official Jest snapshots with Views, Texts, and the like, but rather whatever react-native-web converts them to. You'll also probably need to tweak your CSS to ensure HTML previews are meaningful.

If you explore this approach, please share your impressions!

Owner

guigrpa commented Nov 10, 2016

That's interesting! I managed to pull off the integration you're suggesting adding the following configuration to the RN project's package.json (current Jest version: 17.0.0):

    "jest": {
        "preset": "jest-react-native",
        "moduleNameMapper": {
            "react-native": "<rootDir>/node_modules/react-native-web"
        },
        "snapshotSerializers": [
            "<rootDir>/node_modules/jest-html"
        ]
    }

You'll need to add both jest-html and react-native-web to your dependencies. The current version of react-native-web (0.0.49) worked for me. In addition, for this to work you'll need version 15.4.0-rc.4 of react and react-test-renderer, due to this issue.

Caveats: you'll no longer have the official Jest snapshots with Views, Texts, and the like, but rather whatever react-native-web converts them to. You'll also probably need to tweak your CSS to ensure HTML previews are meaningful.

If you explore this approach, please share your impressions!

@sibelius

This comment has been minimized.

Show comment
Hide comment
@sibelius

sibelius Nov 10, 2016

Tks for the help!

I will wait until React release 15.4.0 to test this

sibelius commented Nov 10, 2016

Tks for the help!

I will wait until React release 15.4.0 to test this

@guigrpa

This comment has been minimized.

Show comment
Hide comment
@guigrpa

guigrpa Nov 10, 2016

Owner

It should be just around the corner! ;)

Owner

guigrpa commented Nov 10, 2016

It should be just around the corner! ;)

@gaearon

This comment has been minimized.

Show comment
Hide comment
@gaearon

gaearon Nov 16, 2016

React 15.4.0 is out today.

gaearon commented Nov 16, 2016

React 15.4.0 is out today.

@guigrpa

This comment has been minimized.

Show comment
Hide comment
@guigrpa

guigrpa Nov 25, 2016

Owner

@sibelius Had success with your RN integration?

Owner

guigrpa commented Nov 25, 2016

@sibelius Had success with your RN integration?

@sibelius

This comment has been minimized.

Show comment
Hide comment
@sibelius

sibelius Nov 25, 2016

I have this error using this approach

Cannot find module 'react/lib/findDOMNode' from 'index.js'

this is a breaking change on react 15.4.0

I need to open an issue on react-native-web to fix this

sibelius commented Nov 25, 2016

I have this error using this approach

Cannot find module 'react/lib/findDOMNode' from 'index.js'

this is a breaking change on react 15.4.0

I need to open an issue on react-native-web to fix this

@guigrpa

This comment has been minimized.

Show comment
Hide comment
@guigrpa

guigrpa Jun 13, 2017

Owner

I guess this is now outdated. Please reopen if needed

Owner

guigrpa commented Jun 13, 2017

I guess this is now outdated. Please reopen if needed

@guigrpa guigrpa closed this Jun 13, 2017

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment