Ionic-framework: RC.4 Nightly Issue: ObjectUnsubscribedError: object unsubscribed

[peterpeterparker]

While testing the RC.4 nightly (2.0.0-rc.4-201612211600) I faced following error in at least three places in my app, which I do not face with RC.4 official.

It happens after a push, a pop and a modal dismiss ... so quite difficult for me to say absolutely what's the problem.

Stack
ObjectUnsubscribedError: object unsubscribed
    at new ObjectUnsubscribedError (http://localhost:8100/build/main.js:64582:26)
    at Subject.next (http://localhost:8100/build/main.js:10559:19)
    at ScrollView.scrollEnd [as _endTmr] (http://localhost:8100/build/main.js:94291:32)
    at ScrollView.destroy (http://localhost:8100/build/main.js:94576:30)
    at Content.ngOnDestroy (http://localhost:8100/build/main.js:20210:38)
    at Wrapper_Content.ngOnDestroy (/IonicModule/Content/wrapper.ngfactory.js:15:16)
    at CompiledTemplate.proxyViewClass.View_ItemDetailsPage0.destroyInternal (/AppModule/ItemDetailsPage/component.ngfactory.js:223:22)
    at CompiledTemplate.proxyViewClass.AppView.destroy (http://localhost:8100/build/main.js:137504:14)
    at CompiledTemplate.proxyViewClass.DebugAppView.destroy (http://localhost:8100/build/main.js:137732:38)
    at CompiledTemplate.proxyViewClass.View_ItemDetailsPage_Host0.destroyInternal (/AppModule/ItemDetailsPage/host.ngfactory.js:33:19)

Ionic Framework: ^2.0.0-rc.4-201612211600
Ionic Native: 2.2.11
Ionic App Scripts: 0.0.48
Angular Core: 2.2.1
Angular Compiler CLI: 2.2.1
Node: 7.2.1
OS Platform: macOS Sierra
Navigator Platform: MacIntel
User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_12_2) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/55.0.2883.95 Safari/537.36

[jsayol]

I haven't tried reproducing this but from looking at the code I think the problem arises when a ScrollView is destroyed while still scrolling if a scroll event has fired during its lifetime.

While the view is being scrolled, a timeout is set (via rafFrames) and cleared/reset until it finally triggers when scrolling has ended, at which point it emits on the scrollEnd Subject.

If at some point the view is destroyed then the destroy() method gets called to do the necessary cleanup, which includes unsubscribing from the scroll-related Observables. The problem comes if scrolling hasn't yet finished and the timer is still active, as when it finally triggers it tries to emit on self.scrollEnd but that Subject is already closed since its Subscriber has already unsubscribed inside destroy().

A simple solution would be to make sure the Subject is still open before calling .next() on it:

!self.scrollEnd.closed && self.scrollEnd.next(ev);

[uzumakinaruto123]

Facing the same issue. But , Its difficult to know when this occurs. Forum post

Initially everything works. But , at random moment after some navigation console throws error Error : ObjectUnsubscribedError: object unsubscribed . After which list item clicks work but navigation freezes on list items. I need to restart app to make it work again.

Issue gets resolved once reverted back to rc3 latest nightly. not tested on official RC4 yet.

[raae]

This started showing up in my app as well yesterday after doing an npm install so I am thinking it is the same issue.

ObjectUnsubscribedError: object unsubscribed
    at new ObjectUnsubscribedError (http://localhost:8100/build/main.js:50350:26)
    at Subject.next (http://localhost:8100/build/main.js:9304:19)
    at ScrollView.scrollEnd [as _endTmr] (http://localhost:8100/build/main.js:75322:32)
    at ScrollView.destroy (http://localhost:8100/build/main.js:75607:30)
    at Content.ngOnDestroy (http://localhost:8100/build/main.js:14486:38)
    at Wrapper_Content.ngOnDestroy (/IonicModule/Content/wrapper.ngfactory.js:15:16)
    at CompiledTemplate.proxyViewClass.View_AvalancheListPage0.destroyInternal (/AppModule/AvalancheListPage/component.ngfactory.js:257:22)
    at CompiledTemplate.proxyViewClass.AppView.destroy (http://localhost:8100/build/main.js:113102:14)
    at CompiledTemplate.proxyViewClass.DebugAppView.destroy (http://localhost:8100/build/main.js:113330:38)
    at CompiledTemplate.proxyViewClass.View_AvalancheListPage_Host0.destroyInternal (/AppModule/AvalancheListPage/host.ngfactory.js:39:19)

[meeximum]

Having exactly the same problem :-( switched backt to RC2

it seems to happen when I to
this.navCtrl.setRoot(BatchListPage);

[Martin-Mo]

Having this problem too after upgrade to RC4!

[Vanclief]

Also experiencing this problem

[swiftyone]

+1

[lukasbisdorf]

I do have the same Issue.

For me this occurs, whenever I dismiss the View programmatically:

this.viewCtrl.dismiss(this.person);
// or
this.navCtrl.pop()

It happens whenever I have set focus to an input field, or when the view contains a ion-datepicker - So I first replaced the Datepicker with a native one (this does not help..). But maybe the error is just random 🤔

$ ionic info

Your system information:

Cordova CLI: 6.4.0 
Ionic Framework Version: 2.0.0-rc.4-201612220408
Ionic CLI Version: 2.1.13
Ionic App Lib Version: 2.1.7
Ionic App Scripts Version: 0.0.48
ios-deploy version: 1.9.0 
ios-sim version: 5.0.11 
OS: macOS Sierra
Node Version: v6.6.0
Xcode version: Xcode 8.2.1 Build version 8C1002

[drewg2009]

Has anyone found a solution to this issue? I cannot get my navigation stack to work and I have to release my app in under two weeks.

[lukasbisdorf]

I have to release my app in under two weeks.

Why exactly are you using a release candidate - this is definitely not recommended. ? Try rolling back to RC-3
Good Luck.

[drewg2009]

I just tried rolling back to RC-3 and I am getting the same error. Below is an image of the error I am getting.

Here is my package.json file:

{
  "name": "ionic-hello-world",
  "author": "Ionic Framework",
  "homepage": "http://ionicframework.com/",
  "version": "2.1.18",
  "private": true,
  "scripts": {
    "ionic:build": "ionic-app-scripts build",
    "ionic:serve": "ionic-app-scripts serve"
  },
  "dependencies": {
    "@angular/common": "2.1.1",
    "@angular/compiler": "2.1.1",
    "@angular/compiler-cli": "2.1.1",
    "@angular/core": "2.1.1",
    "@angular/forms": "2.1.1",
    "@angular/http": "2.1.1",
    "@angular/platform-browser": "2.1.1",
    "@angular/platform-browser-dynamic": "2.1.1",
    "@angular/platform-server": "2.1.1",
    "ionic-angular": "^2.0.0-rc3",
    "rxjs": "5.0.0-beta.12",
    "ionic-native": "2.2.3",
    "ionicons": "3.0.0", 
    "zone.js": "0.6.26"
  },
  "devDependencies": {
    "@ionic/app-scripts": "0.0.47",
    "typescript": "^2.0.3"
  },
  "cordovaPlugins": [
    "cordova-plugin-device",
    "cordova-plugin-console",
    "cordova-plugin-whitelist",
    "cordova-plugin-splashscreen",
    "cordova-plugin-statusbar",
    "ionic-plugin-keyboard"
  ],
  "cordovaPlatforms": [
    "ios",
    {
      "platform": "ios",
      "version": "1.0.0",
      "locator": "ios"
    }
  ],
  "description": "swe2: An Ionic project"
}

[lukasbisdorf]

I have debugged this and stepped trough everything.
The Error bubbles from Angular.
I think it says, that the current context text is not in the correct "zone". But I am not that deep into the development of the ionicframework (ATM I'm also just a user thought), to figure out what this exactly means.

[drewg2009]

Ok cool. Do u know of any navigation workarounds in the meantime? I need a quick fix so I can continue development.

[Vanclief]

I have no issues with RC4. Just not the latest version.

[lukasbisdorf]

@drewg2009 Today I have tried to delete and reinstall all my node_modules. And now it works fine. I have really no Idea what went wrong. Maybe something during the installation of a native module.

[meeximum]

you mean RC4 and angluar 2.2.1?

[lukasbisdorf]

Yes.

[drewg2009]

Yeah I ended up creating new ionic 2 project from scratch and copying over all of my code. Now it seems to work perfectly.

[pklime2]

Also ran into this problem on RC4 (not the nightly), clearing out my node_modules folder and doing an npm install seemed to clear it up as well.

[meeximum]

cleaning did the job for me too :-)

[peterpeterparker]

This is still not solved. Clean reinstalled everything, the issue is still present in current nightly!

"ionic-angular": "^2.0.0-rc.4-201612220408"

Cordova CLI: 6.4.0
Ionic Framework Version: 2.0.0-rc.4-201612220408
Ionic CLI Version: 2.1.18
Ionic App Lib Version: 2.1.9
Ionic App Scripts Version: 0.0.48
ios-deploy version: 1.9.0
ios-sim version: 5.0.13
OS: macOS Sierra
Node Version: v7.2.1
Xcode version: Xcode 8.0 Build version 8A218a

[pklime2]

I should have clarified, I ran into the error on RC4, not the nightly. Seems like it's potentially two different issues.

[peterpeterparker]

yep.

that's why, just to clarify the status of the ticket I opened about a possible major problem I noticed in a future release of Ionic, I confirm that I still face the same issue if I try the current nightly.

[ataraxus]

Hey, i just came back from vacation updated to latest nightly and got this: caused by: object unsubscribed

Your system information:

Cordova CLI: 6.3.1
Ionic Framework Version: 2.0.0-rc.4-201701032156
Ionic CLI Version: 2.1.13
Ionic App Lib Version: 2.1.7
Ionic App Scripts Version: 0.0.48
ios-deploy version: Not installed
ios-sim version: Not installed
OS: Windows 7
Node Version: v6.9.1
Xcode version: Not installed

EDIT:

• I removed node_modules and did a clean install and it happens
• Issue is not present in plain rc4

Stacktrace:

`Uncaught Error: Error in ./LoginPage class LoginPage - inline template:68:2 caused by: object unsubscribedDebugAppView.destroy @ main.js:126282AppView.detachAndDestroy @ main.js:126037ComponentRef_.destroy @ main.js:60108ViewController._destroy @ main.js:6693NavControllerBase._destroyView @ main.js:52843NavControllerBase._cleanup @ main.js:52863NavControllerBase._trnsFinish @ main.js:52787t.invoke @ polyfills.js:3onInvoke @ main.js:60749t.invoke @ polyfills.js:3e.run @ polyfills.js:3NgZone.run @ main.js:60639(anonymous function) @ main.js:52731Animation._didFinish @ main.js:13722Animation._playProgress @ main.js:13116Animation._playDomInspect @ main.js:13083

originating line: main.js:13116Animation._playDomInspect @ main.js:13083

 // ******** DOM WRITE ****************
   --->     this._playProgress(opts);
        if (this._isAsync && this.plt) {

[ataraxus]

Hey @manucorporat i did some digging and figured this breaks on the MDTransition page transition in the animation.ts. Since you did some work on it last time i had trouble with it i imagine you could shed some light into this issue?

after

 transition.onFinish(function () {
            // transition animation has ended
            _this._zone.run(_this._trnsFinish.bind(_this, transition, opts, resolve));
       });
opts = "{"animate":false,"direction":"back","animation":"md-transition"}"

I display a loading spinner and do some http request before transitioning

[magicboy110]

+1

[genesisoft]

This problem occurs with me when I have conditions like ngIf, ngSwitch or I use this conditions in ion-grid, ion-list or ion-cards and when I back the view occurs this error also.

Removing the node_modules folder don't fix this problem.

[peterpeterparker]

May I ask you @brandyscarney, because I never heard someone of the Ionic team about that (possible) issue and this report is now more than two weeks old...is that an issue or isn't (hope it isn't)? But if this is an issue, have you it under control before releasing RC.5?

Thx in advance for your feedback

[brandyscarney]

Could everyone please test using the latest nightly (currently 2.0.0-rc.4-201701052314):

npm install --save --save-exact ionic-angular@nightly

There was a similar issue reported here that was recently fixed: https://github.com/driftyco/ionic/issues/9892

If it is still an issue for you let me know and we will look into it. If you commented previously (and are still running into the issue on the latest nightly) please make sure you have included steps for us to reproduce the issue or a repository that shows the problem. Thanks and sorry for the delayed response!

[brandyscarney]

When I ran into this error yesterday it was caused by scrolling and then switching pages using setRoot, but your use case may be different which is why steps to reproduce or a repository are helpful. :)

[genesisoft]

For me worked Well @brandyscarney !!! Thank you!!!

[jsayol]

Hi @brandyscarney. Like I mentioned, I'm still occasionally running into this issue but I'm having a hard time reproducing it consistently. It happens when changing rootPage from AppComponent, but only some times.

Stack trace:

ObjectUnsubscribedError: object unsubscribed
    at new ObjectUnsubscribedError (http://192.168.0.20:8100/build/main.js:43995:26)
    at Subject.next (http://192.168.0.20:8100/build/main.js:6306:19)
    at scrollEnd (http://192.168.0.20:8100/build/main.js:94579:50)
    at dispatch (http://192.168.0.20:8100/build/main.js:7742:9)
    at DomController._flush (http://192.168.0.20:8100/build/main.js:7716:13)
    at rafCallback (http://192.168.0.20:8100/build/main.js:7709:22)

Slightly different trace than the original one but the core of the issue is the same: trying to scrollEnd.next() when scrollEnd has already been closed.

I see this latest nighlty introduced a change to probably try to address this, where

self.scrollEnd.next(ev);

has been replaced here with

self.scrollEnd && self.scrollEnd.next(ev);

As far as I can see, self.scrollEnd will never be undefined so maybe that should instead be:

!self.scrollEnd.closed && self.scrollEnd.next(ev);

Ideally I'd like to find out why that function is being triggered incorrectly in the first place, but this would certainly fix it (hide it?) for good. The recent fix that I discussed here already solved this for the most part, but there still seems to be some edge case on the loose.

[jsayol]

@brandyscarney I think I found the problem. The call here should actually say

cancelRaf(rafId);

The function queued to be executed in an animation frame is not being properly canceled so it executes anyway when it shouldn't.

[brandyscarney]

Thanks for the details @jsayol! Are you sure you are testing against nightly? We've been releasing nightlys from the treeshaking branch here: https://github.com/driftyco/ionic/tree/treeshaking

The code you linked to no longer exists there. I'll see if I can reproduce the issue though by setting rootPage. :)

[jsayol]

Are you sure you are testing against nightly?

Yup, I am:

$ ionic info

Your system information:

Cordova CLI: 6.4.0 
Ionic Framework Version: 2.0.0-rc.4-201701052314
Ionic CLI Version: 2.1.18
Ionic App Lib Version: 2.1.7
Ionic App Scripts Version: 0.0.48
ios-deploy version: Not installed
ios-sim version: Not installed
OS: Linux 4.8
Node Version: v7.3.0
Xcode version: Not installed

Although the cancelRaf thing I mentioned was just from looking through the code from master, so if that's gone then that doesn't have anything to do with this issue. Thanks for pointing that out!

Back to square one 😒

[jsayol]

Ah, I see @brandyscarney. Now on destroy() the _endTmr needs to be canceled this other way here:

this._endTmr && this._dom.cancel(this._endTmr);

[brandyscarney]

@jsayol Thanks :) I released a nightly with your change but I haven't pushed the code itself yet: [email protected]

I'm going to run some more of our tests against it but can you test it please. :)

[jsayol]

@brandyscarney works like a charm, I'm not seeing the error anymore. Thanks!

[brandyscarney]

@jsayol No, thank you! :smile:

[swiftyone]

Thanks a lot guys!

[peterpeterparker]

@brandyscarney and @jsayol you are the bests!

I tested 2.0.0-rc.4-201701062325 with both browser and real phone and I could confirm that I didn't faced the issue anymore!!!

Therefore I close this issue, thx a lot 👍

[ionitron-bot[bot]]

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.