Karma No Provider For Storage However It Is Added

I have the following spec.ts file:

import {CUSTOM_ELEMENTS_SCHEMA} from '@angular/core';
import {async, ComponentFixture, TestBed} from '@angular/core/testing';

import {OnboardingSliderComponent} from './onboarding-slider.component';
import {IconPipe} from "@shared/pipes/icon/icon.pipe";
import {ActivatedRoute, Router} from "@angular/router";
import {TextService} from "@core/services/text/text.service";
import {Platform} from "@ionic/angular";
import {Storage} from "@ionic/storage";

describe('OnboardingSliderComponent', () => {
    let component: OnboardingSliderComponent;
    let fixture: ComponentFixture<OnboardingSliderComponent>;

    beforeEach(async(() => {
        TestBed.configureTestingModule({
            providers: [{
                provide: TextService,
            }, {provide: Platform}, {provide: Router}, {provide: ActivatedRoute}, {provide: Storage}
            ],
            declarations: [OnboardingSliderComponent, IconPipe],

            schemas: [CUSTOM_ELEMENTS_SCHEMA],
        },)
            .compileComponents();
    }));

    beforeEach(() => {
        fixture = TestBed.createComponent(OnboardingSliderComponent);
        component = fixture.componentInstance;
        fixture.detectChanges();
    });

    it('should create', () => {
        expect(component).toBeTruthy();
    });
});

As you can see the Storage provider should be included however i still get an error saying:

    Error: StaticInjectorError(DynamicTestModule)[Storage]:
    StaticInjectorError(Platform: core)[Storage]:
    NullInjectorError: No provider for Storage!
    at NullInjector.push../node_modules/@angular/core/fesm5/core.js.NullInjector.get (node_modules/@angular/core/fesm5/core.js:8896:1)
    at resolveToken (node_modules/@angular/core/fesm5/core.js:9141:1)
    at tryResolveToken (node_modules/@angular/core/fesm5/core.js:9085:1)
    at StaticInjector.push../node_modules/@angular/core/fesm5/core.js.StaticInjector.get (node_modules/@angular/core/fesm5/core.js:8982:1)
    at resolveToken (node_modules/@angular/core/fesm5/core.js:9141:1)
    at tryResolveToken (node_modules/@angular/core/fesm5/core.js:9085:1)
    at StaticInjector.push../node_modules/@angular/core/fesm5/core.js.StaticInjector.get (node_modules/@angular/core/fesm5/core.js:8982:1)
    at resolveNgModuleDep (node_modules/@angular/core/fesm5/core.js:21218:1)
    at NgModuleRef_.push../node_modules/@angular/core/fesm5/core.js.NgModuleRef_.get (node_modules/@angular/core/fesm5/core.js:21907:1)
    at injectInjectorOnly (node_modules/@angular/core/fesm5/core.js:1774:1)
Expected undefined to be truthy.
    at UserContext.<anonymous> (src/app/shared/components/splash-screen/splashScreen.component.spec.ts:25:23)
    at ZoneDelegate../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke (node_modules/zone.js/dist/zone.js:391:1)
    at ProxyZoneSpec.push../node_modules/zone.js/dist/zone-testing.js.ProxyZoneSpec.onInvoke (node_modules/zone.js/dist/zone-testing.js:289:1)
    at ZoneDelegate../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke (node_modules/zone.js/dist/zone.js:390:1)

Providers must be mocked if you're not testing the provider it self. Right below your imports make a mock class for Storage

class MockStorage {}

then

{provide: Storage, useClass: MockStorage}

then to get the service instance

let mockStorage = TestBed.get(Storage)

Similarly you don't need to import your actual Router in your TestBed but instead use the RouterTestingModule provided by angular.

To avoid template errors for not recongnized template use NO_ERRORS_SCHEMA

import { NO_ERRORS_SCHEMA } from '@angular/core'

and include it in your TestBed's schemas array