CODEWITHSUNDEEP
javascriptjsonangularweb
Carlos Ortiz
Carlos Ortiz

Reputation: 151

ERROR TypeError: Cannot read properties of null (reading 'toISOString')

I recently upgrade the dependencies within my package.json to their latest versions. The dependencies were outdated by atleast 2 years or maybe more. I''m getting this error whenever I access a page where this data is being called. I'm thinking the issue might be with the updated dependencies and their new functionality. What would be the reason for this?

This is the portion of the code being referenced in the error

this.miceBirthdayFilter = (calendarDate: Date): boolean => {
      let birthDates = [];
      this.uniqueValuesForEachAttribute['subject_birth_date'].forEach(date => {
        birthDates.push(date);
      });
      console.log("miceBirthdayFilter in Session " + birthDates.length)
      console.log("calendarDate in miceBirthdayFilter in Session " + calendarDate)
      return birthDates.includes(calendarDate.toISOString().substring(0, 10));
    };

This is the updated package.json

{
  "name": "pipeline-viewer",
  "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": "^12.0.0",
    "@angular/cdk": "^12.0.0",
    "@angular/common": "^12.0.0",
    "@angular/compiler": "^12.0.0",
    "@angular/core": "^12.0.0",
    "@angular/flex-layout": "^12.0.0-beta.35",
    "@angular/forms": "^12.0.0",
    "@angular/material": "^12.0.0",
    "@angular/material-moment-adapter": "^12.0.0",
    "@angular/platform-browser": "^12.0.0",
    "@angular/platform-browser-dynamic": "^12.0.0",
    "@angular/router": "^12.0.0",
    "@wizpanda/super-gif": "0.0.5",
    "angular-plotly.js": "^4.0.4",
    "bootstrap": "^5.1.3", 
    "moment": "^2.29.1",
    "plotly.js": "^2.5.1",
    "rxjs": "^7.4.0",
    "rxjs-compat": "^6.6.7",
    "zone.js": "^0.11.4"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "^12.0.0",
    "@angular/cli": "^12.0.0",
    "@angular/compiler-cli": "^12.0.0"
  }
}

This is the old package.json that displays the graphs and charts.

{
  "name": "pipeline-viewer",
  "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": "^7.1.4",
    "@angular/cdk": "^7.3.7",
    "@angular/common": "~7.1.0",
    "@angular/compiler": "~7.1.0",
    "@angular/core": "~7.1.0",
    "@angular/flex-layout": "^7.0.0-beta.24",
    "@angular/forms": "~7.1.0",
    "@angular/material": "^7.3.3",
    "@angular/material-moment-adapter": "^8.1.2",
    "@angular/platform-browser": "~7.1.0",
    "@angular/platform-browser-dynamic": "~7.1.0",
    "@angular/router": "~7.1.0",
    "@wizpanda/super-gif": "0.0.5",
    "angular-plotly.js": "^1.3.2",
    "bootstrap": "^4.2.1",
    "moment": "^2.24.0",
    "plotly.js": "^1.49.0",
    "rxjs": "~6.3.3",
    "rxjs-compat": "^6.3.3",
    "zone.js": "~0.8.26"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~0.11.0",
    "@angular/cli": "~7.1.3",
    "@angular/compiler-cli": "~7.1.0"
  }
}

Upvotes: 0

Views: 3571

Answers (2)

Carlos Ortiz
Carlos Ortiz

Reputation: 151

return (calendarDate == null ? true : birthDates.includes(calendarDate.toISOString().split('T'))) this fixed the issue

Upvotes: 0

Eddie023
Eddie023

Reputation: 106

Error tells you that the passed value to the function is null at least once in your code. TypeError: Cannot read properties of null (reading 'toISOString')

Can you double check this by adding some early exit in your function. Something like this.

this.miceBirthdayFilter = (calendarDate: Date): boolean => {
      let birthDates = [];
      
      // If calendarDate is null, return false.
      if (!calendarDate) {
        return false 
      }  

      return birthDates.includes(calendarDate.toISOString().substring(0, 10));
    };

Upvotes: 1

Related Questions