Upgrade react version

[luisrudge]

fix #1096 #1134 #1127

react

https://github.com/facebook/react/releases/tag/v16.0.0
https://reactjs.org/blog/2017/09/26/react-v16.0.html

react-transition-group:

https://github.com/reactjs/react-transition-group/blob/master/Migration.md

enzyme

https://github.com/airbnb/enzyme/blob/master/docs/guides/migration-from-2-to-3.md

[aaguiarz]

Maybe we should clarify in the Readme that tests require React16?

[luisrudge]

Not sure this matters to anyone consuming the library.

[jglover]

Any chance of a minor release with this fix soon?

[luisrudge]

@jglover actually, if you follow here, we're rolling back this change to support only ^15.6.2 (we let the react@16 fixes in place, we're only rolling back the dependency). Because our dependency was too permissive, our customers are being upgraded to react@16 unintentionally. We'll fix that with the new release. We'll upgrade to react@16 in a future version (probably major).

[jglover]

Thanks @luisrudge, that's understandable.
No chance of an auth0-lock-react16 npm package based off a branch with just those dependencies upgraded in the meantime? There are some useful features in React 16 that are a shame to miss out on.

[luisrudge]

@jglover we're trying to figure it out how to help react@16 users. The ideal would be to move react and react-dom to peerDependencies, but this would be a breaking change for most of our customers, so we're thinking this through.

In the meantime, react@16 will work. you'll just have to bundle both versions if you're not using yarn. If you are using yarn, however, you can use the resolutions field and pin react@16 to your repo.

{
  "name": "test-test",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "auth0-lock": "^10.22.0",
    "react": "^16.0.0",
    "react-dom": "^16.0.0",
    "react-scripts": "^1.0.14"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test --env=jsdom",
    "eject": "react-scripts eject"
  },
  "resolutions": {
    "react": "16.0.0",
    "react-dom": "16.0.0"
  }
}

[scamden]

@luisrudge fyi, i get two copies of react if i bundle auth0 into a component meant to be consumed from another component. my only current solution is to make auth0-lock a peer dep and mark it external to webpack

[spunkedy]

Is this going to get fixed for v11 at all?

[luisrudge]

@scamden if you set the resolutions field (if you're using yarn), it will bundle only one copy.

[luisrudge]

@spunkedy We'll probably only fix this for good when we release a new major version making react and react-dom peer dependencies. For now, we have a workaround for yarn users.

[spunkedy]

@luisrudge I looked at your merge, and the tags for the release. It doesn't have the || @16

I am using yarn and tried the resolution, doesn't seem to work with 11.3.0

[luisrudge]

why it doesn't work? I have a sample here that works: https://github.com/luisrudge/lock-react16

[spunkedy]

@luisrudge https://gist.github.com/spunkedy/e8db600d8dfbec522070ceccbeeb379b

My resolutions are the same, my react is the same. I might be using it wrong, but I put a bunch of data in the gist.

The part that is concerning is that the lock file still shows:

auth0-lock@^11.2.3:
  version "11.3.0"
  resolved "https://registry.yarnpkg.com/auth0-lock/-/auth0-lock-11.3.0.tgz#8db0758126313f907d74a6930b14f65ff66f6914"
  dependencies:
    auth0-js "^9.3.0"
    blueimp-md5 "2.3.1"
    fbjs "^0.3.1"
    idtoken-verifier "^1.0.1"
    immutable "^3.7.3"
    jsonp "^0.2.0"
    password-sheriff "^1.1.0"
    prop-types "^15.6.0"
    react "^15.6.2"
    react-dom "^15.6.2"
    react-transition-group "^2.2.1"
    trim "0.0.1"
    url-join "^1.1.0"

any ideas?

[scamden]

We don’t use yarn. I assume you’re going to support this for npm as well? We’re on npm 5

[luisrudge]

@spunkedy that's fine. I get that in mine too: https://github.com/luisrudge/lock-react16/blob/master/yarn.lock#L301 What it matters is that the react version used will be whatever you set in your resolutions property.

@scamden Sadly, the workaround only works for yarn. npm has nothing like the resolutions field :(

[scamden]

Ya makes sense. I meant in terms of moving react to a peer dep

[spunkedy]

@luisrudge

Then, any idea what might be going on?

const REACT_VERSION = React.version;
console.log(REACT_VERSION);

returns
16.2.0

[luisrudge]

@spunkedy that's what you want, no?

[spunkedy]

haha yes, but without the auth0 lock errors :)

[luisrudge]

@spunkedy what error? you didn't mentioned any

[luisrudge]

@scamden we'll do that, but we need to do this in a new major release, because it will be a breaking change. This also means we'll have to update all docs, quick starts, samples etc. I assure you this will happen, but there's no ETA

[spunkedy]

It was in the gist, sorry.
https://gist.github.com/spunkedy/e8db600d8dfbec522070ceccbeeb379b#file-error

[luisrudge]

@spunkedy It's a compatibility issue with other packages you're using. I'd say the issue is with react-transition-group. I had the same issue when upgrading Lock. Probably a material-ui issue

[scamden]

Fair enough. Just have to keep this lib a peer dep itself everywhere until that makes it in. (Isn’t 11 a major tho?)

…

On Tue, Feb 27, 2018 at 9:53 AM Luís Rudge ***@***.***> wrote: @scamden <https://github.com/scamden> we'll do that, but we need to do this in a new major release, because it will be a breaking change. This also means we'll have to update all docs, quick starts, samples etc. I assure you this will happen, but there's no ETA — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#1135 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/ABE5mOu9vEXQfKTa8UWa9jGfkSL2oTw4ks5tZEEKgaJpZM4Pw_dJ> .

[spunkedy]

got it, so it needs to be at least v2? I will chase that down then

[luisrudge]

@scamden 11 was a new major, yes. The plan was to fix in v11, but we needed to address a security issue and wanted the migration from v10 to v11 to be as smooth as possible. Hopefully, we don't have to do this with v12 😝

[luisrudge]

@spunkedy yes. v1 doesn't support react 16: reactjs/react-transition-group#199