Fenix: [Feature Request] Add private mode for custom tabs

[nahuhh]

Why/User Benefit/User Problem

Right now custom tabs always open in normal mode. This means we always record history for custom tab sessions. We should add a preference to always open custom tabs in private mode.

What/Requirements

We can open a custom tab in private mode

Acceptance Criteria (how do I know when I’m done?)

• Custom tab can be opened in private mode
• User knows whether or not they are in a custom tab
• Custom tab doesn't record any trace of browsing activity

---

Old Issue:

Steps to reproduce

Video attached. There's a few things to note

a. There is no indication that the tab is private
b. The url bar is identical to that of a non-private custom tab.

Expected behavior

Private customs tabs should always be the color purple of the private mode

Device information

• Android device: 8.1.0
• Fenix version: Nightly 190914 06:02 (Build #12570610)
  📦: 13.0.0, 1f55c03be
  🦎: 71.0a1-20190913092859
  

[nahuhh]

Not sure if I'm using the term "custom tab" properly.
Feel free to correct me
Thanks

[NotWoods]

I split out this issue into #5345 and #5344. I've edited this issue to only contain the private custom tab UX concerns.

UX team: Please specify a design for custom tabs in private mode. Should we use a custom color and ignore the color set by the parent app, use a special icon, etc.?

[lime124]

thanks tiger!

@apbitner and @AmyYLee to provide thoughts on this one. adam worked on custom tabs and amy worked on private mode theming.

adam it's ok if this needs to wait until amy is back from PTO

[AmyYLee]

@NotWoods Hi, agreed that we should have a custom colour for custom tabs in private mode. I've attached a mock of the proposed colouring. Please use the PBM gradient in the search bar for custom private tabs. Let me know if you have any questions.

[severinrudie]

@AmyYLee @vesta0 after some investigation, private custom tabs aren't actually a feature that we intended to expose (the option popping up in the app chooser was fixed in https://github.com/mozilla-mobile/fenix/pull/6702).

That said, it might be a good idea to allow a private custom tabs. We're going to relabel this as a feature request and update the comment 0.

[NotWoods]

@Baron-Severin The original plan was that all third-party links open in private mode. I think we would check the settings toggle now, similar to links that open directly in the browser.

[NotWoods]

@AmyYLee Is it possible to adjust the design so that the background of the toolbar is consistent with the app that creates the custom tab? Perhaps we could show a "private mask" where the tracking protection icon is displayed. The background gradient needs larger eng adjustments and doesn't match well with the app that crates the tab.

[AmyYLee]

@AmyYLee Is it possible to adjust the design so that the background of the toolbar is consistent with the app that creates the custom tab? Perhaps we could show a "private mask" where the tracking protection icon is displayed. The background gradient needs larger eng adjustments and doesn't match well with the app that crates the tab.

@NotWoods Hi, I am hesitant to swap out the tracking protection icon in place of a "private mask". We don't want to remove access to the ETP panel and also the private mask icon would not have an action on it so it would be strange if the other icons in the bar are actionable and this one isn't. I think it's more important to make it obvious to the user that they are opening a link in a private custom tab so having it match the app is less of a priority in this case. I would push for trying to keep the PMB gradient as in the original design posted.

Also I noticed that if I set Nightly as my default browser and select "Open links in a private tab", when I open a link in an app (ie Slack) and it opens in a custom tab and I got to the 3-dot menu and tap on "Open in Firefox Nightly", it opens in a regular tab and not a private tab. Should I file a bug for this?

[NotWoods]

We have an existing bug for that problem. #5345

[AmyYLee]

Hi,

Can we please remove the ETP icon coloured gradient for non-private and private custom tabs? This was marked in the spec for custom tabs. Thanks!

[severinrudie]

Defect with the current implementation: normal custom tabs in light theme use the wrong color for the 'close' button. This may also be reproducible in dark theme, I will verify there as well.

[severinrudie]

Can we please remove the ETP icon coloured gradient for non-private and private custom tabs? This was marked in the spec for custom tabs. Thanks!

@AmyYLee I originally thought this was a defect, but after some investigation it looks like this is following the current behavior on normal private tabs, where it gains color when something has been blocked. Would you like us to change that globally? If so, I think we should open a new issue for it.

Apologies for originally asking that it be added to this issue!

[severinrudie]

Defect with the current implementation: normal custom tabs in light theme use the wrong color for the 'close' button. This may also be reproducible in dark theme, I will verify there as well.

This is reproducible on master, opened https://github.com/mozilla-mobile/fenix/issues/7002 to track.

[AmyYLee]

Can we please remove the ETP icon coloured gradient for non-private and private custom tabs? This was marked in the spec for custom tabs. Thanks!

@AmyYLee I originally thought this was a defect, but after some investigation it looks like this is following the current behavior on normal private tabs, where it gains color when something has been blocked. Would you like us to change that globally? If so, I think we should open a new issue for it.

Apologies for originally asking that it be added to this issue!

@Baron-Severin So the specification was that the shield icon should be kept white for private and non-private custom tabs - but we keep the colour for regular tabs and pbm tabs that aren't custom. The reasoning is that there isn't high enough contrast between custom PMB tab and the gradient colour and for custom tabs, we don't know what colour the background could be so keeping the icon white is the safest.

[abodea]

I retested this issue on the latest Nightly from 12/11 with Samsung Galaxy S10+(Android 9) for more details please check the following:

1. The device navigation bar is not the same color/transparent in Normal Browsing mode with the light theme.

| Navigation device bar | Simplified toolbar | Top Bar |
|:-------------:|:-------------:|:-------------:|
| ❌ | ✅ | ✅ |

1. None of the 3 sections respect the color when opening a custom tab in PB.

| Navigation device bar | Simplified toolbar | Top Bar |
|:-------------:|:-------------:|:-------------:|
| ❌ | ❌ | ❌ |

1. None of the 3 sections respect the color when opening a custom tab in Normal Browsing Mode with the dark theme enabled.

| Navigation device bar | Simplified toolbar | Top Bar |
|:-------------:|:-------------:|:-------------:|
| ❌ | ❌ | ❌ |

According to the comments from above, the color should be different:

I'm removing the eng:qa:needed until further notice.

[severinrudie]

@abodea I'm unable to reproduce those issues on the 12/11 nightly on either a Samsung Galaxy S7 (Android 7) or a Pixel 2 (Android 10). I'll try to get a hold of a Galaxy S10 and work on a fix. Do you have any other devices you could check, in case there are more where this misbehaves?

[abodea]

Hello @Baron-Severin sorry for the late response.

Note that I re-checked this issue for more details please check the following:

Build: Latest Nightly 12/18.

| Device | Android | Reproducible? |
|:-------------:|:-------------:|:-------------:|
| Google Pixel 3a XL| 10 | ✅ |
| Google Pixel 3a | 9 | ✅ |
| Samsung Galaxy S10+| 9 | ✅ |
| Samsung Galaxy S8+| 8 | ✅ |
| Samsung Galaxy S7 | 7 | ✅ |
| OnePlus A3 | 6.0.1 | ✅ |
| LG Nexus 4 | 5.1.1 | ✅ |

1. Reach: Fenix Settings > Set as default browser > Check the Open links in a private tab > Set Fenix as default browser.
2. Open Gmail and tap on any external link > a custom tab is opened from Fenix in Private mode but the Fenix Toolbar is displayed white instead of purple how it was described above.

[severinrudie]

All good @abodea! Thanks for verifying, and sorry about causing you all the extra work. We were testing via a different code path and missed the problem, but we have a fix now that's been merged in.

[AndiAJ]

Hi, I've just checked this matter on the latest Nightly Build #13580607 from 12/24 using the following devices:
• Google Pixel 3a (Android 9)
• Huawei Mate 20 Lite (Android 8.1.0)
• Samsung Galaxy S7 (Android 7)
• OnePlus A3 (Android 6.0.1)
• LG Nexus 4 (Android 5.1.1)

✔️ Using Gmail and Twitter custom tabs are working properly.

On the other hand I've noticed a couple of inconsistencies:

❓ The Private browsing (Close private tabs notification)
Should this actually close the custom tab?
Tapping the notification Opens Fenix in normal browsing and the custom tab remains opened

❓ Should this be applicable to the custom tabs opened from a PWA?
Opening a custom tab from PWA isn't opened in Private Mode.

@Baron-Severin - Please review, and advise. ☺️
I'll remove the QA needed label until further notice.

[severinrudie]

Great call outs @AndiAJ! The decision is up to @AmyYLee, but these are my initial thoughts.

Close private tabs notification: custom tabs are supposed to feel like part of the app that opened them, not us, so I don't think the notification should close them. We will definitely need to not show that notification for private custom tabs though, if it doesn't do anything.

PWA tabs: same as above. The PWA should feel like a different app, I don't think it should follow this. If we want a private PWA option, I feel it should be exposed in the PWA itself.

[AmyYLee]

Great call outs @AndiAJ! The decision is up to @AmyYLee, but these are my initial thoughts.

Close private tabs notification: custom tabs are supposed to feel like part of the app that opened them, not us, so I don't think the notification should close them. We will definitely need to not show that notification for private custom tabs though, if it doesn't do anything.

PWA tabs: same as above. The PWA should feel like a different app, I don't think it should follow this. If we want a private PWA option, I feel it should be exposed in the PWA itself.

Hi,

I agree with @Baron-Severin, there shouldn't be a close private tabs notification for custom tabs or PWAs. Private tab notification should be specifically for Fenix. Thanks

[AndiAJ]

@Baron-Severin - should the fix for #7511 will be done separately? or should be included in this one?

[severinrudie]

@Baron-Severin - should the fix for #7511 will be done separately? or should be included in this one?

7511 will have to be done in a separate PR. It's not yet clear how it should/can be fixed.

[AndiAJ]

Hi, verified as fixed on the latest Nightly Build #20080616 from 01/08 using the following devices:
• Google Pixel 3a (Android 9)
• Huawei Mate 20 Lite (Android 8.1.0)
• Samsung Galaxy S7 (Android 7)
• OnePlus A3 (Android 6.0.1)
• LG Nexus 4 (Android 5.1.1)

► Video