1565816 - [Protections Panel] Implement the new animation on the shield icon

Status: VERIFIED FIXED

(Firefox :: Site Identity, task, P1)

Description

[Tim Huang[:timhuang]]

There is a new animation for the shield icon if there is any tracker been blocked.

Comment 1

[Liz Henry (:lizzard) (privacy/fingerprinting team)]

Tim, just double checking, is this part of Skyline?

Comment 2

[Tim Huang[:timhuang]]

(In reply to Liz Henry (:lizzard) (use needinfo) from comment #1)

Tim, just double checking, is this part of Skyline?

Yes, I believe so.

Comment 3

[Tim Huang[:timhuang]]

Attachment: Bug 1565816 - Part 1: Update the shield animation to the new version. r?johannh!

Comment 4

[Tim Huang[:timhuang]]

Attachment: Bug 1565816 - Part 2: Modify the animation for the new animation. r?johannh!

This patch modifies the old animation CSS rules to match the new
animation.

Depends on D39175

Comment 5

[Tim Huang[:timhuang]]

Attachment: Bug 1565816 - Part 3: Show the last frame of the animation icon if the animation is disabled and there is a blocking happening. r?johannh!

This patch makes the tracking protection icon to show the last frame of
the shield animation when there is a blocking happening and the
animation is disabled.

Depends on D39176

Comment 6

[Tim Huang[:timhuang]]

Attachment: Bug 1565816 - Part 4: Apply a transform to tracking protection icon in order to show a correct direction of the tracking protectoin icon in rtl mode. r?johannh!

This patch add a css rule to apply a 'scaleX(-1)' tranform to the
tracking protection icon in order to show a correct direction of the
tracking protection icon in rtl mode.

Depends on D39177

Comment 7

[Tim Huang[:timhuang]]

Attachment: Bug 1565816 - Part 5: Update the test browser_trackingUI_animation.js. r?johannh!

Depends on D39178

Comment 8

[Sam Foster [:sfoster] (he/him)]

Attachment: Optimizeed browser_themes_shared_identity-block_tracking-protection-animation.svg

Applied some optimizations:

• Remove redundant 100%/100% style attributes
• Remove redundant xmlns and user-select attributes
• Use reference to single shared gradient
• Use reference to shared path definitions

Comment 9

[Sam Foster [:sfoster] (he/him)]

Attachment: Optimized browser_themes_shared_identity-block_tracking-protection-animation-brighttext.svg

Remove redundant 100%/100% style attributes
Remove redundant xmlns and user-select attributes
Use reference to single shared gradient
Use reference to shared path definitions

Comment 10

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/22d335ceae8c
Part 1: Update the shield animation to the new version. r=johannh,sfoster
https://hg.mozilla.org/integration/autoland/rev/5369e35b9f98
Part 2: Modify the animation for the new animation. r=johannh
https://hg.mozilla.org/integration/autoland/rev/1308d4cee5a2
Part 3: Show the last frame of the animation icon if the animation is disabled and there is a blocking happening. r=johannh
https://hg.mozilla.org/integration/autoland/rev/81d5b8653725
Part 4: Apply a transform to tracking protection icon in order to show a correct direction of the tracking protectoin icon in rtl mode. r=johannh
https://hg.mozilla.org/integration/autoland/rev/f8b41be3e8c2
Part 5: Update the test browser_trackingUI_animation.js. r=johannh

Comment 11

[Bogdan Tara[:bogdan_tara | bogdant]]

https://hg.mozilla.org/mozilla-central/rev/22d335ceae8c
https://hg.mozilla.org/mozilla-central/rev/5369e35b9f98
https://hg.mozilla.org/mozilla-central/rev/1308d4cee5a2
https://hg.mozilla.org/mozilla-central/rev/81d5b8653725
https://hg.mozilla.org/mozilla-central/rev/f8b41be3e8c2

Comment 13

[Cristian Comorasu, QA [:ccomorasu], Releae Desktop QA - Please contact [e-mail]]

I can confirm the shield animation is updated. I verified using Fx 70.0b5 on Windows 10 x64, Ubuntu 18.04 and macOS 10.5 beta7.