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

1.6.1 is breaking #2499

Closed
AlicanC opened this issue Aug 2, 2018 · 12 comments
Closed

1.6.1 is breaking #2499

AlicanC opened this issue Aug 2, 2018 · 12 comments

Comments

@AlicanC
Copy link

AlicanC commented Aug 2, 2018

I am aware that usage of React.forwardRef is listed under "Potentially Breaking" in the change log. It says:
This is a breaking change for people relying on the relayContainer.refs.component implementation detail.

Sadly, there is more to it. Our app is completely broken, because we have cases like this:

class MyComponent extends Component {
  // ...
}

const MyComponentPaginationContainer = createPaginationContainer(
  MyComponent,
  // ...
);

export default connect(
  // ...
)(MyComponentPaginationContainer);

After upgrading to 1.6.2, connect()s like this started throwing:
You must pass a component to the function returned by connect. Instead received {}

We do this because we need data from the Redux store that we use in query variables so we don't have the option to re-order createPaginationContainer() and connect().

I don't know if we are benefiting from internal usage of it, but other than that we really don't care about React.forwardRef, but we need other changes in 1.6.1.

Official React documents also state that usage of React.forwardRef should bump major:
https://reactjs.org/docs/forwarding-refs.html#note-for-component-library-maintainers

Could this be respected?

@AndreiCalazans
Copy link

I know it's weird but have you tried wrapping MyComponent with the connect HOC before passing to createPaginationContainer?

like


class MyComponent extends Component {
  // ...
}

const Connected = connect(...)(MyComponent);

const MyComponentPaginationContainer = createPaginationContainer(
  Connected,
  // ...
);

export default MyComponentPaginationContainer;

Although this is just a workaround

@sibelius
Copy link
Contributor

sibelius commented Aug 2, 2018

This looks like an issue with React Redux instead

Check this tweet https://twitter.com/acemarke/status/1024761710765334528?s=21

ForwardRef does not work well with React Redux

@AlicanC
Copy link
Author

AlicanC commented Aug 2, 2018

@AndreiCalazans

I can't do that. As I've said:

We do this because we need data from the Redux store that we use in query variables so we don't have the option to re-order createPaginationContainer() and connect().

There are other ways but I won't be refactoring tons of components with workarounds for this. I'd rather wait for stuff to get fixed.

@sibelius I am aware that Redux can't handle forwardRef.

I am just saying that:

  • As stated in the official React documentation, using forwardRefs is a breaking change.
  • A breaking change was made in Relay.
  • This breaking change was released without bumping major.
  • The release broke our application.

Relay 1.6.1 clearly violates SemVer and I see two options here:

  • Take no action which would mean Relay does not follow SemVer.
  • Rollback the change

@sibelius
Copy link
Contributor

sibelius commented Aug 2, 2018

1.6.0 was a breaking change as well, as it set the minimum React version to 16.4.x

@cyan33
Copy link

cyan33 commented Aug 2, 2018

We fixed this in Facebook by forking react-redux and removed that invariant error. Hopefully it can be fixed upstream soon. cc @markerikson :)

@markerikson
Copy link

I don't think this is about connect using forwardRef. It's about our check for valid components being passed in, which is a separate open issue about our use of react-is.

@cyan33
Copy link

cyan33 commented Aug 2, 2018

@markerikson Yeah sorry I wasn't making it clear. That's the exactly the issue I'm talking about. Tracker: reduxjs/react-redux#914.

@kassens
Copy link
Member

kassens commented Aug 16, 2018

I'll try to push us to be more careful about bumping the version correctly, but keeping track of the breaking changes can sometimes be hard and slip through.

One thing that made this worse is that we've had a long lag without any releases increasing the likelihood of something slipping through.

We've done some internal improvements to make it easier to release and hopefully can do that just more regularly to keep the list of changes down to fewer commits.

I don't think there's much left here as we can't revert to the old ref API as React.forwardRef allows us to move forward with the next improvements!

@kassens kassens closed this as completed Aug 16, 2018
@nodkz
Copy link
Contributor

nodkz commented Aug 16, 2018

@kassens yeah, more often releases will be a good thing for the community. One release in half of the year looks so like that the project is unmaintained well.

Minimal one release per a month will be a good deal 😎

@kassens
Copy link
Member

kassens commented Aug 16, 2018

@nodkz agreed! Just finished a new RC https://github.com/facebook/relay/releases/tag/v1.7.0-rc.1
It's just a question of keeping the momentum.

@nodkz
Copy link
Contributor

nodkz commented Aug 16, 2018

Rock it! Take care about OSS Relay package, who else if not you!

@tlhunter
Copy link

FWIW the only change from 1.6.1 to 1.6.2 was a minor dependency update:
https://diff.intrinsic.com/react-relay/1.6.1/1.6.2#file-package.json

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

8 participants