amplify-js: AWS Amplify with Angular - Appsync, API, Datastore error "DataStore - Sync error subscription failed Connection failed, Validation error of type FieldUndefined: Field '_version' in type"

Describe the bug I have followed https://aws-amplify.github.io/docs/js/datastore to create demo angular application for offline syncup with API and datastore. but it is showing below error.

ConsoleLogger.js:94 [WARN] 26:09.704 DataStore - Sync error subscription failed Connection failed: {"errors":[ {"message":"Validation error of type FieldUndefined: Field '_version' in type 'Post' is undefined @ 'onCreatePost/_version'"}, {"message":"Validation error of type FieldUndefined: Field '_lastChangedAt' in type 'Post' is undefined @ 'onCreatePost/_lastChangedAt'"}, {"message":"Validation error of type FieldUndefined: Field '_deleted' in type 'Post' is undefined @ 'onCreatePost/_deleted'"}]} message: "Validation error of type FieldUndefined: Field 'syncPosts' in type 'Query' is undefined @ 'syncPosts'"

To Reproduce Steps to reproduce the behavior:

ng new testApp
cd testApp
npm install -g @aws-amplify/cli
amplify configure
npm install --save aws-amplify
npm install --save aws-amplify-angular
amplify init

[Note the selected steps: ? Choose the type of app that you’re building: javascript ? Please tell us about your project? What javascript framework are you using: angular] amplify add api [Note the steps Selected: ? Choose an authorization type for the API Amazon: API Key ? Do you have an annotated GraphQL schema? No ? Do you want a guided schema creation? Yes ? What best describes your project: Single object with fields (e.g., “Todo” with ID, name, description) ? Do you want to edit the schema now? Yes ] Schema added in amplify/backend/api/amplifyapi/schema.graphql is as below: type Todo @model { id: ID! name: String! description: String } enum PostStatus { ACTIVE INACTIVE } type Post @model { id: ID! title: String! rating: Int! status: PostStatus! } amplify codegen models

Now add below lines in main.ts import Amplify from 'aws-amplify'; import awsconfig from './aws-exports'; Amplify.configure(awsconfig);

Add below code in app.component.ts

import { DataStore, Predicates } from '@aws-amplify/datastore';
import { Post, PostStatus } from '../../models';
import {from, Observable} from 'rxjs';

on ngOnInit hook add below code: await DataStore.save( new Post({ title: Created! ${Date.now()}, rating: 1, status: PostStatus.ACTIVE }) );

After that it shows added record using below code: this.postlist = await DataStore.query(Post as any); console.log(this.postlist);

Everything works fine up to this as this is in local data store only. Now i want to sync this with aws cloud dynamodb. so i run below command amplify push

and add below code to observe and sync data dynamically to ngOnInit hook in my app component: DataStore.observe(Post as any).subscribe(msg => { this.postlist = await DataStore.query(Post as any); console.log(this.postlist); }); After adding above code, expected behavior is it should syncup local data to dynamodb cloud but it is not.

At this stage it is not syncing with cloud and showing below error: ConsoleLogger.js:94 [WARN] 26:09.704 DataStore - Sync error subscription failed Connection failed: {"errors":[ {"message":"Validation error of type FieldUndefined: Field '_version' in type 'Post' is undefined @ 'onCreatePost/_version'"}, {"message":"Validation error of type FieldUndefined: Field '_lastChangedAt' in type 'Post' is undefined @ 'onCreatePost/_lastChangedAt'"}, {"message":"Validation error of type FieldUndefined: Field '_deleted' in type 'Post' is undefined @ 'onCreatePost/_deleted'"}]} message: "Validation error of type FieldUndefined: Field 'syncPosts' in type 'Query' is undefined @ 'syncPosts'"

Note that everything working fine in local but issue is with syncup with cloud. Note: I did not run npx amplify-app@latest command

My package.json is: { "name": "testApp", "version": "0.0.0", "scripts": { "ng": "ng", "start": "ng serve", "build": "ng build", "test": "ng test", "lint": "ng lint", "e2e": "ng e2e" }, "private": true, "dependencies": { "@angular/animations": "~8.2.4", "@angular/common": "~8.2.4", "@angular/compiler": "~8.2.4", "@angular/core": "~8.2.4", "@angular/forms": "~8.2.4", "@angular/platform-browser": "~8.2.4", "@angular/platform-browser-dynamic": "~8.2.4", "@angular/router": "~8.2.4", "@aws-amplify/core": "^2.2.2", "@aws-amplify/datastore": "^1.0.4", "@ng-bootstrap/ng-bootstrap": "^5.2.1", "aws-amplify": "^2.2.2", "aws-amplify-angular": "^4.1.3", "bootstrap": "^4.4.1", "buffer": "^5.4.3", "rxjs": "~6.4.0", "tslib": "^1.10.0", "zone.js": "~0.9.1" }, "devDependencies": { "@angular-devkit/build-angular": "~0.803.2", "@angular/cli": "~8.3.2", "@angular/compiler-cli": "~8.2.4", "@angular/language-service": "~8.2.4", "@types/node": "~8.9.4", "@types/jasmine": "~3.3.8", "@types/jasminewd2": "~2.0.3", "codelyzer": "^5.0.0", "jasmine-core": "~3.4.0", "jasmine-spec-reporter": "~4.2.1", "karma": "~4.1.0", "karma-chrome-launcher": "~2.2.0", "karma-coverage-istanbul-reporter": "~2.0.1", "karma-jasmine": "~2.0.1", "karma-jasmine-html-reporter": "^1.4.0", "protractor": "~5.4.0", "ts-node": "~7.0.0", "tslint": "~5.15.0", "typescript": "~3.5.3" } }

Expected behavior It should syncup local data to cloud dynamo db. but is is not storing data in cloud dynamodb