E2E testing when using @ionic/storage

Ionic Framework ionic-v3
1

I’m using @ionic/storage in my app, to store some values.
Now I’ve started making E2E tests, and i struggle figuring out how to access that (@ionic/storage) storage, and not just the browsers default local storage. Anyone that can point me in the right direction?

Thanks in advance.
Lars

2

What exactly is your question? You normally just use the APIs that @ionic/storage gives you, how and where your data is saved doesn’t really concern you.

3

My question is how i can use @ionic/storage in E2E tests. In my page, i do like this:

import { Storage } from '@ionic/storage';
..
constructor(
      private storage: Storage      
  ) { .. }

Then in this page i can use storage like this:

this.storage.set("somevalue", "the actiual value");

and

this.storage.get("somevalue")

I’ve tried to import and use @ionic/storage in the E2E test script, but i don’t see how i can use it there.
Tried it this way:

import {Storage} from '@ionic/storage';
describe('Dashboard E2E test', () => {
    beforeEach(() => {
       let storageConfig = { name: 'somename' };
        let storage: Storage = new Storage(storageConfig);
        this.storage.get("somevalue").subscribe(res => {
           ..          
        })

when trying to run tests, i get this:

[13:29:41] I/launcher - Running 1 instances of WebDriver
[13:29:41] I/direct - Using ChromeDriver directly...
[13:29:42] E/launcher - Error: /Users/xxxx/dev/nnnn/node_modules/@ionic/storage/dist/index.js:1
(function (exports, require, module, __filename, __dirname) { import { NgModule } from '@angular/core';
                                                              ^^^^^^

SyntaxError: Unexpected token import
    at createScript (vm.js:80:10)
    at Object.runInThisContext (vm.js:139:10)
    at Module._compile (module.js:616:28)
    at Object.Module._extensions..js (module.js:663:10)
    at Module.load (module.js:565:32)
    at tryModuleLoad (module.js:505:12)
    at Function.Module._load (module.js:497:3)
    at Module.require (module.js:596:17)
    at require (internal/module.js:11:18)
    at Object.<anonymous> (/Users/xxxx/dev/nnnn/src/pages/dashboard/dashboard.e2e-spec.ts:5:17)
[13:29:42] E/launcher - Process exited with error code 100
npm ERR! code ELIFECYCLE
npm ERR! errno 4
npm ERR! nnnn@0.0.2 e2e-test: `protractor ./test-config/protractor.conf.js`
npm ERR! Exit status 4
npm ERR! 
npm ERR! Failed at the nnnn@0.0.2 e2e-test script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/xxxx/.npm/_logs/2019-01-31T12_29_42_759Z-debug.log

I’m not sure if this clarifies what my question is. and maybe it’s even a stupid question. I just don’t see how i am supposed to do this. So I could use a pointer in the right direction.

4

So you are testing your app in Chrome, and want to look into the app’s storage to confirm everything worked as expected? Wouldn’t it be more “e2e” to check if the app correctly displays the data (which it loads from storage)?

5

My app uses authentication with Auth0, I want to test what’s going on inside the app, so my thought is to act like the user has already logged in once, and has a token saved in local storage. The validity of the token is checked before the user is allowed into the dashboard.

So what I’m trying to do, is to make use of the saved token, to actually be able to get to the dashboard page. If that makes sense.

6

Yes it does. Maybe you can introduce a hidden button that opens a prompt where your tests can input the token, which is then written to storage? Of course check the token validity so users can’t just also use that to work around your login.

7

Ah. Yeah, that makes sense. I will see if i can make that work.