1325929 - Activity stream - Inconsistent Bookmark, Share and Copy Address icons displayed in context menu

Status: VERIFIED FIXED

Description

[Carmen Fat [:carmenf] - Experiments QA]

Attachment: Inconsistent icons.png

Environment: 
Devices:  
- Asus ZenPad 8 (Android 6.0.1);
- HTC Desire 820 (Android 6.0.1)
Build: latest Nightly 53.0a1 (2016-12-26);

Prerequisites: Activity stream is enabled.

Steps to reproduce:
1. Launch Firefox;
2. Tap on the 3 dots menu of a website from Activity stream panel (either Top sites or Highlights area);
3. Observe the icons from the context menu.

Expected result:
The icons are correctly displayed inside the context menu.

Actual result:
Bookmark, Share and Copy Address icons are inconsistent:
- The right side of the star representing Bookmark icon is not as bold as the left side;
- The bottom line from the Share icon is not as bold as the upper line;
- The upper line from the “Copy Address” icon is not as bold as the rest of the lines.

Notes:
Tested on devices with different Android versions:
- Prestigio Grace x5 (Android 4.4.2); 
- Nexus 9 (Android 7.0); 
- Huawei Honor x5 (android 5.1.1), 
but this only happened on 6.0.1 Android version.
The inconsistency still remains even if the icons are tapped.
Please see the screenshot attached.

Comment 1

[Sebastian Kaspari (:sebastian; :pocmo)]

Ouch. Ahunt, do you know what could be the reason for this?

Comment 2

[Andrzej Hunt :ahunt]

(In reply to Sebastian Kaspari (:sebastian) from comment #1)
> Ouch. Ahunt, do you know what could be the reason for this?

It seems like at least one other person has run into VectorDrawable distortion issues using API 23 (== Android 6), we should try to see if there's any way of working around that - if not, we might have to switch to png/webp?

https://code.google.com/p/android/issues/detail?id=215653#c3

Comment 3

[Andrzej Hunt :ahunt]

I can reproduce on a Nexus 5 running 6.0.1 too : /

Comment 4

[Sebastian Kaspari (:sebastian; :pocmo)]

See also bug 1330986.

Maybe you can try a newer version of the support library? If you just update the gradle build then this might be easier - there are a bunch of blockers preventing us from updating the SDK / support library for the regular builds.

Comment 5

[Andrzej Hunt :ahunt]

Using one of the online converters + some manual tweaking seems to fix the problem for me on 6.0.1, i.e.

- Android Studio SVG->VectorDrawable conversion: distorted icons
- Inloop converter ( http://inloop.github.io/svg2android/ ) works

Note: the inloop converter keeps "android:fillType="evenOdd"", and warns you that this only works on Android 24+. For at least the bookmark icon, removing the filltype causes no visible issues (compilation fails if it exists).

Comment 6

[Andrzej Hunt :ahunt]

(In reply to Sebastian Kaspari (:sebastian) from comment #4)
> See also bug 1330986.
> 
> Maybe you can try a newer version of the support library? If you just update
> the gradle build then this might be easier - there are a bunch of blockers
> preventing us from updating the SDK / support library for the regular builds.

IIRC the support library uses Android system SVG rendering on 6.0.1, so upgrading the library wouldn't help unless they change it to use fallback rendering for Android 6 - however I've got a workaround that only involves updating our icons, so I won't bother with testing newer libraries for now.

Comment 7

[Andrzej Hunt :ahunt]

Attachment: Bug 1325929 - Reimport certain AS VectorDrawable's using different converter

System SVG rendering on Android 6.0 seems to be broken for certain VectorDrawable's:
these three icons were being distorted, only on Android 6. Using a different SVG
converter (an online converter, as opposed to the Android Studio converter),
results in the icons being rendered correctly.

Review commit: https://reviewboard.mozilla.org/r/104576/diff/#index_header
See other reviews: https://reviewboard.mozilla.org/r/104576/

Comment 8

[Andrzej Hunt :ahunt]

(In reply to Andrzej Hunt :ahunt from comment #5)
> Using one of the online converters + some manual tweaking seems to fix the
> problem for me on 6.0.1, i.e.
> 
> - Android Studio SVG->VectorDrawable conversion: distorted icons
> - Inloop converter ( http://inloop.github.io/svg2android/ ) works
> 
> Note: the inloop converter keeps "android:fillType="evenOdd"", and warns you
> that this only works on Android 24+. For at least the bookmark icon,
> removing the filltype causes no visible issues (compilation fails if it
> exists).

The share icon wasn't completely fixed with that converter (much improved, but still not perfect). For that icon I:
1. Imported into the boxy svg editor
2. Ungrouped everything
3. Regrouped everything
4. Used the online converter

That resulted in a usable icon.

I'll try to send an email to the ML to warn about this.

Comment 9

[Sebastian Kaspari (:sebastian; :pocmo)]

SVG on Android seems to be a big mess. :)

Comment 10

[Sebastian Kaspari (:sebastian; :pocmo)]

Comment on attachment 8826678 [details]
Bug 1325929 - Reimport certain AS VectorDrawable's using different converter

https://reviewboard.mozilla.org/r/104576/#review105312

Lots of numbers. r+ :)

Comment 11

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/2c630751958a
Reimport certain AS VectorDrawable's using different converter r=sebastian

Comment 12

[Andrzej Hunt :ahunt]

https://treeherder.mozilla.org/#/jobs?repo=try&revision=a7d9ee45d6e1

Comment 13

[Wes Kocher (:KWierso)]

https://hg.mozilla.org/mozilla-central/rev/2c630751958a

Comment 14

[Carmen Fat [:carmenf] - Experiments QA]

Hello,

Tested using latest Nightly build 53.0a1 (2017-01-15) on following devices:
- Nexus 5 (Android 6.0.1);
- Asus ZenPad 8 (Android 6.0.1).

The troubled icons are now properly displayed.
Marking this bug as Verified.