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

@nx/storybook:storybook 16.5.3 overrides networkAddress with localhost. #18376

Closed
1 of 4 tasks
NikitaIT opened this issue Jul 29, 2023 · 2 comments · Fixed by #18419
Closed
1 of 4 tasks

@nx/storybook:storybook 16.5.3 overrides networkAddress with localhost. #18376

NikitaIT opened this issue Jul 29, 2023 · 2 comments · Fixed by #18419
Assignees
Labels
outdated scope: storybook Issues related to Storybook support in Nx type: bug

Comments

@NikitaIT
Copy link

NikitaIT commented Jul 29, 2023

docs: https://nx.dev/packages/storybook/executors/storybook#host

Current Behavior

│   Storybook 7.1.0 for nextjs started              │
│   90 ms for manager and 2.38 s for preview        │
│                                                   │
│    Local:            http://localhost:4200/       │
│    On your network:  http://localhost:4200/ 

Expected Behavior

│   Storybook 7.1.0 for nextjs started              │
│   90 ms for manager and 2.38 s for preview        │
│                                                   │
│    Local:            http://localhost:4200/       │
│    On your network:  http://192.168.1.123:4200/ 

GitHub Repo

No response

Steps to Reproduce

  1. Init @nx/storybook
  2. nx run storybook

Config:

"storybook": {
      "executor": "@nx/storybook:storybook",
      "options": {
        "port": 4200,
       // "host": "192.168.1.123",
        "configDir": "packages/components/.storybook"
      },
      "configurations": {
        "ci": {
          "quiet": true
        }
      }
    },

Problem:
The @nx/storybook host configuration is probably set to "localhost" by default.

Solution:
If host is not set, the storybook uses the inet address of the computer on the local network.
So, we should probably remove "host": "localhost" from @nx/storybook:storybook defaults.

Show expected host address: ifconfig | grep "inet" | grep -v 127.0.0.1.

Nx Report

Node   : 19.7.0
   OS     : darwin-arm64
   npm    : 9.7.2
   
   nx                 : 16.5.3
   @nx/js             : 16.5.3
   @nx/jest           : 16.5.3
   @nx/linter         : 16.5.3
   @nx/workspace      : 16.5.3
   @nx/cypress        : 16.5.3
   @nx/devkit         : 16.5.3
   @nx/eslint-plugin  : 16.5.3
   @nx/next           : 16.5.3
   @nx/react          : 16.5.3
   @nx/rollup         : 16.5.3
   @nx/storybook      : 16.5.3
   @nrwl/tao          : 16.5.3
   @nx/web            : 16.5.3
   nx-cloud           : 16.1.1
   typescript         : 5.1.6

Failure Logs

No response

Operating System

  • macOS
  • Linux
  • Windows
  • Other (Please specify)

Additional Information

No response

@NikitaIT
Copy link
Author

How storybook solve related problem (Feb 4, 2021): storybookjs/storybook#13619 (comment)

How it works: https://github.com/PenguinOfWar/storybook/blob/d6f6d727bc0b0d7a6bd61555e37e67748cb6c9f4/lib/core/src/server/dev-server.ts#L359

export function getServerAddresses(port: number = 4400, host: string = undefined, proto: string = "http") {
  return {
    address: `${proto}://localhost:${port}/`,
    networkAddress: `${proto}://${host || ip.address()}:${port}/`,
  };
}

How it works with @nx/storybook:storybook:

export function getServerAddresses(port: number = 4400, host: string = "localhost", proto: string = "http") {
  return {
    address: `${proto}://localhost:${port}/`,
    networkAddress: `${proto}://${host || ip.address()}:${port}/`,
  };
}

@mandarini mandarini added the scope: storybook Issues related to Storybook support in Nx label Jul 31, 2023
@mandarini mandarini self-assigned this Jul 31, 2023
@github-actions
Copy link

github-actions bot commented Sep 1, 2023

This issue has been closed for more than 30 days. If this issue is still occuring, please open a new issue with more recent context.

@github-actions github-actions bot locked as resolved and limited conversation to collaborators Sep 1, 2023
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
outdated scope: storybook Issues related to Storybook support in Nx type: bug
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants