Ionic 4: Creating mock storage Ionic 4: Creating mock storage angular angular

Ionic 4: Creating mock storage


First, import Storage:

import { Storage } from '@ionic/storage';

Create a const for mock:

 const storageIonicMock: any = {     get: () => new Promise<any>((resolve, reject) => resolve('As2342fAfgsdr')),     set: () => ...    };

Configure your TesBed

TestBed.configureTestingModule({      imports: [],      providers: [        {          provide: Storage,          useValue: storageIonicMock        }      ]    });


The Ionic plugin storage also works in a browser environment.

You don't need to create a mock and you can directly import, define and inject it in your component (if you are running your test in a browser environment) :

First import :

import { Storage } from '@ionic/storage';import { MyComponent } from './my-component';

Declare a global component variable :

let component: MyComponent;

Then and for each test, define and inject the storage in your component :

beforeEach(() => {    const storage = new Storage({         // Define Storage      name: '__mydb',      driverOrder: ['indexeddb', 'sqlite', 'websql']    });    component = new MyComponent(storage); // Inject Storage in your component  }


As others wrote, Storage works in browsers, so I did not need mocking it for testing.This worked for me (StorageWrapperService is my service which depends on Ionic's Storage):

import { TestBed } from '@angular/core/testing';import { StorageWrapperService } from './storage-wrapper.service';import { IonicStorageModule, Storage } from '@ionic/storage';describe('StorageWrapperService', () => {  let service: StorageWrapperService;  beforeEach(() => {    TestBed.configureTestingModule({      imports: [        IonicStorageModule.forRoot({          name: '__mydb',          driverOrder: ['localstorage']        })      ],    });    service = TestBed.inject(StorageWrapperService);  });  it('should be created', () => {    expect(service).toBeTruthy();  });});

Additional info:

localstorage will not be cleared between tests, so probably you want to use something like this:

describe('StorageWrapperService', () => {  let service: StorageWrapperService;  let storage: Storage;  beforeEach(() => {    TestBed.configureTestingModule({      imports: [        IonicStorageModule.forRoot({          name: '__mydb',          driverOrder: ['localstorage']        })      ]    });    service = TestBed.inject(StorageWrapperService);    storage = TestBed.inject(Storage);  });...});

And clear storage at the end of every tests:

  it('...', (done) => {      storage.clear().then(() => done());  });