Invalid views to insert using lazy loading with last nightly

mburger81 commented 7 years ago

Ionic version: (check one with "x") [ ] 1.x [ ] 2.x [ ] 3.x

I'm submitting a ... (check one with "x") [x] bug report [ ] feature request [ ] support request => Please do not submit support requests here, use one of these channels: https://forum.ionicframework.com/ or http://ionicworldwide.herokuapp.com/

Current behavior: On last nightly which should resolve this #11168 now there are several other errors, like this:

Runtime Error
Uncaught (in promise): invalid views to insert
Stack
Error: Uncaught (in promise): invalid views to insert
    at d (http://localhost:8100/build/polyfills.js:3:3991)
    at l (http://localhost:8100/build/polyfills.js:3:3244)
    at Object.reject (http://localhost:8100/build/polyfills.js:3:2600)
    at NavControllerBase._fireError (http://localhost:8100/build/main.js:46751:16)
    at NavControllerBase._failed (http://localhost:8100/build/main.js:46739:14)
    at http://localhost:8100/build/main.js:46794:59
    at t.invoke (http://localhost:8100/build/polyfills.js:3:11562)
    at Object.onInvoke (http://localhost:8100/build/main.js:4644:37)
    at t.invoke (http://localhost:8100/build/polyfills.js:3:11502)
    at n.run (http://localhost:8100/build/polyfills.js:3:6468)
    at http://localhost:8100/build/polyfills.js:3:3767
    at t.invokeTask (http://localhost:8100/build/polyfills.js:3:12256)
    at Object.onInvokeTask (http://localhost:8100/build/main.js:4635:37)
    at t.invokeTask (http://localhost:8100/build/polyfills.js:3:12177)
    at n.runTask (http://localhost:8100/build/polyfills.js:3:7153)

Ionic info: (run ionic info from a terminal/cmd prompt and paste output below):

    Cordova CLI: 6.5.0 
    Ionic Framework Version: 3.0.1-201704252003
    Ionic CLI Version: 3.0.0-beta7
    ios-deploy version: Not installed
    ios-sim version: Not installed
    OS: Linux 4.10
    Node Version: v6.10.2
    Xcode version: Not installed

P.S. sorry guys, bu it becomes really frustrating handling with LazyLoading router. :cry:

jgw96 commented 7 years ago

Hello. Sorry about the frustration! We are still working on our lazy loading story and this will get better in the future. Would you mind posting a repo or plunker we can use to reproduce this issue?

mburger81 commented 7 years ago

@jgw96 Honestley, the problem is there are several bugs we opened on ionic-angular, app-scripts and also on ionic-cli.

Some of the bugs where closed without resolving them and some bugs are still there with no attention. For other bugs after hours of tentative to reproduce them in a simple dev environment we released to you, the bugs are there without attention and as you know it's absolutely not simple to reproduce a BUG on a new environment which is not the real dev environment, so many hours of work. So we really don't know how to continue with our app and honestly in the last few weeks we have had the problem, on releasing a new version of ionic-angular for a bug fixing you opened a few new other bugs. And this not only for one module but also over different modules (ionic-angular / app-scripts / ionic-cli). So we have no combination of the modules which works. Some combination has bugs other combination doesn't work at all.

So really we are not able to have now a system on which we can develop, and we really don't know if we should go back to an old version where we have some bugs, or if we should go further with a never version where we have other bugs. Until now in ionic3 we where never in a status where we had no errors on production or dev mode. So honestly we are completely stopped on our project on production and dev mode from weeks or also from more then a month, this since releasing v3, and we can not return to v2.

Sorry, this is not a criticism, but a desperate message from a DEV team which is working with your great framework. FIY we are located in Italy so we are all the night in your leisure showing and reading your commits and your issues and waiting for your feedback or your nightly's.

So we hope you can help us as soon as possible and follow us to resolve this issues and we hope we can help you resolve this issues.

THX at all

mburger81 commented 7 years ago

This is one of this new BUG we have from latest releases this night: https://github.com/driftyco/ionic-app-scripts/issues/927

This are other BUGS which was closed but are not resolved https://github.com/driftyco/ionic-app-scripts/issues/898 https://github.com/driftyco/ionic-app-scripts/issues/877 https://github.com/driftyco/ionic-app-scripts/issues/911

This ISSUE is still there and we can not resolve it, but it is not possibile to reproduce it on a new ENVIRONMENT https://github.com/driftyco/ionic-app-scripts/issues/893

THIS ISSUES should be closed on 3.1.0 but as we can not migrate to 3.1.0 we can not close them and thest them https://github.com/driftyco/ionic/issues/11168 https://github.com/driftyco/ionic/issues/11090

There are other problems I tried to discuss on this PR https://github.com/driftyco/ionic/pull/11128#issuecomment-294958625 As you can see for the last two messages version 3.1.0 probably close the promise bug but opens me a new SEVERE bug on setting the new page on a ion-nav

This are only a SET of BUGs we have and we opened and which are open.

Honestly the thing is, this are not css or other bugs we can handle with some simple workarounds. This are framework problems which stops us to work on production and also on dev.

I hope we can help you as much as possible do makes it work.

THX

lincolnthree commented 7 years ago

Also experiencing this issue since updating to 3.1.0.

lincolnthree commented 7 years ago

Also seeing this randomly, as well:


Error: Uncaught (in promise): removeView was not found
    at d (http://localhost:8100/build/polyfills.js:3:3991)
    at l (http://localhost:8100/build/polyfills.js:3:3244)
    at l (http://localhost:8100/build/polyfills.js:3:2930)
    at http://localhost:8100/build/polyfills.js:3:3758
    at t.invokeTask (http://localhost:8100/build/polyfills.js:3:12256)
    at Object.onInvokeTask (http://localhost:8100/build/main.js:4469:37)
    at t.invokeTask (http://localhost:8100/build/polyfills.js:3:12177)
    at n.runTask (http://localhost:8100/build/polyfills.js:3:7153)
    at a (http://localhost:8100/build/polyfills.js:3:2312)```

Daskus1 commented 7 years ago

I am randomly seeing this error:

Error: Uncaught (in promise): nav controller was destroyed
    at d (http://localhost:8100/build/polyfills.js:3:3991)
    at l (http://localhost:8100/build/polyfills.js:3:3244)
    at Object.reject (http://localhost:8100/build/polyfills.js:3:2600)
    at Tab.NavControllerBase._fireError (http://localhost:8100/build/main.js:50218:16)
    at Tab.NavControllerBase._failed (http://localhost:8100/build/main.js:50197:18)
    at http://localhost:8100/build/main.js:50261:59
    at t.invoke (http://localhost:8100/build/polyfills.js:3:11562)
    at Object.onInvoke (http://localhost:8100/build/main.js:4478:37)
    at t.invoke (http://localhost:8100/build/polyfills.js:3:11502)
    at n.run (http://localhost:8100/build/polyfills.js:3:6468)
    at http://localhost:8100/build/polyfills.js:3:3767
    at t.invokeTask (http://localhost:8100/build/polyfills.js:3:12256)
    at Object.onInvokeTask (http://localhost:8100/build/main.js:4469:37)
    at t.invokeTask (http://localhost:8100/build/polyfills.js:3:12177)
    at n.runTask (http://localhost:8100/build/polyfills.js:3:7153)

Also for me upgrading to 3.1.0 broke a lot of things and lazy loading is really not working as expected...

YouSirY commented 7 years ago

Ionic App Scripts: 1.3.4 Angular Core: 4.0.2 Angular Compiler CLI: 4.0.2 Node: 7.7.1 OS Platform: Windows 10 Navigator Platform: Win32 User Agent: Mozilla/5.0 (iPhone; CPU iPhone OS 9_1 like Mac OS X) AppleWebKit/601.1.46 (KHTML, like Gecko) Version/9.0 Mobile/13B143 Safari/601.1

mburger81 commented 7 years ago

@jgw96 @brandyscarney Has someone a solutions for this BUG?? invalid views to insert this bug is cause many other bugs or side effects!

Can you give this a priority?

bogomips commented 7 years ago

Hello, same problem here. When I try to reach an inner page which is lazy loaded I often get:

Runtime Error Uncaught (in promise): invalid views to insert

Ionic Framework: 3.1.0 Ionic App Scripts: 1.3.4 Angular Core: 4.0.2 Angular Compiler CLI: 4.0.2 Node: 7.9.0 OS Platform: Linux 4.10 Navigator Platform: Linux x86_64 User Agent: Mozilla/5.0 (Linux; Android 5.0; SM-G900P Build/LRX21T) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/56.0.2924.87 Mobile Safari/537.36

Reloading, sometimes it works, sometimes the page redirects to the rootPage

jgw96 commented 7 years ago

Hello, all! Thanks for all the input, we greatly appreciate you guys concerns and are evaluating all this info as I write this. As I said before we are hard at work on getting our lazy loading implementation polished and ready for the big time. We are aware of some navigation and build issues with lazy loading at the moment which is why we have not pushed it as the default yet. Expect updates on all this soon and again, thanks for using Ionic everyone!

manucorporat commented 7 years ago

So, here's a quick insight of what "invalid views to insert" mean https://github.com/driftyco/ionic/blob/master/src/navigation/nav-controller-base.ts#L356

Basically it means ALL the components you are trying to insert were NOT resolved (ie any ViewController was created)

manucorporat commented 7 years ago

Error: Uncaught (in promise): nav controller was destroyed

that means, your <ion-nav> or tab was destroyed while a transition was running. So, I believe you are doing something wrong. The good thing here is that NavController handled the error correctly, it will not break your app.

mtpzone commented 7 years ago

Not sure if it only fixes it here for me or could help anyone else but after getting this error

Runtime Error Uncaught (in promise): invalid views to insert

I did the following 2 steps and all is working fine now.. That error has stopped for now.

I went thru and imported NavParams to every pages' .ts file even though I am not using NavParams and injected into all constructors. YES vs code Typescript does not like that I am not actually using NavParams so puts a squiggle under the import but its ok because its just a warning/help squiggle
in the module.ts for each page I noticed some did and some did not have a comma after the page declaration ( probably made with different versions of ionic generate over the last few months?) anyway I added that comma back in all the files that didn't have it @NgModule({ declarations: [ HomePage, <- that comma right there *** ],.....

Could just be a fluke.. but 1 or both of those things combined has everything working again.

mburger81 commented 7 years ago

@jgw96 @manucorporat

Ok, for the third time I created a new github repository which is simulating some of the bugs I mentioned.

https://github.com/mburger81/ionic-lazy.git

This is a ionic project using ionic-cli@3.0.0-rc.0 and ionic-angular@3.1.1, so please be sure to use the right ionic cli.

This repo is using a two "layer" navigation, in the AppComponent is the first ion-nav which is handling loading LoginPage or MainPage where is the second ion-nav which is handling all other pages. Also in any page there is a ionViewCanEnter livecycle where I use my AuthGuard. The AuthGuard is using HTTP calls which doesn't exists, I check always the GUARD in the ERROR handler SUBSCRITION. This is need to simulate Promise and Observable (perhpase there is a better way to do this).

If I open the LoginPage but I'm already logged in I will naviagte to MainPage. If I open MainPage or Page1, Page2, ..., Page5. but I'm not logged in I will navigate to LoginPage.

You can simple checkout repo and do (as you know)

npm install
ionic serve

After that you will see a simple LoginPage, with a button

After this cliick the button Login and you'll redirect to first Page, there you can navigate with Menu over all pages!

As you can see you are in http://localhost:8100/#/main/page1

Now try to navigate manual in the browser to http://localhost:8100/#/main/page2 http://localhost:8100/#/main/page3 http://localhost:8100/#/main/page4 http://localhost:8100/#/main/page5

You'll see soon or later this bug:

PLEASE check it and let me know if you where able to reproduce at least this bug.

It is possible if we are implementing something wrong, but it would be nice for us and the other guys which are having this problem if we can resolve this or check what are we doing wrong.

meladawy commented 7 years ago

I confirm having the same issue, restarting ionic from the terminal get it working again and after some works i got the same error message with root page "tabs"

andrei-bucurei commented 7 years ago

This problem seems to have an easy fix. I'm using it without problems: Go to your-project/node_modules/ionic-angular/navigation and open deep-linker.js Then search for nav.push(segment.component. In version 3.1.1 this is on line 428. Modify this line: nav.push(segment.component, segment.data, { ... so it will look like this: nav.push(segment.component || segment.name, segment.data, {

mburger81 commented 7 years ago

@BOAndrew Good to know this, but naturally this is not a fix in my opinion but only a temporary workaround.

I hope @manucorporat or @jgw96 follow us and can fix this.

mburger81 commented 7 years ago

@ionic team was you able to reproduce the bug with my repro?

jgw96 commented 7 years ago

Hello everyone! We are evaluating this issue to be added to the milestone for our next release. Thanks!

jgw96 commented 7 years ago

And as you can see, this issue is now on the 3.2.0 milestone 🎉

mburger81 commented 7 years ago

Great thx a lot!! We can not update ionic before the bug is resolved. We as others are stille there on 3.0.1. I hope my repo can help you to reproduce the error! Thx

ghost commented 7 years ago

@BOAndrew thanks for the solution, it works great forme. I hope the IONIC team resolve this issue in the next release.

mburger81 commented 7 years ago

@BOAndrew I tested your workaround now for the first time with new 3.2.0 but it seems not working for me.

ghost commented 7 years ago

@BOAndrew sadly your Workaround doesn't work for Me :-(

godspeed529 commented 7 years ago

@brandyscarney @jgw96 3.2.0 has been released. Can you provide new messaging around the outstanding lazy loading issues?

mburger81 commented 7 years ago

Yes please!!!

vovikdrg commented 7 years ago

I am on 3.2.0 and i got same issue but I found my problem. Since I am rewriting my old ionic.1 to ionic.x sometimes we just copy paste views and modify to new requiremenets.

My problem was that tag has (click)="FunctionWichPushNewVIeww" and href="#/routefromoldapp" so after removing href this issue gone for me

ghost commented 7 years ago

I have updated to the latest beta and now it works like a charm. It was easy for me to implement it in an existing app and i was really able to reduce size of the initial load and could push Performance also :-) Cool Thing!

mburger81 commented 7 years ago

@obermoserkitz What do you intend with latest beta? The latest beta as an very very old 3.0.0-beta.3, this is a pre 3.0.0! Do you have installed this one or do you intend the latest nightly which is the 3.2.0-201705121627.

nzhtrtlc commented 7 years ago

@jgw96

When i try to go page using url manually it says

Uncaught (in promise): invalid views to insert Ionic Framework: 3.2.1 Ionic App Scripts: 1.3.7 Angular Core: 4.1.0 Angular Compiler CLI: 4.1.0 Node: 6.9.5 OS Platform: Windows 7 Navigator Platform: Win32 User Agent: Mozilla/5.0 (Windows NT 6.1; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/58.0.3029.110 Safari/537.36

How to fix?

shprink commented 7 years ago

Still exists with Ionic 3.2.1

richardmarais commented 7 years ago

I also get it on Ionic 3.2.1

Error: Uncaught (in promise): invalid views to insert

Was working, and all of sudden started getting this error. Even if I revert all my changes, I still get this.

(This seems to come from nav-controller-base.js . NavControllerBase.prototype._nextTrns = function ())

vovikdrg commented 7 years ago

@shprink @richardmarais a you using link event to push a new view? Because in my case was extra href which was causing that error

richardmarais commented 7 years ago

@vovikdrg, I just have this.nav.setRoot(page.component), which is pretty standard I think.

To test, I remove all content from my app.component.ts (just an empty constructor), and still get the error.

shprink commented 7 years ago

@vovikdrg I use setRoot or Push only. the problem happens when hitting the back button in my case.

richardmarais commented 7 years ago

Not 100% sure yet, I need to test further, but I have the following in my app.html:

<!-- Disable swipe-to-go-back because it's poor UX to combine STGB with side menus -->
<ion-nav [root]="rootPage" #content swipeBackEnabled="false"></ion-nav>

I think this is the cause.

[will update once tested - am getting an error now for some strange reason Menu: must have a [content] element to listen for drag events on]

UPDATE

I revert my code back to what I had from a week ago (only stopped working today), and I still get:

Error: Uncaught (in promise): invalid views to insert

If I remove:

<ion-nav [root]="rootPage" #content swipeBackEnabled="false"></ion-nav>

the error goes away, but I get:

Menu: must have a [content] element to listen for drag events on

mburger81 commented 7 years ago

We have the same error as, @shprink. This bug is a long and painful story!

ryanemax commented 7 years ago

long and painful story

mburger81 commented 7 years ago

Yea, to bug was in milestone for 3.2 and 3.3 but today was released 3.3 and the bug wasn't resolved. :'(

tonimartir commented 7 years ago

I had the same problem, upgraded to ionic-angular 3.3 and still fails. Patched line 428 of deep-linker.sj and the problem solved (BOAndrew post)

danbucholtz commented 7 years ago

All,

We are doing a refactor of navigation right now to better facilitate lazy loading. We'll make sure this bug is resolved with the changes.

Thanks, Dan

nelsneider commented 7 years ago

buenas alguien me puede decir a que llega este error ERROR Error: Uncaught (in promise): invalid views to insert at d (polyfills.js:3) at l (polyfills.js:3) at Object.reject (polyfills.js:3) at NavControllerBase._fireError (nav-controller-base.js:322) at NavControllerBase._failed (nav-controller-base.js:310) at nav-controller-base.js:365 at t.invoke (polyfills.js:3) at Object.onInvoke (core.es5.js:4125) at t.invoke (polyfills.js:3) at n.run (polyfills.js:3) at polyfills.js:3 at t.invokeTask (polyfills.js:3) at Object.onInvokeTask (core.es5.js:4116) at t.invokeTask (polyfills.js:3) at n.runTask (polyfills.js:3) defaultErrorLogger @ core.es5.js:1084 ErrorHandler.handleError @ core.es5.js:1144 IonicErrorHandler.handleError @ ionic-error-handler.js:63 next @ core.es5.js:4754 schedulerFn @ core.es5.js:3828 SafeSubscriber.__tryOrUnsub @ Subscriber.js:234 SafeSubscriber.next @ Subscriber.js:183 Subscriber._next @ Subscriber.js:125 Subscriber.next @ Subscriber.js:89 Subject.next @ Subject.js:55 EventEmitter.emit @ core.es5.js:3814 NgZone.triggerError @ core.es5.js:4185 onHandleError @ core.es5.js:4146 t.handleError @ polyfills.js:3 n.runGuarded @ polyfills.js:3 (anonymous) @ polyfills.js:3 a @ polyfills.js:3 invoke @ polyfills.js:3

nzhtrtlc commented 7 years ago

@nelsneider Ionic team are working on refactor for navigation. I believe they're gonna fix it soon.

kleeb commented 7 years ago

when can we expect the next release?

godspeed529 commented 7 years ago

https://github.com/ionic-team/ionic/commits/url-changes

mburger81 commented 7 years ago

As from meeting notes they should release this week a new version with emprovements on keyboard and lazyloading. Today they released version 3.4.0, but without lazyloading

:sob: never ending story

danbucholtz commented 7 years ago

This will be in the next ionic release. The nav changes are taking longer than I planned. I'm going to lock this for now since we know what we need to do and it isn't overly constructive at this point.

Thanks, Dan

danbucholtz commented 7 years ago

This issue is resolved in nightly 🎉 Thanks to @shprink for helping me recreate the scenarios and verify they're resolved.

@mburger81, I think your issue is behaving as designed (though it is strange). I am investigating it. For your use case, you don't need multiple navs. Please join worldwide slack if you wish to discuss further.

Thanks, Dan

ionic-team / ionic-framework

Invalid views to insert using lazy loading with last nightly #11374