Unable to connect to Storybook static website about connected-components-docs HOT 1 OPEN

Hey,

What is shown on the logs seems to be inconsistent with the configuration you shared.

• 2021-05-30 14:38:08 - debug - component config files: [{"plugins":[{"name":"@zeplin/cli-connect-react-plugin"},{"name":"@zeplin/cli-connect-storybook-plugin","config":{"command":"cd ./packages/shared-ui && yarn storybook"}}],"projects":["60b2f9d94a6dfa1550d529df"],"styleguides":[],"components":[{"path":"packages/shared-ui/src/Components/AppButton/AppButton.js","zeplinIds":["60b2f9eadcee6518e5419c47"]}],"github":{"repository":"channelaffairs/tooth-fairy-mono-repo"}}]

{
    "name": "@zeplin/cli-connect-storybook-plugin",
    "config": {
        "command": "cd ./packages/shared-ui && yarn storybook"
    }
}

This means that Zeplin CLI will try to start it up on your local machine (using the command) instead of loading the static Storybook URL. The logs show that Zeplin CLI really executes the above command to start a local Storybook instance. While doing that, a module loading error is reported by Storybook instance (which may or may not be related to the issue you are having), and then the last error line is reported by Zeplin CLI, which shows that what http://localhost:6006/iframe.html contains is not an actual Storybook instance, or at least, it does not contain the Storybook API that Zeplin CLI expects.

What is happening on the above paragraph you should not happen at all if the config file did have a static Storybook URL. Are you sure that .zeplin/components.json contains the static Storybook URL you shared as in the below snippet?

{
    "name": "@zeplin/cli-connect-storybook-plugin",
    "config": {
        "url": "https://mybranch--xyz.chromatic.com"
    }
}

Of course, you can keep using "command": "cd ./packages/shared-ui && yarn storybook". To resolve the issue I would suggest to fix the module loading issue. As I mentioned, this error is actually reported by the whatever was served on http://localhost:6006/iframe.html. Changing directory on the command might be the culprit. To confirm that this command spins up a working local Storybook instance, open your monorepo's root directory and type in the same command cd ./packages/shared-ui && yarn storybook on the terminal. Check if the local Storybook is working on your browser, navigate between stories etc. to confirm. Open browser console and refresh the page, check if any errors is reported like above.

Or maybe the problem is just that the port number is wrong. You might need to set the URL parameter to tell Zeplin CLI the correct port number. Check the below snippet, you can replace <PORT> with the port that Storybook works on.

{
    "name": "@zeplin/cli-connect-storybook-plugin",
    "config": {
        "url": "http://localhost:<PORT>",
        "command": "cd ./packages/shared-ui && yarn storybook"
    }
}

from connected-components-docs.