Angular 8.3.25 - Import errors and a mock not found

[gandadil]

This is my spec:

// tslint:disable
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { Pipe, PipeTransform, Injectable, CUSTOM_ELEMENTS_SCHEMA, NO_ERRORS_SCHEMA, Directive, Input, Output } from '@angular/core';
import { isPlatformBrowser } from '@angular/common';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { By } from '@angular/platform-browser';
import { Observable, of as observableOf, throwError } from 'rxjs';

import { Component, APP_BASE_HREF } from '@angular/core';
import { AppComponent } from './app.component';

@Directive({ selector: '[oneviewPermitted]' })
class OneviewPermittedDirective {
  @Input() oneviewPermitted;
}

@Pipe({name: 'translate'})
class TranslatePipe implements PipeTransform {
  transform(value) { return value; }
}

@Pipe({name: 'phoneNumber'})
class PhoneNumberPipe implements PipeTransform {
  transform(value) { return value; }
}

@Pipe({name: 'safeHtml'})
class SafeHtmlPipe implements PipeTransform {
  transform(value) { return value; }
}

describe('AppComponent', () => {
  let fixture;
  let component;

  beforeEach(() => {
    TestBed.configureTestingModule({
      imports: [ FormsModule, ReactiveFormsModule ],
      declarations: [
        AppComponent,
        TranslatePipe, PhoneNumberPipe, SafeHtmlPipe,
        OneviewPermittedDirective
      ],
      schemas: [ CUSTOM_ELEMENTS_SCHEMA, NO_ERRORS_SCHEMA ],
      providers: [
        { provide: 'APP_BASE_HREF', useValue: APP_BASE_HREF }
      ]
    }).overrideComponent(AppComponent, {

      set: { providers: [{ provide: undefined, useClass: Mockundefined }] }    
    }).compileComponents();
    fixture = TestBed.createComponent(AppComponent);
    component = fixture.debugElement.componentInstance;
  });

  afterEach(() => {
    component.ngOnDestroy = function() {};
    fixture.destroy();
  });

  it('should run #constructor()', async () => {
    expect(component).toBeTruthy();
  });

  it('should run #ngOnInit()', async () => {

    component.ngOnInit();

  });

});

I have problem with line below: import { Component, APP_BASE_HREF } from '@angular/core'; (APP_BASE_HREF) doesn't exist on @angular/core. I think that is moved to @angular/common

and the line: set: { providers: [{ provide: undefined, useClass: Mockundefined }] }
"Cannot find name Mockundefined"

This is the component source:

import { Component, ViewEncapsulation, Inject, OnInit } from '@angular/core';
import { APP_BASE_HREF } from '@angular/common';

declare var jQuery: any;
declare var tinyMCE: any;

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.scss'],
  providers: [{ provide: APP_BASE_HREF, useValue: '/' }],
  encapsulation: ViewEncapsulation.None,
})
export class AppComponent implements OnInit {
  title = 'app';

  constructor(@Inject(APP_BASE_HREF) readonly href: string) { }

  public ngOnInit(): any {
    window['Pace'].on('start' , () => jQuery('.spinner').show());
    window['Pace'].on('done'  , () => jQuery('.spinner').hide());
    tinyMCE.baseURL = `${this.href}assets/js/tiny_mce`;
  }

}

[t0n1n3]

I have the similar issue.

[allenhwkim]

This has been fixed and deployed with version 1.4.3