Skip to content
New issue

Have a question about this project? # for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “#”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? # to your account

Fix(react-native) add missing ws dependency #1174

Merged
merged 3 commits into from
Jun 5, 2017

Conversation

joeybaker
Copy link
Contributor

@joeybaker joeybaker commented May 31, 2017

Issue

ws was a dependency, but wasn't specified in package.json. We got away with this b/c ws is a dependency of react-native, but that causes a problem because the version of ws used by storybook is non-deterministic. This can cause the following error on startup:

this.wsServer = _ws2.default.Server({ server: this.httpServer });
                                 ^

TypeError: Class constructor WebSocketServer cannot be invoked without 'new'
    at new Server (.../node_modules/@storybook/react-native/dist/server/index.js:48:34)

What I did

Added new, and added ws to package.json

How to test

Just run storybook start. It now works. Before, it would crash.

Fixes this error on startup:

```
this.wsServer = _ws2.default.Server({ server: this.httpServer });
                                 ^

TypeError: Class constructor WebSocketServer cannot be invoked without 'new'
    at new Server (.../node_modules/@storybook/react-native/dist/server/index.js:48:34)
```
@codecov
Copy link

codecov bot commented May 31, 2017

Codecov Report

Merging #1174 into master will not change coverage.
The diff coverage is 0%.

Impacted file tree graph

@@           Coverage Diff            @@
##           master    #1174    +/-   ##
========================================
  Coverage   13.31%   13.31%            
========================================
  Files         199      199            
  Lines        4588     4588            
  Branches      724      522   -202     
========================================
  Hits          611      611            
- Misses       3349     3515   +166     
+ Partials      628      462   -166
Impacted Files Coverage Δ
app/react-native/src/server/index.js 0% <0%> (ø) ⬆️
app/react-native/src/bin/storybook.js 0% <0%> (ø) ⬆️
app/react-native/src/preview/story_kind.js 0% <0%> (ø) ⬆️
lib/ui/src/modules/ui/containers/left_panel.js 20% <0%> (ø) ⬆️
addons/info/src/components/markdown/code.js 0% <0%> (ø) ⬆️
addons/storyshots/src/test-bodies.js 0% <0%> (ø) ⬆️
addons/knobs/src/components/types/Select.js 7.14% <0%> (ø) ⬆️
app/react/src/client/preview/client_api.js 39.28% <0%> (ø) ⬆️
addons/info/src/components/PropVal.js 0% <0%> (ø) ⬆️
addons/knobs/src/components/PropField.js 10.41% <0%> (ø) ⬆️
... and 33 more

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update 7b6c00c...9a139ec. Read the comment docs.

ndelangen
ndelangen previously approved these changes May 31, 2017
@ndelangen
Copy link
Member

Thanks, I'll ask another react-native user to give this a test. on positive I'll merge it!

Can you explain to error message / bug a bit more? So it can be tested better and have a good changelog later on.

@joeybaker
Copy link
Contributor Author

Sure? I just ran storybook start and got the stated error. It looks like an oversight/typo/node version issue.

@shilman shilman dismissed ndelangen’s stale review May 31, 2017 22:25

Didn't test

@joeybaker
Copy link
Contributor Author

Howdy @shilman – how would you like me to test this? There don't appear to be any tests setup for this kind of thing as far as I can tell?

@shilman
Copy link
Member

shilman commented May 31, 2017

Hi @joeybaker FYI I dismissed @ndelangen 's review because he didn't test it, not because you didn't provide tests.

We were discussing this in Slack and are a little confused about the change, since we've all been using storybook/react-native without problems. I'll work with you to get this in, or at least figure out what's going on.

@joeybaker
Copy link
Contributor Author

joeybaker commented May 31, 2017

hmmm… I'm not quite sure how I'm special then :). I'm happy to hope into a slack/IRC if you want.

FWIW, the ws docs pretty clearly indicate that they require new to be used.

@shilman
Copy link
Member

shilman commented Jun 1, 2017

@joeybaker Sure, jump into slack, or we can discuss here. Either way!

https://storybooks-slackin.herokuapp.com/

If you can provide a broken repro, I'd love to look at it. I'll also provide you a working repro, and you can try it on your machine.

@sgtsquiggs
Copy link

This fix works for me locally as well.

@shilman
Copy link
Member

shilman commented Jun 1, 2017

@joeybaker don't doubt your fix, just trying to understand why it's working for most people. here's the simple repro that works on my machine:

shell1:

yarn create react-native-app rnapp
cd rnapp
getstorybook
yarn storybook

shell2:

open http://localhost:7007
yarn run ios

If I understand your fix properly this should break, but it doesn't. Any ideas?

@joeybaker
Copy link
Contributor Author

Hmm… a few thoughts:

  • I'm running node v7.9, maybe there's a difference there?
  • I didn't use CRNA, maybe the dependency order matters?

@shilman
Copy link
Member

shilman commented Jun 1, 2017

@joeybaker mind sharing an analogous repro? I'd love to figure this out

@atticoos
Copy link
Member

atticoos commented Jun 1, 2017

This is a little bit of a tricky one, the new keyword was introduced in v2.0.0.

If you notice, @storybook/react-native does not specify the version of ws, it's implicitly using React Native's dependency on ws, which is at v1.1.x.

⚠️ ⚠️ Making this change alone will break for users who do not specify their own ws@>=2.0.0 dependency

@joeybaker - does your project define it's own ws dependency above 1.x?

Next steps

We should add ws as a dependency to @storyboard/react-native specifying 3.x

Could someone double check my thinking here: is it okay if you specify a dependency at a version that is different from another dependency who has the same module as their dependency? (that's a mouthful)

For example:

your-project
 - react-native@0.43.0
    - ws@1.1.0
 - ws@3.0.0
     ^-------- does this conflict with react-native's ws@1.1.0?

@atticoos
Copy link
Member

atticoos commented Jun 1, 2017

I think this is okay? It's marked as "extraneous", but I think it would still use it?

screen shot 2017-06-01 at 1 52 01 pm

Package A (test-a)

  • ws@3.0.0

Package B (test-b)

  • package-a
  • ws@1.1.0

yields

test-b@1.0.0 /Users/atticus/Desktop/test-b
├─┬ test-a@1.0.0 invalid
│ └── ws@3.0.0 extraneous
└─┬ ws@1.1.0
  ├── options@0.0.6
  └── ultron@1.0.2

@joeybaker
Copy link
Contributor Author

@ajwhite Good call! We specify v1.1.1 for ws, but yarn.lock has:

ws@3.0.0:
  version "3.0.0"
  resolved "https://registry.yarnpkg.com/ws/-/ws-3.0.0.tgz#98ddb00056c8390cb751e7788788497f99103b6c"
  dependencies:
    safe-buffer "~5.0.1"
    ultron "~1.1.0"

ws@^1.1.0:
  version "1.1.4"
  resolved "https://registry.yarnpkg.com/ws/-/ws-1.1.4.tgz#57f40d036832e5f5055662a397c4de76ed66bf61"
  dependencies:
    options ">=0.0.5"
    ultron "1.0.x"

ws@^2.0.3:
  version "2.3.1"
  resolved "https://registry.yarnpkg.com/ws/-/ws-2.3.1.tgz#6b94b3e447cb6a363f785eaf94af6359e8e81c80"
  dependencies:
    safe-buffer "~5.0.1"
    ultron "~1.1.0"

Resulting in:

cat node_modules/ws/package.json | json version
→ 3.0.0

So, if storybook/react-native doesn't specify a ws version it'll get v3 in our project.

The answer to your second question is that the two ws dependencies don't conflict – that's part of the genius of npm's original design :)

I completely agree that storybook/react-native should always specify all it's dependencies.

@atticoos
Copy link
Member

atticoos commented Jun 1, 2017

The answer to your second question is that the two ws dependencies don't conflict – that's part of the genius of npm's original design :)

😃 thanks for clearing this up! I felt like this was the answer, but wanted to be 100%.

So it sounds like we can add the appropriate version as a dependency and we should be good here. I think we can all agree being on the later version is the proper path forward? Otherwise we can specify 1.1.0 as the dependency version and keep things w/o the new keyword. But I'm not against moving to 3.x

Copy link
Member

@atticoos atticoos left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Since the current form will lead to a breaking change, dropping in this review to make sure we add the ws dependency to @storybook/react-native before merging

It's a dependency already!
@joeybaker joeybaker changed the title Fix(react-native) add missing new Fix(react-native) add missing ws dependency Jun 1, 2017
@joeybaker
Copy link
Contributor Author

joeybaker commented Jun 1, 2017

@ajwhite I added ws to package.json, but I don't have time to test this out. Please feel free to edit this PR if need-be.

@atticoos
Copy link
Member

atticoos commented Jun 1, 2017

Thanks @joeybaker, if anyone can give this a test that would be great. Otherwise I can try to follow up tomorrow 📆

@atticoos atticoos dismissed their stale review June 1, 2017 20:30

dependency added, haven't been able to test yet

Copy link
Member

@shilman shilman left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@joeybaker @ajwhite tested on my local machine with CRNA. Before this PR:

rnapp@0.1.0 /Users/shilman/projects/storybook/new/rnapp
├── UNMET PEER DEPENDENCY react@16.0.0-alpha.6
└─┬ UNMET PEER DEPENDENCY react-native@0.44.2
  ├─┬ react-devtools-core@2.2.1
  │ └── ws@2.3.1 
  └── ws@1.1.4 

After this PR:

rnapp@0.1.0 /Users/shilman/projects/storybook/new/rnapp
├─┬ @storybook/react-native@3.0.0 invalid
│ ├── UNMET PEER DEPENDENCY react@15.5.4 extraneous
│ └── ws@3.0.0  extraneous
├── UNMET PEER DEPENDENCY react@16.0.0-alpha.6
└─┬ UNMET PEER DEPENDENCY react-native@0.44.2
  ├─┬ react-devtools-core@2.2.1
  │ └── ws@2.3.1 
  └── ws@1.1.4 

And it's working for me. Merging. Thanks for the fix @joeybaker and @ajwhite !

@shilman shilman merged commit d59feed into storybookjs:master Jun 5, 2017
@joeybaker joeybaker deleted the patch-1 branch June 5, 2017 03:31
# for free to join this conversation on GitHub. Already have an account? # to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

5 participants