Nativescript: [iOS] Dialogs don't work on iOS

[TomasKypry]

Tell us about the problem

Dialogs from "ui/dialogs" don't work on iOS from modal page.

Which platform(s) does your issue occur on?

iOS

Please provide the following version numbers that your issue occurs with:

• CLI: 4.1.0
• Cross-platform modules: 4.1.0
• Runtime(s): 4.0.1
• Plugin(s): "tns-core-modules": "^4.1.0"

Please tell us how to recreate the issue in as much detail as possible.

Here is a playground: https://play.nativescript.org/?template=play-tsc&id=Bf1NJd

if you change app.start({ moduleName: 'home/home-page' }); to app.start({ moduleName: 'home/new-page' }); in app.ts it's working fine.

Is there code involved? If so, please share the minimal amount of code needed to recreate the problem.

playground above

[tsonevn]

Hi @TomasKypry,
Thank you for the attached sample project. I tested it on my side and was able to recreate the issue. We will investigate it further and will provide more info about the problem.

[ADjenkov]

Hi @TomasKypry ,
You can try removing the .frame from home-page.ts-> didTapShowModal. Try with page.showModal(...) only

[TomasKypry]

Thank You for response, unfortunately, removing .frame didn't work as I'm using TabView in my project. I edited the Playground project (I though that it doesn't matter if I'd use the TabView so I wanted to keep it as simple as possible at first).
Please take a look at the edited project.

[ADjenkov]

Hey @TomasKypry ,
I've just tried your project and I've reproduced your problem. Can you try using tns-core-modules: next since there was a fix last week about the Dialogs and I think it is the source of this problem?

[TomasKypry]

@ADjenkov I've just tried that, still same, nothing happens

[TomasKypry]

is there any other way how to present some kind of alert with with choices to the user or any workaround for now?

[ADjenkov]

@TomasKypry you are still removing .frame right? I've downloaded your project from Playground then updated to next (you could try removing node_modules just in case before updating) along with removing .frame. I'm attaching your project with these changes. You can compare your package.json and the one in the archive

PS:I'm testing this on iPhone X 11.3 Simulator
Archive.zip

[TomasKypry]

@ADjenkov I have found where the problem is: If I have more tabs in TabView a the app starts at TabView.selectedIndex 0, I cant show dialogs from presented modal. But when I switch to tab "Home 2" and than back to "Home 1" it works fine. What am I doing wrong here?

I have edited the Playground.

[ADjenkov]

Hi again @TomasKypry,

The problem you've described is fixed in tns-core-modules@next. Is this occurring on device only or simulator? I'm attaching you an archive, with the scenario you've described above, that shows action dialog on all 3 tabs and modals.

Archive-multiple-tabs.zip

[TomasKypry]

Hi @ADjenkov Thank you for the example, it's working but it's not working in my project.
Let me describe my app:

App loads the tab view with 3 tabs, then in the onLoaded method of the first tab I present login screen like that:
page.frame.showModal( "Views/Login/login", "", () => { page.frame.closeModal() } )

And after user logs in, login screen is dismissed and user can choose item form ListView and there is a button in the item detail that is supposed to present the dialog.

But it doesn't happen when I present the login screen. If I skip the login screen (I don't call the .showModal function inside onLoaded) it's working fine. But I need to present the login screen :/

I don't even know where is the problem anymore...

[ADjenkov]

Does the same happen with removed .frame: page.showModal( "Views/Login/login", "", () => { page.closeModal() } ) ?

[TomasKypry]

If I don't use .frame I get this error: JS ERROR Error: Parent page is not part of the window hierarchy. Close the current modal page before showing another one!

[ADjenkov]

Is it possible to isolate this scenario in a Playground project (the one with the onLoaded of the first tab) so I can debug it?

[TomasKypry]

I have edited the Playground project, please take a look, thank you

[ADjenkov]

@TomasKypry I've reproduced the problem with your project. The problem is that you are showing modal view on loaded="pageLoaded" event which is too early. Consider navigating to page, showing modal view or dialogs on navigatedTo="pageNavigated" event.

To test this with your project just change loaded="pageLoaded" to navigatedTo="pageLoaded"

[TomasKypry]

@ADjenkov Hi, I've just tested this, unfortunately nothing changed

[ADjenkov]

@TomasKypry are you testing this through Playground? If you test it inside Playground it wont work since the latest tns-core-modules version used is 4.1.0. Could you download the project locally and update to tns-core-modules@next for now, because there is a fix related to the tab view and the dialogs.

Both changes navigatedTo="pageNavigated" and tns-core-modules@next are required for your project in order to show dialogs.

[TomasKypry]

My bad, I've made these changes in my app and it' finally working now! Thank You so much for your help! 👍

[chiachun0920]

Hi,
I still have the same problem, after I modify the version of tns-core-modules to next.
My project is based on 'NS + Angular'

If I start the project base on 'NS + Typescript', dialogs work well.

Give me any help, thanks!

[speigg]

Dialogs are still broken on non-Frame/Page based applications. The problem is that they rely on frame.topMost() which is not guaranteed to exist anymore. Please re-open.

[tsonevn]

Hi @chiachun0920,
Can you provide more info about the problem, which you are facing with the dialogs. It will help if you provide sample project which can be used for debugging.

@speigg Regarding your case I would suggest to setup createFrameOnBootstrap to true in main.ts file. For example:

platformNativeScriptDynamic({ createFrameOnBootstrap: true })

This will create Frame automatically and it might resolve your case for the dialogs.

[speigg]

This will create Frame automatically and it might resolve your case for the dialogs.

Two problems with your suggestion:
1) I'm not using {N} Angular, just vanilla Nativescript.
2) I don't want to use a Frame as the root view in my app (or at all really)

[speigg]

@tsonevn regardless of any workaround regarding the use of Frames, the bug still persists on non-Frame based apps, so please reopen the issues ;)

I think the dialogs modules will have to search the view hierarchy for the a UIVIewController, rather than relying on the frame module to get the current Page, since neither Frame nor Page views can any longer be assumed to exist in an application

[tsonevn]

Hi @speigg,
Thank you for the provided suggestion about the dialogs. I am reopening the issue. We will investigate further the case and will provide the needed fix. For further info, please keep track of the problem.

[NickIliev]

@chiachun0920 can you share more about the specifics in your project (or even better - create a sample Playground) so we could investigate your scenario.

[ADjenkov]

@speigg you were totally right that the bug still persists on non-Frame based apps!
This problem should now be resolved in tns-core-modules@next version.

[lock[bot]]

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.