yociduo / ngx-pendo Goto Github PK
View Code? Open in Web Editor NEWA simple wrapper to load Pendo by angular way
License: MIT License
A simple wrapper to load Pendo by angular way
License: MIT License
Migrating angular version to v12 will not fetch the right version from npm repository.
run ng add ngx-pend
:
error:
An unhandled exception occurred: Collection "/Users/gming001/Code/angular/ngx-demo-app/node_modules/ngx-pendo/schematics/collection.json" cannot be resolved.
Do you have any plans to support pendo.identify(...)
? For example, if pendo.initialize(...)
has been called at first when a user is viewing non-authenticated content, but later has to sign in and later you know their user details. The docs seem to advise against calling pendo.initialize()
multiple times as they says it leads to _noise analytics_
so I was wondering if pendo.identify()
is needed here to update with the now known user details.
Should probably be marked breaking change and a major ngx-pendo version?
I upgrade from angular 9 to 10 and I get
ERROR in The target entry-point "ngx-pendo" has missing dependencies:
ERROR in The target entry-point "ngx-pendo" has missing dependencies:
- ./lib/ngx-pendo-id.directive
- ./lib/ngx-pendo-section.directive
- ./lib/ngx-pendo.service
- ./lib/ngx-pendo.component
- ./lib/ngx-pendo.injectors
- ./lib/ngx-pendo.interfaces
- ./lib/ngx-pendo.module
I'm having trouble building my application which is on top of nx. I keep getting the Can't import the named export X from non EcmaScript module
error. This is due to this library building to mjs files. Are there any resolutions/suggestions for this issue? thanks
Error: node_modules/ngx-pendo/lib/ngx-pendo-id.directive.d.ts:18:90 - error TS2344: Type '{ pendoId: { alias: "ngx-pendo-id"; required: false; }; inherit: { alias: "ngx-pendo-inherit"; required: false; }; }' does not satisfy the constraint '{ [key: string]: string; }'.
Property '"pendoId"' is incompatible with index signature.
Type '{ alias: "ngx-pendo-id"; required: false; }' is not assignable to type 'string'.
18 static ɵdir: i0.ɵɵDirectiveDeclaration<NgxPendoIdDirective, "[ngx-pendo-id]", never, { "pendoId": { "alias": "ngx-pendo-id"; "required": false; }; "inherit": { "alias": "ngx-pendo-inherit"; "required": false; }; }, {}, never, never, false, never>;
Error: node_modules/ngx-pendo/lib/ngx-pendo-section.directive.d.ts:18:100 - error TS2344: Type '{ pendoSection: { alias: "ngx-pendo-section"; required: false; }; inherit: { alias: "ngx-pendo-inherit"; required: false; }; }' does not satisfy the constraint '{ [key: string]: string; }'.
Property '"pendoSection"' is incompatible with index signature.
Type '{ alias: "ngx-pendo-section"; required: false; }' is not assignable to type 'string'.
18 static ɵdir: i0.ɵɵDirectiveDeclaration<NgxPendoSectionDirective, "[ngx-pendo-section]", never, { "pendoSection": { "alias": "ngx-pendo-section"; "required": false; }; "inherit": { "alias": "ngx-pendo-inherit"; "required": false; }; }, {}, ["idDirectives", "sectionDirectives", "allIdDirectives"], never, false, never>;
If for some reason the application cannot obtain the js file (for instance something wrong in nginx or someone blocked it) the whole application breaks.
This shouldn't happen.
To fix this, all you need to do is not to reject the promise in
ngx-pendo.injector.js
I have a PR ready but don't have access to push it...
Angular 13 - trying to use this component, and getting an injection error:
import { NgxPendoService } from 'ngx-pendo';
...
constructor(private featureFlagsService: FeatureFlagsService,
private tokenService: TokenService,
protected pendoService: NgxPendoService ) {
==============================================
ERROR Error: Uncaught (in promise): NullInjectorError: R3InjectorError(AppModule)[NgxPendoService -> NgxPendoService -> NgxPendoService]:
NullInjectorError: No provider for NgxPendoService!
NullInjectorError: R3InjectorError(AppModule)[NgxPendoService -> NgxPendoService -> NgxPendoService]:
NullInjectorError: No provider for NgxPendoService!
at NullInjector.get (core.mjs:11095:1)
at R3Injector.get (core.mjs:11262:1)
at R3Injector.get (core.mjs:11262:1)
at R3Injector.get (core.mjs:11262:1)
at NgModuleRef.get (core.mjs:21807:1)
at Object.get (core.mjs:21484:1)
at lookupTokenUsingModuleInjector (core.mjs:3334:1)
at getOrCreateInjectable (core.mjs:3446:1)
at Module.ɵɵdirectiveInject (core.mjs:14381:1)
at NodeInjectorFactory.PendoAnalyticsComponent_Factory [as factory] (pendo-analytics.component.ts:13:37)
at resolvePromise (zone.js:1213:1)
at resolvePromise (zone.js:1167:1)
at zone.js:1279:1
at ZoneDelegate.invokeTask (zone.js:406:1)
at Object.onInvokeTask (core.mjs:25444:1)
at ZoneDelegate.invokeTask (zone.js:405:1)
at Zone.runTask (zone.js:178:1)
at drainMicroTaskQueue (zone.js:582:1)
at ZoneTask.invokeTask [as invoke] (zone.js:491:1)
at invokeTask (zone.js:1600:1)
Also, it's not clear - does the code snippet in the still required? I tried it both ways without success.
The IDE can find NgxPendoService just fine and shows no errors. Does the service need to be added in a separate place?
Thanks
Error: node_modules/ngx-pendo/lib/ngx-pendo-id.directive.d.ts:18:90 - error TS2344: Type '{ pendoId: { alias: "ngx-pendo-id"; required: false; }; inherit: { alias: "ngx-pendo-inherit"; required: false; }; }' does not satisfy the constraint '{ [key: string]: string; }'.
Property '"pendoId"' is incompatible with index signature.
Type '{ alias: "ngx-pendo-id"; required: false; }' is not assignable to type 'string'.
static ɵdir: i0.ɵɵDirectiveDeclaration<NgxPendoIdDirective, "[ngx-pendo-id]", never, { "pendoId": { "alias": "ngx-pendo-id"; "required": false; }; "inherit": { "alias": "ngx-pendo-inherit"; "required": false; }; }, {}, never, never, false, never>;
Hi! We're using Pendo from within the EU, which requires us to use a different script host (https://cdn.eu.pendo.io). I would like to propose adding a optional script host url to the plugin's settings:
export interface IPendoSettings {
pendoApiKey: string;
pendoScriptHost?: string;
pendoIdFormatter?: (pendoId: string) => string;
}
I have prepared a PR but I cannot upload it without write access to the repo, of course.
Hi, any plans to add updateOptions
method to the service? I sometimes need to update the metadata sent to pendo and calling ngxPendoService.initialize
over and over again yields this error in the console:
[Agent] pendo.initialize only needs to be called once.
Use pendo.updateOptions to update metadata after the agent has initialized.
Thanks for creating this wrapper!
Would it be possible to make the naming convention of the id configurable?
<div ngx-pendo-section="section">
<button ngx-pendo-id="click_test">Click Test</button>
</div>
ngx-pendo-section => my-custom-section
ngx-pendo-id => my-custom-id
Hello,
our CI broke when updating ngx-pendo from 1.3.0 to 1.5.1
Using angular 9.
Seems to be an issue because we are using es5
as the target
in out tsconfig.json
, while if we target
es2015
the build compiles.
Since we skipped 1.4.0 I'm not sure when the issue 1st started happening and if this was intentional to ditch es5
?
Thanks
Compiling ngx-pendo : module as esm5 Warning: Invalid constructor parameter decorator in /home/travis/build/Cognism/prospector-ui/node_modules/ngx-pendo/fesm2015/ngx-pendo.js: () => [ { type: undefined, decorators: [{ type: Inject, args: [NGX_PENDO_SETTINGS_TOKEN,] }] } ] Error: getInternalNameOfClass() called on a non-ES5 class: expected NgxPendoService to have an inner class declaration at Esm5ReflectionHost.getInternalNameOfClass (/home/travis/build/Cognism/prospector-ui/node_modules/@angular/compiler-cli/ngcc/src/host/esm5_host.js:88:23) at DelegatingReflectionHost.getInternalNameOfClass (/home/travis/build/Cognism/prospector-ui/node_modules/@angular/compiler-cli/ngcc/src/host/delegating_host.js:89:34) at extractInjectableMetadata (/home/travis/build/Cognism/prospector-ui/node_modules/@angular/compiler-cli/src/ngtsc/annotations/src/injectable.js:125:69) at InjectableDecoratorHandler.analyze (/home/travis/build/Cognism/prospector-ui/node_modules/@angular/compiler-cli/src/ngtsc/annotations/src/injectable.js:66:24) at NgccTraitCompiler.TraitCompiler.analyzeTrait (/home/travis/build/Cognism/prospector-ui/node_modules/@angular/compiler-cli/src/ngtsc/transform/src/compilation.js:345:40) at analyze (/home/travis/build/Cognism/prospector-ui/node_modules/@angular/compiler-cli/src/ngtsc/transform/src/compilation.js:297:58) at _loop_1 (/home/travis/build/Cognism/prospector-ui/node_modules/@angular/compiler-cli/src/ngtsc/transform/src/compilation.js:319:21) at NgccTraitCompiler.TraitCompiler.analyzeClass (/home/travis/build/Cognism/prospector-ui/node_modules/@angular/compiler-cli/src/ngtsc/transform/src/compilation.js:325:35) at NgccTraitCompiler.analyzeFile (/home/travis/build/Cognism/prospector-ui/node_modules/@angular/compiler-cli/ngcc/src/analysis/ngcc_trait_compiler.js:47:26) at DecorationAnalyzer.analyzeProgram (/home/travis/build/Cognism/prospector-ui/node_modules/@angular/compiler-cli/ngcc/src/analysis/decoration_analyzer.js:134:39) An unhandled exception occurred: NGCC failed.
Schematics not support for @angular/[email protected]
ng add ngx-pendo
Skipping installation: Package already installed
Cannot find module '\node_modules@schematics\angular\private\components.js'
App loading gets blocked if there is some issue with the pendo url/connectivity. I see there is no error handling. In order to replicate, just block the pendo url using dev tools and the app just hangs. Ideally, it should allow app to load even if there is an issue with pendo.
It seems like there hasn't been a new release of this package after the update to angular 15, which breaks projects using this package. The reason for this seems to be that the CircleCI pipeline failed for some reason.
I understand that you don't have time to update the project the same minute as new versions of Angular are released, but I would recommend that you use ranges in the peerDependencies that allow people to update to new versions when they like. Because Angular always leave a feature for 2 more versions after they've deprecated it, you don't need to worry that ngx-pendo will be broken in later releases.
I would suggest that you set the peerDependencies versions to ">= 15.0.0 < 18.0.0"
now, and some time after Angular 16 is released, you change it to ">= 16.0.0 < 19.0.0"
etc. Every time you do an update, you check if there are any deprecation warnings. You fix those warnings whenever you have time to, without any stress, knowing that it will still work for more than one year.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.