Simple SqlStorage setup breaks with no stacktrace

Ionic Framework ionic-v3
1

From the main doc, I am trying to store a simple value in the database.

I am trying to use the key/value part for configs.

import {Page, NavController, SqlStorage} from 'ionic-angular';`

    constructor(nav){
        db = new Storage(SqlStorage);

This line makes the browser go blank without any stack trace in the browser or in the CLI…

Will try to play around with tho console and read some more, but I thought I followed the documentation.

2

Since there is no delete, I will explain the confusion. Missing the Storage import. But no stack trace is still hard to work with and I think it’s not mentioned in the documentation yet.

3

@epetre I’m glad that you figured it out. It’s strange that you haven’t received any error message though. Could you give some more details, e.g. run ionic info and paste the output here?

4

Yes sir :slight_smile:

Cordova CLI: 6.1.1
Ionic Framework Version: 2.0.0-beta.5-201604211454
Ionic CLI Version: 2.0.0-beta.25
Ionic App Lib Version: 2.0.0-beta.15
ios-deploy version: Not installed
ios-sim version: Not installed
OS: Mac OS X El Capitan
Node Version: v4.4.3
Xcode version: Xcode 7.3 Build version 7D175

5

@epetre Thanks for the additional details! Unfortunately I’m not able to reproduce the problem, i.e. in case of an error it’s shown in the dev tools console as expected. AFAIK you won’t receive any errors in the CLI console when using JavaScript (unlike when using TypeScript).

I installed Node v4.4.3 to make sure that it’s not something node-related:

Cordova CLI: 6.1.1
Ionic Framework Version: 2.0.0-beta.6
Ionic CLI Version: 2.0.0-beta.25
Ionic App Lib Version: 2.0.0-beta.15
OS: Windows 7 SP1
Node Version: v4.4.3

The project was started with the following command line:

ionic start TestAppJS blank --v2

With the following home.js I got the error below in the dev tools console (as expected):

import {Page, NavController, SqlStorage} from 'ionic-angular';

@Page({
  templateUrl: 'build/pages/home/home.html'
})
export class HomePage {
  constructor(nav) {
    this.db = new Storage(SqlStorage);
  }
}

EXCEPTION: Error: Uncaught (in promise): Cannot resolve all parameters for 'HomePage'(?). Make sure that all the parameters are decorated with Inject or have valid type annotations and that 'HomePage' is decorated with Injectable.
STACKTRACE:
Error: Uncaught (in promise): Cannot resolve all parameters for 'HomePage'(?). Make sure that all the parameters are decorated with Inject or have valid type annotations and that 'HomePage' is decorated with Injectable.
    at resolvePromise (angular2-polyfills.js:602)
    at resolvePromise (angular2-polyfills.js:587)
    at angular2-polyfills.js:635
    at ZoneDelegate.invokeTask (angular2-polyfills.js:423)
    at Object.NgZoneImpl.inner.inner.fork.onInvokeTask (ng_zone_impl.ts:54)
    at ZoneDelegate.invokeTask (angular2-polyfills.js:422)
    at Zone.runTask (angular2-polyfills.js:320)
    at drainMicroTaskQueue (angular2-polyfills.js:541)
    at XMLHttpRequest.ZoneTask.invoke (angular2-polyfills.js:493)

After fixing the DI in home.js I got the error below in the dev tools console (as expected):

import {Page, NavController, SqlStorage} from 'ionic-angular';

@Page({
  templateUrl: 'build/pages/home/home.html'
})
export class HomePage {
  static get parameters() {
    return [[NavController]];
  }
  constructor(nav) {
    this.db = new Storage(SqlStorage);
  }
}

EXCEPTION: Error: Uncaught (in promise): EXCEPTION: Error during instantiation of HomePage!.
ORIGINAL EXCEPTION: TypeError: Illegal constructor
ORIGINAL STACKTRACE:
TypeError: Illegal constructor
    at TypeError (native)
    at new HomePage (http://localhost:8100/build/js/app.bundle.js:76:15)
    at http://localhost:8100/build/js/app.bundle.js:26005:47
    at Injector._instantiate (http://localhost:8100/build/js/app.bundle.js:19790:27)
    at Injector._instantiateProvider (http://localhost:8100/build/js/app.bundle.js:19728:25)
    at Injector._new (http://localhost:8100/build/js/app.bundle.js:19717:21)
    at InjectorInlineStrategy.instantiateProvider (http://localhost:8100/build/js/app.bundle.js:19217:30)
    at ElementDirectiveInlineStrategy.init (http://localhost:8100/build/js/app.bundle.js:21876:24)
    at new AppElement (http://localhost:8100/build/js/app.bundle.js:21553:28)
    at HostViewFactory.viewFactory_HostHomePage0 [as viewFactory] (viewFactory_HostHomePage:122:27)

I would suggest you to try with a new project and check if there aren’t any errors during installation.

If the problem still persists you could open a new Ionic issue and post the details there.

6

You need import Storage too.

7

Thx for all the debuging Iignatov.
Ok so Ionic2 really supports TypeScript better, at least for now.

8

It seems to be a platform-specific problem (related to Mac OS X or WebKit), I opened a new issue about it:

1 Like