Issue with code snippets not appearing in Zeplin

[Uzziel-M]

Dear Zeplin Support,

I hope this message finds you well. I'am writing to report an issue I'm experiencing with the connection between Zeplin components and Angular components. I have followed the guide provided in yout github page (https://github.com/zeplin/connected-components-docs/blob/master/docs/gettingStarted/ANGULAR.md) to setup the integration, but Iam unable to see the code snippets in Zeplin.

Here are the details of the problem:

1. I have succesfully installed the required packages globally and locally as mentioned in the guide
2. I created the components.json file
3. I installed the Zeplin's Storybook addon npm i --save-dev storybook-zeplin npm i --save-dev storybook-zeplin@latest
4. I have run the build command zeplin connect globally and locally too npm run zeplin-connect. The build process completed without any errors or warnings.

Despite following these steps, the code snippets are not appearing in Zeplin as expected.

To assist you further in troubleshooting this problem, here is some additional information:

Global npm packages:
@angular/cli@15.2.0
@zeplin/cli-connect-angular-plugin@0.1.8
@zeplin/cli@2.0.1
npm@8.15.0
nx@15.8.5

Local dev packages:
"@storybook/angular": "~6.4.12",
"storybook-zeplin": "^2.0.0",
"@zeplin/cli": "^2.0.1",
"@zeplin/cli-connect-angular-plugin": "^0.1.8",

node version: 16.17.0
npm version: 8.15.0

components.json
{
"plugins": [
{
"name": "@zeplin/cli-connect-angular-plugin"
}
],
"projects": [
"64680d0fd6997b0f4f2a7c3f"
],
"styleguides": [],
"components": [
{
"path": "libs/shared-ui/src/lib/ui-cta/ui-cta.component.ts",
"zeplinIds": [
"64680d139b5fd5200530b4af"
]
}
]
}

I would greatly appreciate your assistance in resolving this issue. If there are any additional steps or configurations I may have missed, please let me know. If possible, please provide detailed instructions or suggestions on how I can resolve this problem and enable the code snippets to appear in Zeplin.

Thank you for your attention to this matter.
Many thanks for your great work.

/Uzziel M

[panknaik]

Hi
I had the same problem, but later i realized that the API call with Zeplin plugin does to update the code snippet was failing.
After struggling for long came across a workaround, ie updating the snippet locally
https://support.zeplin.io/en/articles/3741121-enabling-local-configuration

Currently looks like you are running 'zeplin connect' but instead use 'zeplin connect --dev', after that, in the desktop apps, you can select “Developer > Connected Components > Enable Local Configuration” from the menu up top.

You should be able to see the code snippets generated.
I understand this is not a full fledged solution as you must be working in a multi developer environment, but this would help you verify if you implementation is done correctly.

I can see that angular's @input gets well documented in the auto code generated by Zeplin, but looks like its missing @output property.
If you have got a workaround this problem please post in your response

Thanks
Cheers