{"id":"73321e9f-e7fc-43db-84c0-74bde78982c9","shortId":"yVq3z4","kind":"skill","title":"cometchat-angular-troubleshooting","tagline":"Diagnose CometChat Angular UI Kit v4 integration failures — init/login, CUSTOM_ELEMENTS_SCHEMA, assets config, module imports, height/layout issues, Angular Universal SSR, v3-to-v4 upgrade, and production auth errors.","description":"## Purpose\n\nTeaches Claude how to diagnose and fix CometChat Angular UI Kit v4 integration failures. Covers every category of failure across NgModule and standalone component setups, with an up-front triage flow so Claude asks the right questions before assuming a fix.\n\n**Read `cometchat-angular-core` first** — most \"why doesn't this work\" issues trace to the init/login/module setup explained there.\n\nGround truth: `docs/ui-kit/angular/troubleshooting`, `docs/ui-kit/angular/getting-started`, and first-hand failure modes from real integrations.\n\n---\n\n## 1. Triage — read project state before guessing\n\nWhen the user reports a problem, gather facts before proposing a fix.\n\n### 1a. Is `CUSTOM_ELEMENTS_SCHEMA` in every module that uses `<cometchat-*>` tags?\n\n```bash\ngrep -r \"CUSTOM_ELEMENTS_SCHEMA\" src/\n```\n\nIf missing from any module or standalone component that uses `<cometchat-*>` tags, Angular throws \"Unknown element\" errors. Every module/component needs it independently.\n\n### 1b. Are the assets configured in `angular.json`?\n\n```bash\ngrep -A5 '\"assets\"' angular.json | grep cometchat\n```\n\nIf missing, icons render as broken images. The required entry:\n```json\n{ \"glob\": \"**/*\", \"input\": \"./node_modules/@cometchat/chat-uikit-angular/assets/\", \"output\": \"assets/\" }\n```\n\n### 1c. Is init complete before any `<cometchat-*>` component renders?\n\n```bash\ngrep -n \"CometChatUIKit.init\\|isReady\\|APP_INITIALIZER\" src/app/app.component.ts\n```\n\nLook for the init promise + `isReady` flag or `APP_INITIALIZER`. Components rendered before init completes produce blank output.\n\n### 1d. Is `UIKitSettingsBuilder` used (not a flat object)?\n\n```bash\ngrep -n \"UIKitSettingsBuilder\\|CometChatUIKit.init\" src/\n```\n\nAngular requires `UIKitSettingsBuilder` from `@cometchat/uikit-shared`. A flat object passed to `init()` fails silently or throws a type error.\n\n### 1e. Are CometChat components imported in the module?\n\n```bash\ngrep -n \"CometChatConversations\\|CometChatMessages\\|CometChatMessageList\" src/app/app.module.ts\n```\n\nEvery `<cometchat-*>` component must be imported in the module (or standalone component) where it's used.\n\n### 1f. Is `BrowserAnimationsModule` imported?\n\n```bash\ngrep \"BrowserAnimationsModule\" src/app/app.module.ts\n```\n\nMissing `BrowserAnimationsModule` causes runtime errors in components that use Angular animations.\n\n---\n\n## 2. Symptom → fix lookup tables\n\n### 2a. Initialization + login\n\n| Symptom | Likely cause | Fix |\n|---|---|---|\n| Components render nothing after login | `init()` not awaited before mount | Use `*ngIf=\"isReady\"` on the container; set `isReady = true` after init + login resolve |\n| Blank screen, no errors | Component rendered before init completed | Gate with `*ngIf=\"isReady\"` |\n| `getLoggedinUser()` returns `null` | Login not called or session expired | Call `CometChatUIKit.login({ uid })` after init resolves |\n| Login fails: \"UID not found\" | User doesn't exist in CometChat | Create via dashboard, SDK, or REST API. For dev, use `cometchat-uid-1` through `cometchat-uid-5` |\n| `CometChatUIKit.init()` fails silently | Invalid `APP_ID` / `REGION` / `AUTH_KEY` | Re-verify from dashboard → your app → Credentials |\n| `UIKitSettingsBuilder is not a constructor` | Imported from wrong package | Import from `@cometchat/uikit-shared`, not `@cometchat/chat-uikit-angular` |\n| Production build exposes Auth Key | Using `authKey` in `environment.prod.ts` | Switch to server-minted auth tokens. See `cometchat-angular-production` |\n\n### 2b. Module / schema errors\n\n| Symptom | Likely cause | Fix |\n|---|---|---|\n| `'cometchat-conversations' is not a known element` | Missing `CUSTOM_ELEMENTS_SCHEMA` | Add `schemas: [CUSTOM_ELEMENTS_SCHEMA]` to the module or standalone component |\n| `'cometchat-conversations' is not a known element` (even with schema) | Component not imported in the module | Import `CometChatConversations` from `@cometchat/chat-uikit-angular` in the module's `imports` array |\n| `Can't bind to 'user' since it isn't a known property` | Component not imported | Same fix — import the component in the module |\n| `NullInjectorError: No provider for CometChatThemeService` | `CometChatThemeService` not available | It's `providedIn: 'root'` — ensure `AppModule` is the root module. If using standalone bootstrap, ensure `provideAnimations()` is in providers. |\n| `BrowserAnimationsModule` error | Missing animation module | Add `BrowserAnimationsModule` to `AppModule` imports |\n\n### 2c. Assets / icons\n\n| Symptom | Likely cause | Fix |\n|---|---|---|\n| Icons show as broken images (404) | Missing assets config in `angular.json` | Add the glob entry for `@cometchat/chat-uikit-angular/assets/` to `build.options.assets` |\n| Icons broken only in production build | Assets config present but `outputPath` differs | Verify the `output` path in the assets config matches your production output directory |\n| Icons broken after `ng build` | Assets not copied during build | Run `ng build` again after adding the assets config; check `dist/assets/` for the icon files |\n\n### 2d. Layout / height issues\n\n| Symptom | Likely cause | Fix |\n|---|---|---|\n| Conversation list / message list renders empty | Container has no bounded height | Wrap in `<div style=\"height: 100vh;\">` or `<div style=\"flex: 1; overflow: hidden;\">` |\n| Components collapse to zero height | Parent is a `display: block` with no height | Use `display: flex; flex-direction: column; height: 100vh` on the parent |\n| Message list doesn't scroll | Container doesn't have `overflow: hidden` | Add `overflow: hidden` to the message list's container; the component handles its own internal scroll |\n| Chat dialog too small | Angular Material dialog has no explicit size | Set `width` and `height` on the dialog container or pass `{ width: '480px', height: '600px' }` to `MatDialog.open()` |\n| Sidebar chat panel has no height | Sidenav content has no height constraint | Add `height: 100%` or `height: 100vh` to the sidenav content |\n\n### 2e. Angular Router integration\n\n| Symptom | Likely cause | Fix |\n|---|---|---|\n| Chat route shows blank | CometChat init not complete when route activates | Use `APP_INITIALIZER` or a route guard that waits for init |\n| `window.location.reload()` after login breaks routing | Anti-pattern — reload destroys Angular state | Use `this.router.navigate(['/chat'])` instead |\n| Lazy-loaded chat module fails to init | `CometChatUIKit.init()` called inside the lazy module | Move init to `APP_INITIALIZER` at the root level |\n| Route guard `canActivate` always returns false | `getLoggedinUser()` called before init | Ensure init completes before the guard runs (use `APP_INITIALIZER`) |\n\n### 2f. Theming\n\n| Symptom | Likely cause | Fix |\n|---|---|---|\n| Theme overrides don't apply | `setPrimary()` called in `ngOnInit` instead of constructor | Move to constructor — palette must be set before first render |\n| Dark mode doesn't switch | `setMode()` called once but not reactive | Call `setMode()` again when the user toggles; the service is reactive |\n| Custom color shows as default | Color not a valid CSS color string | Use valid CSS color values (`#hex`, `rgb()`, named colors) |\n| `[conversationsStyle]` input has no effect | Style object not instantiated with `new ConversationsStyle({...})` | Use `new ConversationsStyle({...})` — don't pass a plain object |\n\n### 2g. Components\n\n| Symptom | Likely cause | Fix |\n|---|---|---|\n| Slot view (`[listItemView]`, `[subtitleView]`, etc.) renders nothing | `@ViewChild` reference not resolved yet | Ensure `@ViewChild` is accessed after `ngAfterViewInit`, not `ngOnInit` |\n| `[onItemClick]` callback not firing | Wrong binding syntax — using round brackets | Use `[onItemClick]=\"myFn\"` (square brackets, Input callback), never `(onItemClick)=\"myFn($event)\"` (round brackets) |\n| `[user]` input has no effect | Passing a UID string instead of `CometChat.User` instance | `await CometChat.getUser(uid)` first, pass the resolved object |\n| Conversations list empty but data exists | Wrong request builder filters | Check `[conversationsRequestBuilder]` filters (tags, types, limits) |\n| \"Reply in Thread\" option does nothing | Thread panel not wired | Wire `[onThreadRepliesClick]=\"myFn\"` on `<cometchat-message-list>` and render a thread panel — see `cometchat-angular-components` § 11 |\n| `[onError]` callback fires with \"not initialized\" | Component rendered before init | Gate with `*ngIf=\"isReady\"` |\n\n### 2h. Calling\n\n| Symptom | Likely cause | Fix |\n|---|---|---|\n| Call buttons missing | `@cometchat/calls-sdk-javascript` not installed | `npm install @cometchat/calls-sdk-javascript` + rebuild |\n| Incoming call UI doesn't show | `<cometchat-incoming-call>` not mounted or listener not registered | Register `CometChat.addCallListener(...)` in `AppComponent.ngOnInit` and mount `<cometchat-incoming-call>` at the app root |\n| Call listener fires twice | Listener registered in a component that gets destroyed and re-created | Move listener registration to `AppComponent` (root, never destroyed) |\n\n### 2i. Extensions\n\n| Symptom | Likely cause | Fix |\n|---|---|---|\n| Polls option missing from composer | Extension not enabled in dashboard | `cometchat features enable polls --json` or toggle in dashboard → Features |\n| Extension enabled but UI doesn't appear | Cached session — hard reload needed | Stop `ng serve`, clear browser cache, restart |\n| Extension says enabled but `auto_wired_in_uikit: false` | Needs `.setExtensions([...])` on `UIKitSettingsBuilder` | Add `new PollsExtension()` etc. to the builder — see `cometchat-angular-features` § 2 |\n\n### 2j. Production / auth tokens\n\n| Symptom | Likely cause | Fix |\n|---|---|---|\n| `login({ authToken })` fails: \"user does not exist\" | User not created in CometChat before token mint | Create user server-side via REST API on your signup flow. See `cometchat-angular-production` § 6 |\n| Token endpoint returns 401 | Backend auth check failing | Verify `Authorization: Bearer <jwt>` header is attached to the Angular `HttpClient` request |\n| 429 rate limit on token endpoint | Minting tokens too often (e.g. per component init) | Cache client-side, reuse until expiry |\n| `CometChatUIKit.loginWithAuthToken` not found | Wrong API name | It's `CometChatUIKit.login({ authToken })` — same method as dev, different key |\n\n### 2k. SSR / Angular Universal\n\n| Symptom | Likely cause | Fix |\n|---|---|---|\n| `window is not defined` during SSR | CometChat uses browser APIs | Guard with `isPlatformBrowser(platformId)` — see `cometchat-angular-patterns` § 7 |\n| `document is not defined` during SSR | Same cause | Same fix |\n| Components render on server but throw | CometChat components use browser APIs | Wrap `<cometchat-*>` tags with `*ngIf=\"isBrowser\"` |\n\n---\n\n## 3. Deep dives on common failures\n\n### 3a. \"The most common 'why is my chat blank' bug\"\n\nCometChat components fill 100% of their parent's height. If the parent has no bounded height, the components render at 0px and look empty.\n\nDiagnostic:\n\n```bash\n# Check the parent container of the CometChat component\ngrep -B5 \"cometchat-message-list\\|cometchat-conversations\" src/app/**/*.html\n```\n\nLook for the component's parent. One of these must be true:\n- Parent has `height: 100vh` or `height: 100%`\n- Parent is a flex column with the component getting `flex: 1`\n- Parent has an explicit `height: Npx`\n\nBroken example:\n```html\n<!-- ✗ WRONG — div has no height -->\n<div>\n  <cometchat-message-list [user]=\"selectedUser\"></cometchat-message-list>\n</div>\n```\n\nFixed:\n```html\n<!-- ✓ RIGHT -->\n<div style=\"height: 100vh; display: flex; flex-direction: column;\">\n  <cometchat-message-list\n    [user]=\"selectedUser\"\n    style=\"flex: 1; overflow: hidden;\"\n  ></cometchat-message-list>\n</div>\n```\n\n### 3b. \"Unknown element\" errors for `<cometchat-*>` tags\n\nTwo separate fixes are both required:\n\n1. **Import the component** in the module's `imports` array:\n   ```typescript\n   import { CometChatConversations } from \"@cometchat/chat-uikit-angular\";\n   @NgModule({ imports: [CometChatConversations] })\n   ```\n\n2. **Add `CUSTOM_ELEMENTS_SCHEMA`** to the module's `schemas`:\n   ```typescript\n   import { CUSTOM_ELEMENTS_SCHEMA } from \"@angular/core\";\n   @NgModule({ schemas: [CUSTOM_ELEMENTS_SCHEMA] })\n   ```\n\nBoth are required. Missing either one produces the \"Unknown element\" error.\n\n### 3c. Components render before init completes\n\nThe most reliable fix is `APP_INITIALIZER` (see `cometchat-angular-patterns` § 1). If not using `APP_INITIALIZER`, use `*ngIf=\"isReady\"`:\n\n```typescript\n// app.component.ts\nisReady = false;\n\nngOnInit(): void {\n  CometChatUIKit.init(settings)\n    .then(() => CometChatUIKit.getLoggedinUser())\n    .then((user) => user || CometChatUIKit.login({ uid: \"cometchat-uid-1\" }))\n    .then(() => (this.isReady = true))\n    .catch(console.error);\n}\n```\n\n```html\n<!-- app.component.html -->\n<ng-container *ngIf=\"isReady\">\n  <router-outlet></router-outlet>\n</ng-container>\n```\n\n---\n\n## 4. v3 → v4 upgrade gotchas\n\nIf the user is upgrading from `@cometchat/chat-uikit-angular@3`, these are the common breakages.\n\n| v3 | v4 | Notes |\n|---|---|---|\n| `CometChatTheme` class | `CometChatThemeService` (Angular DI) | Theme is now an injectable service |\n| `CometChatConversationsWithMessages` composite | Still available but configuration API changed | Check `[conversationsConfiguration]` + `[messagesConfiguration]` props |\n| `theme` prop on components | Theme via `CometChatThemeService` only | Per-component theme prop removed |\n| `onClick` callback names | `onItemClick` callback names | Renamed for consistency |\n| `CometChat.login(uid, authKey)` | `CometChatUIKit.login({ uid })` | Object-form argument |\n| Flat settings object | `UIKitSettingsBuilder` | Builder pattern required |\n\n### Upgrade sequence\n\n```bash\n# 1. Update the main kit\nnpm install @cometchat/chat-uikit-angular@latest\n\n# 2. Update peer packages\nnpm install @cometchat/uikit-elements@latest @cometchat/uikit-resources@latest @cometchat/uikit-shared@latest\n\n# 3. Replace flat settings object with UIKitSettingsBuilder\n# 4. Replace CometChatTheme class with CometChatThemeService injection\n# 5. Rename onClick → onItemClick throughout templates\n# 6. Add CUSTOM_ELEMENTS_SCHEMA to all modules (new requirement in v4)\n# 7. Add assets config to angular.json (new requirement in v4)\n# 8. Rebuild + test\n```\n\n---\n\n## 5. Escalation — when the above doesn't solve it\n\n1. **Read the raw error.** Angular errors are usually specific — \"Can't bind to 'user'\" is different from \"NullInjectorError\".\n2. **Check the browser console + Angular DevTools.** Angular DevTools shows the component tree and change detection state.\n3. **Search the upstream docs MCP** (`cometchat-docs` if installed).\n4. **If the issue is a kit bug**, file at https://github.com/cometchat/cometchat-uikit-angular/issues with a minimal repro.\n\n---\n\n## 6. Hard rules (diagnostic best-practice)\n\n1. **Don't assume — triage first.** § 1 gets the schema, assets, init state, and module imports before proposing a fix.\n2. **Don't suggest \"try reinstalling node_modules\" as a first step.** Check the schema, assets config, and module imports first.\n3. **When recommending a rebuild, say why + what to rebuild.** \"`ng build` after adding assets config\" is more useful than \"try rebuilding.\"\n4. **Never guess a fix that requires code changes without first gathering facts.**\n\n---\n\n## Skill routing reference\n\n| Skill | When to route |\n|---|---|\n| `cometchat-angular-core` | Most \"doesn't work\" bugs trace back here — init/login/module setup |\n| `cometchat-angular-components` | Wrong input / slot view / request builder |\n| `cometchat-angular-placement` | Blank chat / bounded-height issues |\n| `cometchat-angular-patterns` | Route guard, lazy loading, SSR, APP_INITIALIZER |\n| `cometchat-angular-theming` | Theme not applying, dark mode not switching |\n| `cometchat-angular-features` | Calls don't work, extension UI missing after enable |\n| `cometchat-angular-customization` | Formatter not rendering, listener not firing, template not showing |\n| `cometchat-angular-production` | 401 on token fetch, user-does-not-exist on login |\n| `cometchat-angular-troubleshooting` | This skill — cross-category diagnosis + v3→v4 upgrade |","tags":["cometchat","angular","troubleshooting","skills","agent-skills","ai-agent","chat","claude-code","cursor","messaging","nextjs","react"],"capabilities":["skill","source-cometchat","skill-cometchat-angular-troubleshooting","topic-agent-skills","topic-ai-agent","topic-chat","topic-claude-code","topic-cometchat","topic-cursor","topic-messaging","topic-nextjs","topic-react","topic-react-native","topic-ui-kit"],"categories":["cometchat-skills"],"synonyms":[],"warnings":[],"endpointUrl":"https://skills.sh/cometchat/cometchat-skills/cometchat-angular-troubleshooting","protocol":"skill","transport":"skills-sh","auth":{"type":"none","details":{"cli":"npx skills add cometchat/cometchat-skills","source_repo":"https://github.com/cometchat/cometchat-skills","install_from":"skills.sh"}},"qualityScore":"0.463","qualityRationale":"deterministic score 0.46 from registry signals: · indexed on github topic:agent-skills · 27 github stars · SKILL.md body (16,185 chars)","verified":false,"liveness":"unknown","lastLivenessCheck":null,"agentReviews":{"count":0,"score_avg":null,"cost_usd_avg":null,"success_rate":null,"latency_p50_ms":null,"narrative_summary":null,"summary_updated_at":null},"enrichmentModel":"deterministic:skill-github:v1","enrichmentVersion":1,"enrichedAt":"2026-05-18T19:04:48.874Z","embedding":null,"createdAt":"2026-05-07T13:05:08.141Z","updatedAt":"2026-05-18T19:04:48.874Z","lastSeenAt":"2026-05-18T19:04:48.874Z","tsv":"'/chat':825 '/cometchat/cometchat-uikit-angular/issues':1832 '/node_modules':198 '0px':1408 '1':111,406,1462,1488,1504,1573,1600,1698,1773,1844,1850 '100':773,1391,1451 '100vh':701,776,1448 '11':1072 '1a':130 '1b':171 '1c':202 '1d':237 '1e':269 '1f':300 '2':319,1219,1522,1707,1792,1864 '2a':324 '2b':464 '2c':582 '2d':658 '2e':781 '2f':870 '2g':962 '2h':1087 '2i':1149 '2j':1220 '2k':1317 '3':1372,1624,1719,1809,1885 '3a':1378 '3b':1491 '3c':1555 '4':1612,1726,1820,1907 '401':1264,2013 '404':594 '429':1280 '480px':754 '5':411,1733,1764 '6':1260,1739,1837 '600px':756 '7':1344,1751 '8':1761 'a5':180 'access':983 'across':55 'activ':799 'ad':648,1898 'add':484,577,600,716,771,1207,1523,1740,1752 'alway':853 'angular':3,7,23,44,81,161,251,317,462,736,782,821,1070,1217,1258,1277,1319,1342,1571,1636,1778,1797,1799,1929,1943,1953,1963,1974,1985,1998,2011,2026 'angular.json':177,182,599,1756 'angular/core':1538 'anim':318,575 'anti':817 'anti-pattern':816 'api':399,1250,1305,1334,1365,1650 'app':216,227,416,427,801,844,868,1123,1566,1577,1970 'app.component.ts':1583 'appcompon':1145 'appcomponent.ngoninit':1118 'appear':1181 'appli':880,1978 'appmodul':558,580 'argument':1687 'array':521,1513 'ask':70 'asset':17,174,181,201,583,596,614,626,638,650,1753,1854,1879,1899 'assum':75,1847 'attach':1274 'auth':33,419,446,457,1222,1266 'authkey':449,1681 'author':1270 'authtoken':1229,1310 'auto':1198 'avail':552,1647 'await':338,1024 'b5':1423 'back':1937 'backend':1265 'bash':142,178,211,245,277,304,1413,1697 'bearer':1271 'best':1842 'best-practic':1841 'bind':524,993,1785 'blank':235,354,792,1386,1955 'block':689 'bootstrap':566 'bound':675,1402,1958 'bounded-height':1957 'bracket':997,1002,1010 'break':814 'breakag':1629 'broken':190,592,609,634,1469 'browser':1191,1333,1364,1795 'browseranimationsmodul':302,306,309,572,578 'bug':1387,1827,1935 'build':444,613,637,642,645,1896 'build.options.assets':607 'builder':1040,1213,1692,1950 'button':1094 'cach':1182,1192,1294 'call':372,376,836,857,882,904,909,1088,1093,1104,1125,1987 'callback':989,1004,1074,1671,1674 'canactiv':852 'catch':1604 'categori':52,2032 'caus':310,329,470,587,664,787,874,966,1091,1153,1226,1323,1352 'chang':1651,1806,1915 'chat':732,760,789,830,1385,1956 'check':652,1042,1267,1414,1652,1793,1876 'class':1634,1729 'claud':37,69 'clear':1190 'client':1296 'client-sid':1295 'code':1914 'collaps':681 'color':921,925,930,935,940 'column':699,1456 'cometchat':2,6,43,80,140,159,184,208,271,285,392,404,409,461,473,496,793,1069,1165,1216,1239,1257,1331,1341,1361,1367,1388,1420,1425,1429,1473,1481,1496,1570,1598,1816,1928,1942,1952,1962,1973,1984,1997,2010,2025 'cometchat-angular-compon':1068,1941 'cometchat-angular-cor':79,1927 'cometchat-angular-custom':1996 'cometchat-angular-featur':1215,1983 'cometchat-angular-pattern':1340,1569,1961 'cometchat-angular-plac':1951 'cometchat-angular-product':460,1256,2009 'cometchat-angular-them':1972 'cometchat-angular-troubleshoot':1,2024 'cometchat-convers':472,495,1428 'cometchat-doc':1815 'cometchat-message-list':1424,1472,1480 'cometchat-uid':403,408,1597 'cometchat.addcalllistener':1116 'cometchat.getuser':1025 'cometchat.login':1679 'cometchat.user':1022 'cometchat/calls-sdk-javascript':1096,1101 'cometchat/chat-uikit-angular':442,515,1518,1623,1705 'cometchat/chat-uikit-angular/assets':199,605 'cometchat/uikit-elements':1713 'cometchat/uikit-resources':1715 'cometchat/uikit-shared':255,440,1717 'cometchatconvers':280,513,1516,1521 'cometchatconversationswithmessag':1644 'cometchatmessag':281 'cometchatmessagelist':282 'cometchatthem':1633,1728 'cometchatthemeservic':549,550,1635,1662,1731 'cometchatuikit.getloggedinuser':1591 'cometchatuikit.init':214,249,412,835,1588 'cometchatuikit.login':377,1309,1595,1682 'cometchatuikit.loginwithauthtoken':1301 'common':1376,1381,1628 'complet':205,233,362,796,862,1560 'compon':59,156,209,229,272,286,295,314,331,358,494,506,534,541,680,726,963,1071,1079,1133,1292,1355,1362,1389,1405,1421,1436,1459,1507,1556,1659,1666,1803,1944 'compos':1159 'composit':1645 'config':18,597,615,627,651,1754,1880,1900 'configur':175,1649 'consist':1678 'consol':1796 'console.error':1605 'constraint':770 'constructor':433,887,890 'contain':346,672,710,724,750,1417,1609 'content':766,780 'convers':474,497,666,1032,1430 'conversationsconfigur':1653 'conversationsrequestbuild':1043 'conversationsstyl':941,952,955 'copi':640 'core':82,1930 'cover':50 'creat':393,1140,1237,1243 'credenti':428 'cross':2031 'cross-categori':2030 'css':929,934 'custom':14,132,145,481,486,920,1524,1534,1541,1741,1999 'dark':898,1979 'dashboard':395,425,1164,1173 'data':1036 'deep':1373 'default':924 'defin':1328,1348 'destroy':820,1136,1148 'detect':1807 'dev':401,1314 'devtool':1798,1800 'di':1637 'diagnos':5,40 'diagnosi':2033 'diagnost':1412,1840 'dialog':733,738,749 'differ':619,1315,1789 'direct':698 'directori':632 'display':688,694 'dist/assets':653 'dive':1374 'doc':1813,1817 'docs/ui-kit/angular/getting-started':101 'docs/ui-kit/angular/troubleshooting':100 'document':1345 'doesn':86,388,707,711,900,1106,1179,1769,1932 'e.g':1290 'effect':945,1015 'either':1548 'element':15,133,146,164,479,482,487,502,1493,1525,1535,1542,1553,1742 'empti':671,1034,1411 'enabl':1162,1167,1176,1196,1995 'endpoint':1262,1285 'ensur':557,567,860,980 'entri':194,603 'environment.prod.ts':451 'error':34,165,268,312,357,467,573,1494,1554,1777,1779 'escal':1765 'etc':972,1210 'even':503 'event':1008 'everi':51,136,166,284 'exampl':1470 'exist':390,1037,1234,2021 'expir':375 'expiri':1300 'explain':96 'explicit':741,1466 'expos':445 'extens':1150,1160,1175,1194,1991 'fact':125,1919 'fail':262,383,413,832,1230,1268 'failur':12,49,54,106,1377 'fals':855,1202,1585 'featur':1166,1174,1218,1986 'fetch':2016 'file':657,1828 'fill':1390 'filter':1041,1044 'fire':991,1075,1127,2005 'first':83,104,896,1027,1849,1874,1884,1917 'first-hand':103 'fix':42,77,129,321,330,471,538,588,665,788,875,967,1092,1154,1227,1324,1354,1478,1500,1564,1863,1911 'flag':225 'flat':243,257,1688,1721 'flex':695,697,1455,1461,1487 'flex-direct':696 'flow':67,1254 'form':1686 'formatt':2000 'found':386,1303 'front':65 'gate':363,1083 'gather':124,1918 'get':1135,1460,1851 'getloggedinus':367,856 'github.com':1831 'github.com/cometchat/cometchat-uikit-angular/issues':1830 'glob':196,602 'gotcha':1616 'grep':143,179,183,212,246,278,305,1422 'ground':98 'guard':806,851,865,1335,1966 'guess':117,1909 'hand':105 'handl':727 'hard':1184,1838 'header':1272 'height':660,676,684,692,700,746,755,764,769,772,775,1396,1403,1447,1450,1467,1959 'height/layout':21 'hex':937 'hidden':715,718,1490 'html':1432,1471,1479,1606 'httpclient':1278 'icon':187,584,589,608,633,656 'id':417 'imag':191,593 'import':20,273,289,303,434,438,508,512,520,536,539,581,1505,1512,1515,1520,1533,1859,1883 'incom':1103 'independ':170 'init':204,222,232,261,336,351,361,380,794,810,834,842,859,861,1082,1293,1559,1855 'init/login':13 'init/login/module':94,1939 'initi':217,228,325,802,845,869,1078,1567,1578,1971 'inject':1642,1732 'input':197,942,1003,1012,1946 'insid':837 'instal':1098,1100,1704,1712,1819 'instanc':1023 'instanti':949 'instead':826,885,1020 'integr':11,48,110,784 'intern':730 'invalid':415 'isbrows':1371 'isn':529 'isplatformbrows':1337 'isreadi':215,224,343,348,366,1086,1581,1584,1611 'issu':22,90,661,1823,1960 'json':195,1169 'key':420,447,1316 'kit':9,46,1702,1826 'known':478,501,532 'latest':1706,1714,1716,1718 'layout':659 'lazi':828,839,1967 'lazy-load':827 'level':849 'like':328,469,586,663,786,873,965,1090,1152,1225,1322 'limit':1047,1282 'list':667,669,706,722,1033,1427,1475,1483 'listen':1112,1126,1129,1142,2003 'listitemview':970 'load':829,1968 'login':326,335,352,370,382,813,1228,2023 'look':219,1410,1433 'lookup':322 'main':1701 'match':628 'matdialog.open':758 'materi':737 'mcp':1814 'messag':668,705,721,1426,1474,1482 'messagesconfigur':1654 'method':1312 'minim':1835 'mint':456,1242,1286 'miss':150,186,308,480,574,595,1095,1157,1547,1993 'mode':107,899,1980 'modul':19,137,153,276,292,465,491,511,518,544,562,576,831,840,1510,1529,1746,1858,1871,1882 'module/component':167 'mount':340,1110,1120 'move':841,888,1141 'must':287,892,1442 'myfn':1000,1007,1060 'n':213,247,279 'name':939,1306,1672,1675 'need':168,1186,1203 'never':1005,1147,1908 'new':951,954,1208,1747,1757 'ng':636,644,1188,1608,1895 'ng-contain':1607 'ngafterviewinit':985 'ngif':342,365,1085,1370,1580,1610 'ngmodul':56,1519,1539 'ngoninit':884,987,1586 'node':1870 'note':1632 'noth':333,974,1053 'npm':1099,1703,1711 'npx':1468 'null':369 'nullinjectorerror':545,1791 'object':244,258,947,961,1031,1685,1690,1723 'object-form':1684 'often':1289 'onclick':1670,1735 'one':1439,1549 'onerror':1073 'onitemclick':988,999,1006,1673,1736 'onthreadrepliesclick':1059 'option':1051,1156 'output':200,236,622,631 'outputpath':618 'overflow':714,717,1489 'overrid':877 'packag':437,1710 'palett':891 'panel':761,1055,1066 'parent':685,704,1394,1399,1416,1438,1445,1452,1463 'pass':259,752,958,1016,1028 'path':623 'pattern':818,1343,1572,1693,1964 'peer':1709 'per':1291,1665 'per-compon':1664 'placement':1954 'plain':960 'platformid':1338 'poll':1155,1168 'pollsextens':1209 'practic':1843 'present':616 'problem':123 'produc':234,1550 'product':32,443,463,612,630,1221,1259,2012 'project':114 'promis':223 'prop':1655,1657,1668 'properti':533 'propos':127,1861 'provid':547,571 'provideanim':568 'providedin':555 'purpos':35 'question':73 'r':144 'rate':1281 'raw':1776 're':422,1139 're-creat':1138 're-verifi':421 'reactiv':908,919 'read':78,113,1774 'real':109 'rebuild':1102,1762,1889,1894,1906 'recommend':1887 'refer':976,1922 'region':418 'regist':1114,1115,1130 'registr':1143 'reinstal':1869 'reliabl':1563 'reload':819,1185 'remov':1669 'renam':1676,1734 'render':188,210,230,332,359,670,897,973,1063,1080,1356,1406,1557,2002 'replac':1720,1727 'repli':1048 'report':121 'repro':1836 'request':1039,1279,1949 'requir':193,252,1503,1546,1694,1748,1758,1913 'resolv':353,381,978,1030 'rest':398,1249 'restart':1193 'return':368,854,1263 'reus':1298 'rgb':938 'right':72 'root':556,561,848,1124,1146 'round':996,1009 'rout':790,798,805,815,850,1921,1926,1965 'router':783 'rule':1839 'run':643,866 'runtim':311 'say':1195,1890 'schema':16,134,147,466,483,485,488,505,1526,1531,1536,1540,1543,1743,1853,1878 'screen':355 'scroll':709,731 'sdk':396 'search':1810 'see':459,1067,1214,1255,1339,1568 'selectedus':1477,1485 'separ':1499 'sequenc':1696 'serv':1189 'server':455,1246,1358 'server-mint':454 'server-sid':1245 'servic':917,1643 'session':374,1183 'set':347,743,894,1589,1689,1722 'setextens':1204 'setmod':903,910 'setprimari':881 'setup':60,95,1940 'show':590,791,922,1108,1801,2008 'side':1247,1297 'sidebar':759 'sidenav':765,779 'signup':1253 'silent':263,414 'sinc':527 'size':742 'skill':1920,1923,2029 'skill-cometchat-angular-troubleshooting' 'slot':968,1947 'small':735 'solv':1771 'source-cometchat' 'specif':1782 'squar':1001 'src':148,250 'src/app':1431 'src/app/app.component.ts':218 'src/app/app.module.ts':283,307 'ssr':25,1318,1330,1350,1969 'standalon':58,155,294,493,565 'state':115,822,1808,1856 'step':1875 'still':1646 'stop':1187 'string':931,1019 'style':946,1486 'subtitleview':971 'suggest':1867 'switch':452,902,1982 'symptom':320,327,468,585,662,785,872,964,1089,1151,1224,1321 'syntax':994 'tabl':323 'tag':141,160,1045,1368,1497 'teach':36 'templat':1738,2006 'test':1763 'theme':871,876,1638,1656,1660,1667,1975,1976 'this.isready':1602 'this.router.navigate':824 'thread':1050,1054,1065 'throughout':1737 'throw':162,265,1360 'toggl':915,1171 'token':458,1223,1241,1261,1284,1287,2015 'topic-agent-skills' 'topic-ai-agent' 'topic-chat' 'topic-claude-code' 'topic-cometchat' 'topic-cursor' 'topic-messaging' 'topic-nextjs' 'topic-react' 'topic-react-native' 'topic-ui-kit' 'trace':91,1936 'tree':1804 'tri':1868,1905 'triag':66,112,1848 'troubleshoot':4,2027 'true':349,1444,1603 'truth':99 'twice':1128 'two':1498 'type':267,1046 'typescript':1514,1532,1582 'ui':8,45,1105,1178,1992 'uid':378,384,405,410,1018,1026,1596,1599,1680,1683 'uikit':1201 'uikitsettingsbuild':239,248,253,429,1206,1691,1725 'univers':24,1320 'unknown':163,1492,1552 'up-front':63 'updat':1699,1708 'upgrad':30,1615,1621,1695,2036 'upstream':1812 'use':139,158,240,299,316,341,402,448,564,693,800,823,867,932,953,995,998,1332,1363,1576,1579,1903 'user':120,387,526,914,1011,1231,1235,1244,1476,1484,1593,1594,1619,1787,2018 'user-does-not-exist':2017 'usual':1781 'v3':27,1613,1630,2034 'v3-to-v4':26 'v4':10,29,47,1614,1631,1750,1760,2035 'valid':928,933 'valu':936 'verifi':423,620,1269 'via':394,1248,1661 'view':969,1948 'viewchild':975,981 'void':1587 'wait':808 'width':744,753 'window':1325 'window.location.reload':811 'wire':1057,1058,1199 'without':1916 'work':89,1934,1990 'wrap':677,1366 'wrong':436,992,1038,1304,1945 'yet':979 'zero':683","prices":[{"id":"a1a2c519-d035-4066-bd84-d4c744c1dfe0","listingId":"73321e9f-e7fc-43db-84c0-74bde78982c9","amountUsd":"0","unit":"free","nativeCurrency":null,"nativeAmount":null,"chain":null,"payTo":null,"paymentMethod":"skill-free","isPrimary":true,"details":{"org":"cometchat","category":"cometchat-skills","install_from":"skills.sh"},"createdAt":"2026-05-07T13:05:08.141Z"}],"sources":[{"listingId":"73321e9f-e7fc-43db-84c0-74bde78982c9","source":"github","sourceId":"cometchat/cometchat-skills/cometchat-angular-troubleshooting","sourceUrl":"https://github.com/cometchat/cometchat-skills/tree/main/skills/cometchat-angular-troubleshooting","isPrimary":false,"firstSeenAt":"2026-05-07T13:05:08.141Z","lastSeenAt":"2026-05-18T19:04:48.874Z"}],"details":{"listingId":"73321e9f-e7fc-43db-84c0-74bde78982c9","quickStartSnippet":null,"exampleRequest":null,"exampleResponse":null,"schema":null,"openapiUrl":null,"agentsTxtUrl":null,"citations":[],"useCases":[],"bestFor":[],"notFor":[],"kindDetails":{"org":"cometchat","slug":"cometchat-angular-troubleshooting","github":{"repo":"cometchat/cometchat-skills","stars":27,"topics":["agent-skills","ai-agent","chat","claude-code","cometchat","cursor","messaging","nextjs","react","react-native","ui-kit"],"license":null,"html_url":"https://github.com/cometchat/cometchat-skills","pushed_at":"2026-05-18T05:04:24Z","description":"Add CometChat chat to any React, Next.js, React Native, Angular, Android, iOS, or Flutter project through your AI coding agent. Works with Claude Code, Cursor, Codex, VS Code Copilot, Windsurf, Cline, Kiro, and 50+ more agents.","skill_md_sha":"8543b2979ea1f9c039849cf194a22fbaddcd60b1","skill_md_path":"skills/cometchat-angular-troubleshooting/SKILL.md","default_branch":"main","skill_tree_url":"https://github.com/cometchat/cometchat-skills/tree/main/skills/cometchat-angular-troubleshooting"},"layout":"multi","source":"github","category":"cometchat-skills","frontmatter":{"name":"cometchat-angular-troubleshooting","license":"MIT","description":"Diagnose CometChat Angular UI Kit v4 integration failures — init/login, CUSTOM_ELEMENTS_SCHEMA, assets config, module imports, height/layout issues, Angular Universal SSR, v3-to-v4 upgrade, and production auth errors.","compatibility":"Angular >=12 <=15; @cometchat/chat-uikit-angular ^4; @cometchat/chat-sdk-javascript ^4"},"skills_sh_url":"https://skills.sh/cometchat/cometchat-skills/cometchat-angular-troubleshooting"},"updatedAt":"2026-05-18T19:04:48.874Z"}}