Console.error: Unhandled Promise rejection: Illegal invocation

#1

Hi there, does anyone know why this error occurs at Ionic DevApp? At Google Chrome works fine.

I have created a Provider named RestProvider, and a method like this:

  getData(token:string, uri:string): Promise<any> {
    let url:string = this.apiUrl + uri;
    let headers:HttpHeaders = new HttpHeaders({
      'Authorization': `Bearer ${token}`,
      'Content-Type': 'application/json'
    });
    return this.http.get<any>(url, { headers: headers })
      .timeout(30000)
      .toPromise();
  }

Who calls it is the following code, into a method of a Page:

doFirstLoad(token:string, uri:string) {
    this.restProvider.getData(token, uri)
      .then((data:any) => {
          /* do something */
      }
      .catch((error:any) => {
          /* do something other */
      }
}

Testing this code at Google Chrome, it works fine! But, when I test the same using Ionic DevApp, I’ve received an Unhandled Promise rejection Illegal invocation:

$ ionic serve -c
Starting app-scripts server: --address 0.0.0.0 --port 8100 --livereload-port 35729 --dev-logger-port 53703 --consolelogs 
--nobrowser - Ctrl+C to cancel
[13:29:11]  watch started ... 
[13:29:11]  build dev started ... 
[13:29:11]  clean started ... 
[13:29:11]  clean finished in 3 ms 
[13:29:11]  copy started ... 
[13:29:11]  copy finished in 128 ms 
[13:29:11]  deeplinks started ... 
[13:29:11]  deeplinks finished in 344 ms 
[13:29:11]  transpile started ... 
[13:29:16]  transpile finished in 5.21 s 
[13:29:16]  preprocess started ... 
[13:29:16]  preprocess finished in less than 1 ms 
[13:29:16]  webpack started ... 
[13:29:27]  webpack finished in 10.71 s 
[13:29:27]  sass started ... 
Without `from` option PostCSS could generate wrong source map and will not find Browserslist config. Set it to CSS file path or to `undefined` to prevent this warning.
[13:29:28]  sass finished in 1.07 s 
[13:29:28]  postprocess started ... 
[13:29:28]  postprocess finished in 8 ms 
[13:29:28]  lint started ... 
[13:29:28]  build dev finished in 17.55 s 
[13:29:28]  watch ready in 17.65 s 
[13:29:28]  dev server running: http://localhost:8100/ 

[OK] Development server running!
     Local: http://localhost:8100
     External: http://192.168.0.101:8100
     DevApp: MyApp@8100 on rf511

[13:29:32]  lint finished in 4.09 s 
[13:29:43]  console.log: deviceready has not fired after 5 seconds. 
[13:29:43]  console.log: Channel not fired: onDOMContentLoaded 
[13:30:31]  console.warn: Ionic Native: deviceready did not fire within 5000ms. This can happen when plugins are in an 
            inconsistent state. Try removing plugins from plugins/ and reinstalling them. 
[13:30:32]  console.log: Angular is running in the development mode. Call enableProdMode() to enable the production 
            mode. 
[13:30:32]  console.log: Ionic Native: deviceready event fired after 29321 ms 
[13:31:06]  console.log: OPEN database: _ionicstorage 
[13:31:06]  console.log: new transaction is waiting for open operation 
[13:31:06]  console.log: new transaction is waiting for open operation 
[13:31:06]  console.error: Unhandled Promise rejection: Illegal invocation ; Zone: <root> ; Task: Promise.then ; Value: 
            [object Object] TypeError: Illegal invocation at Object.window.IonicDevServer.drainMessageQueue 
            (http://192.168.0.101:8100/__ion-dev-server/ion-dev.js?v=3.1.9:143:18) at 
            Object.window.IonicDevServer.queueMessageSend 
            (http://192.168.0.101:8100/__ion-dev-server/ion-dev.js?v=3.1.9:130:10) at Console.log 
            (http://192.168.0.101:8100/__ion-dev-server/ion-dev.js?v=3.1.9:166:18) at 
            http://192.168.0.101:8100/build/main.js:7544:21 at t.invoke 
            (http://192.168.0.101:8100/build/polyfills.js:3:14976) at r.run 
            (http://192.168.0.101:8100/build/polyfills.js:3:10143) at 
            http://192.168.0.101:8100/build/polyfills.js:3:20242 at t.invokeTask 
            (http://192.168.0.101:8100/build/polyfills.js:3:15660) at r.runTask 
            (http://192.168.0.101:8100/build/polyfills.js:3:10834) at o 
            (http://192.168.0.101:8100/build/polyfills.js:3:7894) 
[13:31:06]  console.log: OPEN database: _ionicstorage - OK 
[13:31:06]  console.log: DB opened: _ionicstorage

Does anyone know why? Can’t I send (return) a .toPromise() and treat it (.then, .catch) externally?

The error occurs at line return this.http.get(url, { headers: headers }).timeout(30000).toPromise(); only at Ionic DevApp.

Thank you!

#2

I’ve found the solution, the problem was in console.log line not mentioned in this code. It one was trying print an invalid object at console.