Getting a timestamp error in an angular app and firebase integration

Question

I am developing an Angular app with firebase.

This is the error that I am getting:

The behavior for Date objects stored in Firestore is going to change AND YOUR APP MAY BREAK. To hide this warning and ensure your app does not break, you need to add the following code to your app before calling any other Cloud Firestore methods:

 const firestore = firebase.firestore();
 const settings = {/* your settings... */ timestampsInSnapshots: true};
 firestore.settings(settings);

With this change, timestamps stored in Cloud Firestore will be read back as Firebase Timestamp objects instead of as system Date objects. So you will also need to update code expecting a Date to instead expect a Timestamp. For example:

// Old:
const date = snapshot.get('created_at');
// New:
const timestamp = snapshot.get('created_at');
const date = timestamp.toDate();

Please audit all existing usages of Date when you enable the new behavior. In a future release, the behavior will change to the new behavior, so if you do not follow these steps, YOUR APP MAY BREAK.

This is my package.json file:

  "dependencies": {
    "@angular/animations": "^5.2.0",
    "@angular/common": "^5.2.0",
    "@angular/compiler": "^5.2.0",
    "@angular/core": "^5.2.0",
    "@angular/forms": "^5.2.0",
    "@angular/http": "^5.2.0",
    "@angular/platform-browser": "^5.2.0",
    "@angular/platform-browser-dynamic": "^5.2.0",
    "@angular/router": "^5.2.0",
    "angularfire2": "^5.0.0-rc.6.0",
    "core-js": "^2.4.1",
    "firebase": "^4.13.1",
    "rxjs": "^5.5.6",
    "zone.js": "^0.8.19"
  },
  "devDependencies": {
    "@angular/cli": "~1.7.4",
    "@angular/compiler-cli": "^5.2.0",
    "@angular/language-service": "^5.2.0",
    "@types/jasmine": "~2.8.3",
    "@types/jasminewd2": "~2.0.2",
    "@types/node": "~6.0.60",
    "codelyzer": "^4.0.1",
    "jasmine-core": "~2.8.0",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "~2.0.0",
    "karma-chrome-launcher": "~2.2.0",
    "karma-coverage-istanbul-reporter": "^1.2.1",
    "karma-jasmine": "~1.1.0",
    "karma-jasmine-html-reporter": "^0.2.2",
    "protractor": "~5.1.2",
    "ts-node": "~4.1.0",
    "tslint": "~5.9.1",
    "typescript": "~2.5.3"
  }

Firebase -v: 4.13.1 AngularFire -v: 5.0.0-rc.6.0 OS: Mac OSX / Windows (tried it on both the platforms.)

Also, what is the reason behind this error?

Jose Jose · Accepted Answer · 2018-04-26T03:00:38

I got to the fix from egaviriarestrepo - https://github.com/angular/angularfire2/issues/1575

Where ever you call AngularFirestore you need to add the following two lines within the constructor:

const settings = {timestampsInSnapshots: true};
afs.app.firestore().settings(settings);

It should look something like this:

export class CoreModule {
  constructor( private afs: AngularFirestore) {
        const settings = {timestampsInSnapshots: true};
        afs.app.firestore().settings(settings);
  }
}

if the code above does not work, try the code below:

export class CoreModule {
  constructor( private afs: AngularFirestore) {
        const settings = {timestampsInSnapshots: true};
        afs.firestore.settings(settings);
  }
}

Getting a timestamp error in an angular app and firebase integration

1 Answers