Type-check throws an error for Analytics.record method using Kinesis provider #9707

vojtech-simko · 2022-03-16T09:01:14Z

Before opening, please confirm:

I have searched for duplicate or closed issues and discussions.
I have read the guide for submitting bug reports.
I have done my best to include a minimal, self-contained set of instructions for consistently reproducing the issue.

JavaScript Framework

Angular

Amplify APIs

Authentication, Analytics, GraphQL API, Storage

Amplify Categories

auth, storage, function, api, analytics

Environment information

# Put output below this line

System:
    OS: macOS 12.0.1
    CPU: (8) arm64 Apple M1
    Memory: 287.09 MB / 16.00 GB
    Shell: 3.2.57 - /bin/bash
  Binaries:
    Node: 16.13.1 - ~/.nvm/versions/node/v16.13.1/bin/node
    npm: 8.1.2 - ~/.nvm/versions/node/v16.13.1/bin/npm
  Browsers:
    Chrome: 99.0.4844.51
    Safari: 15.1
  npmPackages:
    @angular-devkit/build-angular: ^13.2.5 => 13.2.5 
    @angular/animations: ~13.2.5 => 13.2.5 
    @angular/animations/browser:  undefined ()
    @angular/animations/browser/testing:  undefined ()
    @angular/cdk: ^13.2.5 => 13.2.5 
    @angular/cdk/a11y:  undefined ()
    @angular/cdk/accordion:  undefined ()
    @angular/cdk/bidi:  undefined ()
    @angular/cdk/clipboard:  undefined ()
    @angular/cdk/coercion:  undefined ()
    @angular/cdk/collections:  undefined ()
    @angular/cdk/drag-drop:  undefined ()
    @angular/cdk/keycodes:  undefined ()
    @angular/cdk/layout:  undefined ()
    @angular/cdk/observers:  undefined ()
    @angular/cdk/overlay:  undefined ()
    @angular/cdk/platform:  undefined ()
    @angular/cdk/portal:  undefined ()
    @angular/cdk/scrolling:  undefined ()
    @angular/cdk/stepper:  undefined ()
    @angular/cdk/table:  undefined ()
    @angular/cdk/testing:  undefined ()
    @angular/cdk/testing/protractor:  undefined ()
    @angular/cdk/testing/selenium-webdriver:  undefined ()
    @angular/cdk/testing/testbed:  undefined ()
    @angular/cdk/text-field:  undefined ()
    @angular/cdk/tree:  undefined ()
    @angular/cli: ~13.2.5 => 13.2.5 
    @angular/common: ~13.2.5 => 13.2.5 
    @angular/common/http:  undefined ()
    @angular/common/http/testing:  undefined ()
    @angular/common/testing:  undefined ()
    @angular/common/upgrade:  undefined ()
    @angular/compiler: ~13.2.5 => 13.2.5 (9.0.0)
    @angular/compiler-cli: ~13.2.5 => 13.2.5 
    @angular/compiler/testing:  undefined ()
    @angular/core: ~13.2.5 => 13.2.5 (9.0.0)
    @angular/core/testing:  undefined ()
    @angular/forms: ~13.2.5 => 13.2.5 
    @angular/material: ^13.2.5 => 13.2.5 
    @angular/material/autocomplete:  undefined ()
    @angular/material/autocomplete/testing:  undefined ()
    @angular/material/badge:  undefined ()
    @angular/material/badge/testing:  undefined ()
    @angular/material/bottom-sheet:  undefined ()
    @angular/material/bottom-sheet/testing:  undefined ()
    @angular/material/button:  undefined ()
    @angular/material/button-toggle:  undefined ()
    @angular/material/button-toggle/testing:  undefined ()
    @angular/material/button/testing:  undefined ()
    @angular/material/card:  undefined ()
    @angular/material/card/testing:  undefined ()
    @angular/material/checkbox:  undefined ()
    @angular/material/checkbox/testing:  undefined ()
    @angular/material/chips:  undefined ()
    @angular/material/chips/testing:  undefined ()
    @angular/material/core:  undefined ()
    @angular/material/core/testing:  undefined ()
    @angular/material/datepicker:  undefined ()
    @angular/material/datepicker/testing:  undefined ()
    @angular/material/dialog:  undefined ()
    @angular/material/dialog/testing:  undefined ()
    @angular/material/divider:  undefined ()
    @angular/material/divider/testing:  undefined ()
    @angular/material/expansion:  undefined ()
    @angular/material/expansion/testing:  undefined ()
    @angular/material/form-field:  undefined ()
    @angular/material/form-field/testing:  undefined ()
    @angular/material/form-field/testing/control:  undefined ()
    @angular/material/grid-list:  undefined ()
    @angular/material/grid-list/testing:  undefined ()
    @angular/material/icon:  undefined ()
    @angular/material/icon/testing:  undefined ()
    @angular/material/input:  undefined ()
    @angular/material/input/testing:  undefined ()
    @angular/material/list:  undefined ()
    @angular/material/list/testing:  undefined ()
    @angular/material/menu:  undefined ()
    @angular/material/menu/testing:  undefined ()
    @angular/material/paginator:  undefined ()
    @angular/material/paginator/testing:  undefined ()
    @angular/material/progress-bar:  undefined ()
    @angular/material/progress-bar/testing:  undefined ()
    @angular/material/progress-spinner:  undefined ()
    @angular/material/progress-spinner/testing:  undefined ()
    @angular/material/radio:  undefined ()
    @angular/material/radio/testing:  undefined ()
    @angular/material/select:  undefined ()
    @angular/material/select/testing:  undefined ()
    @angular/material/sidenav:  undefined ()
    @angular/material/sidenav/testing:  undefined ()
    @angular/material/slide-toggle:  undefined ()
    @angular/material/slide-toggle/testing:  undefined ()
    @angular/material/slider:  undefined ()
    @angular/material/slider/testing:  undefined ()
    @angular/material/snack-bar:  undefined ()
    @angular/material/snack-bar/testing:  undefined ()
    @angular/material/sort:  undefined ()
    @angular/material/sort/testing:  undefined ()
    @angular/material/stepper:  undefined ()
    @angular/material/stepper/testing:  undefined ()
    @angular/material/table:  undefined ()
    @angular/material/table/testing:  undefined ()
    @angular/material/tabs:  undefined ()
    @angular/material/tabs/testing:  undefined ()
    @angular/material/toolbar:  undefined ()
    @angular/material/toolbar/testing:  undefined ()
    @angular/material/tooltip:  undefined ()
    @angular/material/tooltip/testing:  undefined ()
    @angular/material/tree:  undefined ()
    @angular/material/tree/testing:  undefined ()
    @angular/platform-browser: ~13.2.5 => 13.2.5 
    @angular/platform-browser-dynamic: ~13.2.5 => 13.2.5 
    @angular/platform-browser-dynamic/testing:  undefined ()
    @angular/platform-browser/animations:  undefined ()
    @angular/platform-browser/testing:  undefined ()
    @angular/router: ~13.2.5 => 13.2.5 
    @angular/router/testing:  undefined ()
    @angular/router/upgrade:  undefined ()
    @angular/youtube-player: ^13.2.5 => 13.2.5 
    @aws-amplify/analytics: ^5.2.1 => 5.2.1 (4.0.22)
    @aws-amplify/api: ^4.0.34 => 4.0.34 (3.3.3)
    @aws-amplify/api-graphql: ^2.2.23 => 2.2.23 (1.3.3)
    @aws-amplify/auth: ^4.4.3 => 4.4.3 (3.4.34)
    @aws-amplify/storage: ^4.4.17 => 4.4.17 (3.4.4)
    @aws-amplify/ui-angular: 1.0.5 => 1.0.5 
    @fullcalendar/angular: ^5.10.1 => 5.10.2 
    @fullcalendar/daygrid: ^5.10.1 => 5.10.1 
    @fullcalendar/interaction: ^5.10.1 => 5.10.1 
    @fullcalendar/list: ^5.10.1 => 5.10.1 
    @graphql-tools/webpack-loader: ^6.6.1 => 6.6.1 
    @kolkov/angular-editor: ^1.1.7 => 1.1.7 
    @ngneat/svg-icon: ^4.1.0 => 4.1.0 
    @swimlane/dragula: ^3.8.0 => 3.8.0 
    @swimlane/ngx-dnd: ^9.0.0 => 9.0.0 
    @types/dragula: ^3.7.0 => 3.7.0 (2.1.35)
    @types/jasmine: ~3.6.0 => 3.6.11 
    @types/jasminewd2: ^2.0.9 => 2.0.9 
    @types/node: ^12.20.13 => 12.20.13 
    @types/webrtc: 0.0.26 => 0.0.26 
    angular2-toaster: ^11.0.1 => 11.0.1 
    aws-amplify: ^4.3.16 => 4.3.16 (3.4.3)
    aws-sdk: ^2.1085.0 => 2.1085.0 
    codelyzer: ^6.0.0 => 6.0.2 
    commander: ^9.0.0 => 9.0.0 (2.20.3, 4.1.1, 7.2.0, 2.13.0)
    example-typescript:  1.0.0 
    flatpickr: ^4.6.6 => 4.6.9 
    jasmine-core: ~3.6.0 => 3.6.0 (2.8.0)
    jasmine-spec-reporter: ~5.0.0 => 5.0.2 
    karma: ~6.3.17 => 6.3.17 
    karma-chrome-launcher: ~3.1.0 => 3.1.0 
    karma-coverage-istanbul-reporter: ~3.0.2 => 3.0.3 
    karma-jasmine: ~4.0.0 => 4.0.1 
    karma-jasmine-html-reporter: ^1.5.0 => 1.6.0 
    ng2-flatpickr: ^9.0.0 => 9.0.0 
    ngx-chips: ^2.2.2 => 2.2.2 
    ngx-draggable-dom: ^2.3.0 => 2.3.0 
    ngx-file-drop: ^13.0.0 => 13.0.0 
    node-example:  1.0.0 
    openvidu-browser: ^2.17.0 => 2.17.0 
    protractor: ~7.0.0 => 7.0.0 
    protractor-example:  1.0.0 
    rxjs: ~6.5.5 => 6.5.5 (6.6.7, 7.5.4)
    rxjs/ajax:  undefined ()
    rxjs/fetch:  undefined ()
    rxjs/internal-compatibility:  undefined ()
    rxjs/operators:  undefined ()
    rxjs/testing:  undefined ()
    rxjs/webSocket:  undefined ()
    svg-to-ts: ^7.1.0 => 7.1.0 
    ts-node: ~8.3.0 => 8.3.0 
    tslint: ~6.1.0 => 6.1.3 
    typescript: ~4.5.5 => 4.5.5 (3.9.10)
    typescript-example:  1.0.0 
    uuid: ^8.3.2 => 8.3.2 (3.4.0, 3.3.2, 8.3.1)
    wavesurfer.js: ^4.6.0 => 4.6.0 
    zone-mix:  undefined ()
    zone-node:  undefined ()
    zone-testing:  undefined ()
    zone.js: ~0.11.4 => 0.11.4 (0.10.3)
    zone.js/async-test:  undefined ()
    zone.js/async-test.min:  undefined ()
    zone.js/fake-async-test:  undefined ()
    zone.js/fake-async-test.min:  undefined ()
    zone.js/jasmine-patch:  undefined ()
    zone.js/jasmine-patch.min:  undefined ()
    zone.js/long-stack-trace-zone:  undefined ()
    zone.js/long-stack-trace-zone.min:  undefined ()
    zone.js/mocha-patch:  undefined ()
    zone.js/mocha-patch.min:  undefined ()
    zone.js/proxy:  undefined ()
    zone.js/proxy.min:  undefined ()
    zone.js/sync-test:  undefined ()
    zone.js/sync-test.min:  undefined ()
    zone.js/task-tracking:  undefined ()
    zone.js/task-tracking.min:  undefined ()
    zone.js/webapis-media-query:  undefined ()
    zone.js/webapis-media-query.min:  undefined ()
    zone.js/webapis-notification:  undefined ()
    zone.js/webapis-notification.min:  undefined ()
    zone.js/webapis-rtc-peer-connection:  undefined ()
    zone.js/webapis-rtc-peer-connection.min:  undefined ()
    zone.js/webapis-shadydom:  undefined ()
    zone.js/webapis-shadydom.min:  undefined ()
    zone.js/wtf:  undefined ()
    zone.js/wtf.min:  undefined ()
    zone.js/zone-bluebird:  undefined ()
    zone.js/zone-bluebird.min:  undefined ()
    zone.js/zone-error:  undefined ()
    zone.js/zone-error.min:  undefined ()
    zone.js/zone-legacy:  undefined ()
    zone.js/zone-legacy.min:  undefined ()
    zone.js/zone-patch-canvas:  undefined ()
    zone.js/zone-patch-canvas.min:  undefined ()
    zone.js/zone-patch-cordova:  undefined ()
    zone.js/zone-patch-cordova.min:  undefined ()
    zone.js/zone-patch-electron:  undefined ()
    zone.js/zone-patch-electron.min:  undefined ()
    zone.js/zone-patch-fetch:  undefined ()
    zone.js/zone-patch-fetch.min:  undefined ()
    zone.js/zone-patch-jsonp:  undefined ()
    zone.js/zone-patch-jsonp.min:  undefined ()
    zone.js/zone-patch-message-port:  undefined ()
    zone.js/zone-patch-message-port.min:  undefined ()
    zone.js/zone-patch-promise-test:  undefined ()
    zone.js/zone-patch-promise-test.min:  undefined ()
    zone.js/zone-patch-resize-observer:  undefined ()
    zone.js/zone-patch-resize-observer.min:  undefined ()
    zone.js/zone-patch-rxjs:  undefined ()
    zone.js/zone-patch-rxjs-fake-async:  undefined ()
    zone.js/zone-patch-rxjs-fake-async.min:  undefined ()
    zone.js/zone-patch-rxjs.min:  undefined ()
    zone.js/zone-patch-socket-io:  undefined ()
    zone.js/zone-patch-socket-io.min:  undefined ()
    zone.js/zone-patch-user-media:  undefined ()
    zone.js/zone-patch-user-media.min:  undefined ()
  npmGlobalPackages:
    @angular/cli: 13.1.3
    @aws-amplify/cli: 7.6.23
    corepack: 0.10.0
    npm: 8.1.2
    stardio-pro: 0.0.0
    uuid: 8.3.2

Describe the bug

After upgrading from aws-amplify@3.4.3 to aws-amplify@4.3.16 and later to modular packages @aws-amplify/... type-checking throws an error for Amplify.record method when trying to stream data via AWSKinesisProvider. (problem is there if I import Amplify from aws-amplify as well as from @aws-amplify/analytics)

In documentation it's written:

# You can send a data to a Kinesis stream with the standard record() method:

Analytics.record({
    data: { 
        // The data blob to put into the record
    },
    // OPTIONAL
    partitionKey: 'myPartitionKey', 
    streamName: 'myKinesisStream'
}, 'AWSKinesis');

But when I try to use it this way it throws an error:

No overload matches this call.
  Overload 1 of 2, '(event: AnalyticsEvent, provider?: string): any', gave the following error.
    Argument of type '{ data: { ... }; streamName: string; }' is not assignable to parameter of type 'AnalyticsEvent'.
      Object literal may only specify known properties, and 'data' does not exist in type 'AnalyticsEvent'.
  Overload 2 of 2, '(eventName: string, attributes?: EventAttributes, metrics?: EventMetrics): any', gave the following error.
    Argument of type '{ data: { ... }; streamName: string; }' is not assignable to parameter of type 'string'.

I assume the problem is caused by AnalyticsEvent only defining structure for sending events to Pinpoint and not Kinesis.

Expected behavior

Analytics.record should allow me to send events via Kinesis provider without type-check errors.

Reproduction steps

npm i aws-amplify or npm i @aws-amplify/core @aws-amplify/analytics
In main app file configure Amplify

import { Amplify } from '@aws-amplify/core';
import awsconfig from './aws-exports';

Amplify.configure(awsconfig);

Import analytics from @aws-amplify/analytics

import { Analytics, AWSKinesisProvider } from '@aws-amplify/analytics';

Configure analytics and add KinesisProvider pluggable

import awsconfig from 'src/aws-exports';

Analytics.addPluggable(new AWSKinesisProvider());
Analytics.configure({
    AWSKinesis: {
        region: awsconfig.aws_project_region
    }
});

Try to send event to Kinesis

let streamName =
    'events-' + awsconfig.aws_user_files_s3_bucket.split('-')[1];
    
Analytics.record(
        {
            data: {
                // ... some data here
            },
            streamName
        },
        'AWSKinesis'
    );

Code Snippet

// Put your code below this line.

Log output

// Put your logs below this line

Error: src/app/core/providers/analytics.provider.ts:15:5 - error TS2769: No overload matches this call.
  Overload 1 of 2, '(event: AnalyticsEvent, provider?: string): any', gave the following error.
    Argument of type '{ data: { ... }; streamName: string; }' is not assignable to parameter of type 'AnalyticsEvent'.
      Object literal may only specify known properties, and 'data' does not exist in type 'AnalyticsEvent'.
  Overload 2 of 2, '(eventName: string, attributes?: EventAttributes, metrics?: EventMetrics): any', gave the following error.
    Argument of type '{ data: { ... }; streamName: string; }' is not assignable to parameter of type 'string'.

 15     Analytics.record(
        ~~~~~~~~~~~~~~~~~
 16         {
    ~~~~~~~~~
... 
 25         'AWSKinesis'
    ~~~~~~~~~~~~~~~~~~~~
 26     );
    ~~~~~

aws-exports.js

No response

Manual configuration

No response

Additional configuration

No response

Mobile Device

No response

Mobile Operating System

No response

Mobile Browser

No response

Mobile Browser Version

No response

Additional information and screenshots

No response

The text was updated successfully, but these errors were encountered:

chrisbonifacio · 2022-03-16T16:17:35Z

Hi @vojtech-simko 👋 thanks for raising this issue. I was able to reproduce the error and will label this as a bug for the team to look into further.

vojtech-simko · 2022-03-17T07:25:01Z

Thank you @chrisbonifacio 👍

christian-becker-ta · 2022-06-27T06:25:07Z

Any update on this or workaround?
I have currently the issue, that my amplify application does not send the records to Kinesis stream, and therefore or do not get a trigger on my lambda function for post-process the data.

Would be happy about some hints.

chkrause · 2022-06-27T11:42:37Z

I'm highly interested in a solution to this issue. Do you have a timeline until when it will be fixed?

manickgm · 2022-08-09T02:29:18Z

I have worked around this issue by using the Kinesis pluggable provider itself.

amplify-js/packages/analytics/src/Providers/AWSKinesisProvider.ts

Line 96 in f6e2ca2

public async record(params): Promise<boolean> {

The sample code is as follows:

    const KinesisProvider = Analytics.getPluggable('AWSKinesis');
    KinesisProvider.record({
        event:{
        data: "Hello world",
        partitionKey: 'myPartitionKey', 
        streamName: 'firstangulartrialKinesis-dev' // Please refer "kinesisStreamId" output of the amplify-meta json for the correct stream name created by Amplify. 'amplify/backend/amplify-meta.json'
        },
       provider:"AWSKinesis"
      })

Please make Kinesis Provider is registered before this.

import { Analytics, AWSKinesisProvider } from 'aws-amplify';
Analytics.addPluggable(new AWSKinesisProvider());

Please confirm if this works for you.

ashika01 · 2022-08-16T18:29:05Z

Hi this issue is now fixed and merged in the latest release. Please let us know if this is still an issue and we can re-open this issue.

chrisbonifacio self-assigned this Mar 16, 2022

chrisbonifacio added Analytics Related to analytics pending-triage Issue is pending triage labels Mar 16, 2022

chrisbonifacio added TypeScript Related to TypeScript issues bug Something isn't working and removed pending-triage Issue is pending triage labels Mar 16, 2022

ashika01 mentioned this issue Aug 9, 2022

Fix: Analytics Type issue #10185

Merged

ashika01 closed this as completed Aug 16, 2022

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Type-check throws an error for Analytics.record method using Kinesis provider #9707

Type-check throws an error for Analytics.record method using Kinesis provider #9707

vojtech-simko commented Mar 16, 2022

chrisbonifacio commented Mar 16, 2022

vojtech-simko commented Mar 17, 2022

christian-becker-ta commented Jun 27, 2022

chkrause commented Jun 27, 2022

manickgm commented Aug 9, 2022

ashika01 commented Aug 16, 2022

Type-check throws an error for Analytics.record method using Kinesis provider #9707

Type-check throws an error for Analytics.record method using Kinesis provider #9707

Comments

vojtech-simko commented Mar 16, 2022

Before opening, please confirm:

JavaScript Framework

Amplify APIs

Amplify Categories

Environment information

Describe the bug

Expected behavior

Reproduction steps

Code Snippet

Log output

aws-exports.js

Manual configuration

Additional configuration

Mobile Device

Mobile Operating System

Mobile Browser

Mobile Browser Version

Additional information and screenshots

chrisbonifacio commented Mar 16, 2022

vojtech-simko commented Mar 17, 2022

christian-becker-ta commented Jun 27, 2022

chkrause commented Jun 27, 2022

manickgm commented Aug 9, 2022

ashika01 commented Aug 16, 2022