Update dependencies

angular.json

@@ -51,7 +51,6 @@
               "optimization": true,
               "outputHashing": "all",
               "sourceMap": false,
-              "extractCss": true,
               "namedChunks": false,
               "aot": true,
               "extractLicenses": true,

package.json

@@ -14,47 +14,47 @@
   },
   "private": true,
   "dependencies": {
-    "@angular/animations": "^10.0.1",
-    "@angular/cdk": "^10.0.1",
-    "@angular/common": "^10.0.1",
-    "@angular/compiler": "^10.0.1",
-    "@angular/core": "^10.0.1",
-    "@angular/forms": "^10.0.1",
-    "@angular/material": "^10.0.1",
-    "@angular/platform-browser": "^10.0.1",
-    "@angular/platform-browser-dynamic": "^10.0.1",
-    "@angular/router": "^10.0.1",
-    "@angular/service-worker": "^10.0.1",
-    "chart.js": "^2.9.3",
-    "core-js": "^2.6.11",
+    "@angular/animations": "^11.0.9",
+    "@angular/cdk": "^11.0.4",
+    "@angular/common": "^11.0.9",
+    "@angular/compiler": "^11.0.9",
+    "@angular/core": "^11.0.9",
+    "@angular/forms": "^11.0.9",
+    "@angular/material": "^11.0.4",
+    "@angular/platform-browser": "^11.0.9",
+    "@angular/platform-browser-dynamic": "^11.0.9",
+    "@angular/router": "^11.0.9",
+    "@angular/service-worker": "^11.0.9",
+    "chart.js": "^2.9.4",
+    "core-js": "^2.6.12",
     "dexie": "^2.0.4",
-    "ng2-charts": "^2.3.2",
+    "ng2-charts": "^2.4.2",
     "ng2-currency-mask": "^9.0.2",
     "ngx-cookie-service": "^2.4.0",
-    "rxjs": "^6.5.4",
+    "rxjs": "^6.6.3",
     "tslib": "^2.0.0",
     "zone.js": "~0.10.3"
   },
   "devDependencies": {
-    "@angular-devkit/build-angular": "~0.1000.0",
-    "@angular/cli": "^10.0.0",
-    "@angular/compiler-cli": "^10.0.1",
-    "@angular/language-service": "^10.0.1",
-    "@types/jasmine": "^3.5.2",
+    "@angular-devkit/build-angular": "^0.1100.7",
+    "@angular/cli": "^11.0.7",
+    "@angular/compiler-cli": "^11.0.9",
+    "@angular/language-service": "^11.0.9",
+    "@types/jasmine": "~3.6.0",
     "@types/jasminewd2": "^2.0.8",
-    "@types/node": "^12.11.1",
-    "codelyzer": "^5.1.2",
+    "@types/node": "^12.19.14",
+    "codelyzer": "^6.0.0",
     "eslint": "^6.8.0",
-    "jasmine-core": "~3.5.0",
+    "jasmine-core": "~3.6.0",
     "jasmine-spec-reporter": "~5.0.0",
-    "karma": "~5.0.0",
+    "karma": "~5.1.1",
     "karma-chrome-launcher": "~3.1.0",
     "karma-coverage-istanbul-reporter": "~3.0.2",
-    "karma-jasmine": "~3.3.0",
+    "karma-jasmine": "~4.0.0",
     "karma-jasmine-html-reporter": "^1.5.0",
     "protractor": "~7.0.0",
     "ts-node": "~8.6.2",
-    "tslint": "~6.1.0",
-    "typescript": "3.9.5"
+    "tslint": "^6.1.3",
+    "typescript": "4.0.5"
   }
 }

src/app/app-routing.module.ts

@@ -33,7 +33,7 @@ const routes: Routes = [
 
 @NgModule({
   imports: [
-    RouterModule.forRoot(routes)
+    RouterModule.forRoot(routes, { relativeLinkResolution: 'legacy' })
   ],
   exports: [
     RouterModule

src/app/app.component.spec.ts

@@ -1,24 +1,24 @@
-import { TestBed, async } from '@angular/core/testing';
+import { TestBed, waitForAsync } from '@angular/core/testing';
 import { AppComponent } from './app.component';
 describe('AppComponent', () => {
-  beforeEach(async(() => {
+  beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [
         AppComponent
       ],
     }).compileComponents();
   }));
-  it('should create the app', async(() => {
+  it('should create the app', waitForAsync(() => {
     const fixture = TestBed.createComponent(AppComponent);
     const app = fixture.debugElement.componentInstance;
     expect(app).toBeTruthy();
   }));
-  it(`should have as title 'budget'`, async(() => {
+  it(`should have as title 'budget'`, waitForAsync(() => {
     const fixture = TestBed.createComponent(AppComponent);
     const app = fixture.debugElement.componentInstance;
     expect(app.title).toEqual('budget');
   }));
-  it('should render title in a h1 tag', async(() => {
+  it('should render title in a h1 tag', waitForAsync(() => {
     const fixture = TestBed.createComponent(AppComponent);
     fixture.detectChanges();
     const compiled = fixture.debugElement.nativeElement;

src/app/budgets/add-edit-budget/add-edit-budget.component.spec.ts

@@ -1,4 +1,4 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 
 import { AddEditBudgetComponent } from './add-edit-budget.component';
 
@@ -6,7 +6,7 @@ describe('AddEditBudgetComponent', () => {
   let component: AddEditBudgetComponent;
   let fixture: ComponentFixture<AddEditBudgetComponent>;
 
-  beforeEach(async(() => {
+  beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ AddEditBudgetComponent ]
     })

src/app/budgets/budget-details/budget-details.component.spec.ts

@@ -1,4 +1,4 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 
 import { BudgetDetailsComponent } from './budget-details.component';
 
@@ -6,7 +6,7 @@ describe('BudgetDetailsComponent', () => {
   let component: BudgetDetailsComponent;
   let fixture: ComponentFixture<BudgetDetailsComponent>;
 
-  beforeEach(async(() => {
+  beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ BudgetDetailsComponent ]
     })

src/app/budgets/budget.component.spec.ts

@@ -1,4 +1,4 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 
 import { BudgetsComponent } from './budget.component';
 
@@ -6,7 +6,7 @@ describe('BudgetsComponent', () => {
   let component: BudgetsComponent;
   let fixture: ComponentFixture<BudgetsComponent>;
 
-  beforeEach(async(() => {
+  beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ BudgetsComponent ]
     })

src/app/budgets/edit-budget/edit-budget.component.spec.ts

@@ -1,4 +1,4 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 
 import { EditBudgetComponent } from './edit-budget.component';
 
@@ -6,7 +6,7 @@ describe('EditBudgetComponent', () => {
   let component: EditBudgetComponent;
   let fixture: ComponentFixture<EditBudgetComponent>;
 
-  beforeEach(async(() => {
+  beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ EditBudgetComponent ]
     })

src/app/budgets/new-budget/new-budget.component.spec.ts

@@ -1,4 +1,4 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 
 import { NewBudgetComponent } from './new-budget.component';
 
@@ -6,7 +6,7 @@ describe('NewBudgetComponent', () => {
   let component: NewBudgetComponent;
   let fixture: ComponentFixture<NewBudgetComponent>;
 
-  beforeEach(async(() => {
+  beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ NewBudgetComponent ]
     })

src/app/categories/categories.component.spec.ts

@@ -1,4 +1,4 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 
 import { CategoriesComponent } from './categories.component';
 
@@ -6,7 +6,7 @@ describe('CategoriesComponent', () => {
   let component: CategoriesComponent;
   let fixture: ComponentFixture<CategoriesComponent>;
 
-  beforeEach(async(() => {
+  beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ CategoriesComponent ]
     })

src/app/categories/category-breakdown/category-breakdown.component.spec.ts

@@ -1,4 +1,4 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 
 import { CategoryBreakdownComponent } from './category-breakdown.component';
 
@@ -6,7 +6,7 @@ describe('CategoryBreakdownComponent', () => {
   let component: CategoryBreakdownComponent;
   let fixture: ComponentFixture<CategoryBreakdownComponent>;
 
-  beforeEach(async(() => {
+  beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ CategoryBreakdownComponent ]
     })

src/app/categories/category-details/category-details.component.spec.ts

@@ -1,4 +1,4 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 
 import { CategoryDetailsComponent } from './category-details.component';
 
@@ -6,7 +6,7 @@ describe('CategoryDetailsComponent', () => {
   let component: CategoryDetailsComponent;
   let fixture: ComponentFixture<CategoryDetailsComponent>;
 
-  beforeEach(async(() => {
+  beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ CategoryDetailsComponent ]
     })

src/app/categories/category-form/category-form.component.spec.ts

@@ -1,4 +1,4 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 
 import { CategoryFormComponent } from './category-form.component';
 
@@ -6,7 +6,7 @@ describe('CategoryFormComponent', () => {
   let component: CategoryFormComponent;
   let fixture: ComponentFixture<CategoryFormComponent>;
 
-  beforeEach(async(() => {
+  beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ CategoryFormComponent ]
     })

src/app/categories/category-list/category-list.component.spec.ts

@@ -1,4 +1,4 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 
 import { CategoryListComponent } from './category-list.component';
 
@@ -6,7 +6,7 @@ describe('CategoryListComponent', () => {
   let component: CategoryListComponent;
   let fixture: ComponentFixture<CategoryListComponent>;
 
-  beforeEach(async(() => {
+  beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ CategoryListComponent ]
     })

src/app/categories/edit-category/edit-category.component.spec.ts

@@ -1,4 +1,4 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 
 import { EditCategoryComponent } from './edit-category.component';
 
@@ -6,7 +6,7 @@ describe('EditCategoryComponent', () => {
   let component: EditCategoryComponent;
   let fixture: ComponentFixture<EditCategoryComponent>;
 
-  beforeEach(async(() => {
+  beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ EditCategoryComponent ]
     })

src/app/categories/new-category/new-category.component.spec.ts

@@ -1,4 +1,4 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 
 import { NewCategoryComponent } from './new-category.component';
 
@@ -6,7 +6,7 @@ describe('NewCategoryComponent', () => {
   let component: NewCategoryComponent;
   let fixture: ComponentFixture<NewCategoryComponent>;
 
-  beforeEach(async(() => {
+  beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ NewCategoryComponent ]
     })

src/app/transactions/add-edit-transaction/add-edit-transaction.component.spec.ts

@@ -1,4 +1,4 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 
 import { AddEditTransactionComponent } from './add-edit-transaction.component';
 
@@ -6,7 +6,7 @@ describe('AddEditTransactionComponent', () => {
   let component: AddEditTransactionComponent;
   let fixture: ComponentFixture<AddEditTransactionComponent>;
 
-  beforeEach(async(() => {
+  beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ AddEditTransactionComponent ]
     })

src/app/transactions/new-transaction/new-transaction.component.spec.ts

@@ -1,4 +1,4 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 
 import { NewTransactionComponent } from './new-transaction.component';
 
@@ -6,7 +6,7 @@ describe('NewTransactionComponent', () => {
   let component: NewTransactionComponent;
   let fixture: ComponentFixture<NewTransactionComponent>;
 
-  beforeEach(async(() => {
+  beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ NewTransactionComponent ]
     })

src/app/transactions/transaction-details/transaction-details.component.spec.ts

@@ -1,4 +1,4 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 
 import { TransactionDetailsComponent } from './transaction-details.component';
 
@@ -6,7 +6,7 @@ describe('TransactionDetailsComponent', () => {
   let component: TransactionDetailsComponent;
   let fixture: ComponentFixture<TransactionDetailsComponent>;
 
-  beforeEach(async(() => {
+  beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ TransactionDetailsComponent ]
     })

src/app/transactions/transaction-list/transaction-list.component.spec.ts

@@ -1,4 +1,4 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 
 import { TransactionListComponent } from './transaction-list.component';
 
@@ -6,7 +6,7 @@ describe('TransactionListComponent', () => {
   let component: TransactionListComponent;
   let fixture: ComponentFixture<TransactionListComponent>;
 
-  beforeEach(async(() => {
+  beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ TransactionListComponent ]
     })

src/app/transactions/transactions.component.spec.ts

@@ -1,4 +1,4 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 
 import { TransactionsComponent } from './transactions.component';
 
@@ -6,7 +6,7 @@ describe('ExpensesComponent', () => {
   let component: TransactionsComponent;
   let fixture: ComponentFixture<TransactionsComponent>;
 
-  beforeEach(async(() => {
+  beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ TransactionsComponent ]
     })

src/app/users/edit-profile/edit-profile.component.spec.ts

@@ -1,4 +1,4 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 
 import { EditProfileComponent } from './edit-profile.component';
 
@@ -6,7 +6,7 @@ describe('EditProfileComponent', () => {
   let component: EditProfileComponent;
   let fixture: ComponentFixture<EditProfileComponent>;
 
-  beforeEach(async(() => {
+  beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ EditProfileComponent ]
     })

src/app/users/login/login.component.spec.ts

@@ -1,4 +1,4 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 
 import { LoginComponent } from './login.component';
 
@@ -6,7 +6,7 @@ describe('LoginComponent', () => {
   let component: LoginComponent;
   let fixture: ComponentFixture<LoginComponent>;
 
-  beforeEach(async(() => {
+  beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ LoginComponent ]
     })

src/app/users/register/register.component.spec.ts

@@ -1,4 +1,4 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 
 import { RegisterComponent } from './register.component';
 
@@ -6,7 +6,7 @@ describe('RegisterComponent', () => {
   let component: RegisterComponent;
   let fixture: ComponentFixture<RegisterComponent>;
 
-  beforeEach(async(() => {
+  beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ RegisterComponent ]
     })

src/app/users/user.component.spec.ts

@@ -1,4 +1,4 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 
 import { UserComponent } from './user.component';
 
@@ -6,7 +6,7 @@ describe('UserComponent', () => {
   let component: UserComponent;
   let fixture: ComponentFixture<UserComponent>;
 
-  beforeEach(async(() => {
+  beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ UserComponent ]
     })