CommunityToolkit / CommunityToolkit/Maui

[BUG] PopupV2 background overlay remains visible after popup is closed through navigation

Open
#2,923 3 comments 2 reactions 0 assignees View on GitHub
bug unverified
Dominant language
C#
Stars
2.7k
Forks
500
Avg merge
2d 14h
Merged PRs (30d)
7

Description

### Is there an existing issue for this?

- [x] I have searched the existing issues

### Did you read the "Reporting a bug" section on Contributing file?

- [x] I have read the "Reporting a bug" section on Contributing file: https://github.com/CommunityToolkit/Maui/blob/main/CONTRIBUTING.md#reporting-a-bug

### Current Behavior

In some cases on Android, I noticed that the popup's background overlay wouldn't always hide along with its popup when navigating between pages, **blocking the entire application, CanBeDismissedByTappingOutsideOfPopup does not matter**.

iOS has not been tested yet at the moment.

The simplest case is to call PopToRootAsync 1 frame after calling ShowPopup, the popup's background overlay will stay on top forever.

```
private void OnClicked(object? sender, EventArgs e)
{
Dispatcher.DispatchAsync(async () =>
{
// Be sure to specify the background color to see the overlay.
var options = new PopupOptions()
{
PageOverlayColor = Colors.Green
};

// It doesn't matter what to show.
var view = new Label
{
Text = "Tap to dismiss this popup",
BackgroundColor = Colors.Red
};

// 1. Show the popup without waiting for it to close
Shell.Current.ShowPopup(view, options);

// 2. Wait for 1 frame.
await Task.Yield();

// 3. Finally, pop to root. The animated flag does not matter.
await Shell.Current.Navigation.PopToRootAsync(false);

/*
* Now the popup itself is gone, but we see it's green overlay.
* The model stack is empty! Optionaly we can navigate to another page
* in the regular navigation stack and see that the page has changed
* under overlay. Essentially, the app is frozen and won't respond to touch.
*/
await Shell.Current.Navigation.PushAsync(new Page1());
});
}
```

### Expected Behavior

The overlay hides along with its popup, thereby not blocking the application.

### Steps To Reproduce

1. Open and debug on Android sample app: https://github.com/Bamich/popup-v2-overlay-bug
2. Click the button

### Link to public reproduction project repository

https://github.com/Bamich/popup-v2-overlay-bug

### Environment

```markdown
- .NET MAUI CommunityToolkit: 12.2.0
- .NET MAUI: 9.0.120
- OS: Android, API 33
```

### Actual behaviour

https://github.com/user-attachments/assets/c78b2b9f-0934-44b4-b6c8-48ee6243be26

### Expected behaviour

https://github.com/user-attachments/assets/37885a70-a5f8-4ec7-9911-553d820bab97

Contributor guide

Open the contributing guide

Research direction

Run the linked popup-v2-overlay-bug reproduction on Android and follow the sequence through Shell.Current.ShowPopup, Task.Yield, and Navigation.PopToRootAsync. Compare the popup and overlay lifecycle during navigation; done means the overlay is removed with the popup and the app remains responsive after navigating.

Written by the indexing model from the issue text.

Assessment

Tech stack
csharp
Domain
mobile
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Quiet
Clarity
Mostly clear
Newbie friendliness
48/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.