[Collection App] Icons jump after rendering all of them

RESOLVED FIXED in Firefox OS v2.1

Status

Firefox OS
Gaia::Everything.me
RESOLVED FIXED
4 years ago
3 years ago

People

(Reporter: crdlc, Assigned: crdlc)

Tracking

unspecified
2.0 S6 (18july)
All
Gonk (Firefox OS)

Firefox Tracking Flags

(b2g-v2.0 affected, b2g-v2.1 verified)

Details

(Whiteboard: [systemsfe])

Attachments

(3 attachments)

(Assignee)

Description

4 years ago
Created attachment 8452962 [details]
Video

STR:

1) Open "Social" smart collection (or whatever)
2) See how the content is translated some pixels when all icons are rendered and the scroll detects it

Video attached to show the issue

-----

https://github.com/mozilla-b2g/gaia/blob/master/apps/collection/view.html#L79

Notice that <gaia-grid> has not height because all the content is translated with transformations. The issue disappears if I add this here https://github.com/mozilla-b2g/gaia/blob/master/apps/collection/style/css/view.css#L1

height: 1000%;
(Assignee)

Comment 1

4 years ago
Vivien, should I move this to Zoom&Pan component? or any suggestion is more than welcome
Blocks: 989848
Flags: needinfo?(21)
Whiteboard: [systemsfe]
(In reply to Cristian Rodriguez (:crdlc) from comment #1)
> Vivien, should I move this to Zoom&Pan component? or any suggestion is more
> than welcome

Just removing flex-direction: column on the container also seems to resolve the issue for this case. But it breaks the offline case.

Seems much more a css issue related to the usage of flex than a pan/zoom issue to me.
Flags: needinfo?(21)

Updated

4 years ago
Blocks: 1017954
No longer blocks: 989848
QA Whiteboard: [VH-FL-blocking-][VH-FC-blocking-]
(Assignee)

Updated

4 years ago
Assignee: nobody → crdlc
Status: NEW → ASSIGNED
(Assignee)

Updated

4 years ago
status-b2g-v2.0: --- → affected
status-b2g-v2.1: --- → affected
(Assignee)

Comment 3

4 years ago
Created attachment 8453636 [details]
Github pull request
Attachment #8453636 - Flags: review?(kgrandon)
(Assignee)

Comment 4

4 years ago
Thanks Vivien, good catch

(In reply to Vivien Nicolas (:vingtetun) (:21) - (NOT reading bugmails, needinfo? please) from comment #2)
> (In reply to Cristian Rodriguez (:crdlc) from comment #1)
> > Vivien, should I move this to Zoom&Pan component? or any suggestion is more
> > than welcome
> 
> Just removing flex-direction: column on the container also seems to resolve
> the issue for this case. But it breaks the offline case.
> 
> Seems much more a css issue related to the usage of flex than a pan/zoom
> issue to me.
Comment on attachment 8453636 [details]
Github pull request

Things seem to keep working for me, and I'm not seeing a "jump", so looks good to me. Thanks!
Attachment #8453636 - Flags: review?(kgrandon) → review+
(Assignee)

Comment 6

4 years ago
Merged in master:

https://github.com/crdlc/gaia/commit/8eca3ec6a54ac9d812b05355a6077a9ea80c96b6
Status: ASSIGNED → RESOLVED
Last Resolved: 4 years ago
Resolution: --- → FIXED
(Assignee)

Updated

4 years ago
status-b2g-v2.1: affected → fixed
Blocks: 989848
No longer blocks: 1017954
Target Milestone: --- → 2.0 S6 (18july)
Created attachment 8531436 [details]
video

This issue has been verified successfully on Flame 2.1
See attachment: Verify_1036336.MP4
Reproducing rate: 0/5

Flame 2.1 build:
Gaia-Rev        ccb49abe412c978a4045f0c75abff534372716c4
Gecko-Rev       https://hg.mozilla.org/releases/mozilla-b2g34_v2_1/rev/18fb67530b22
Build-ID        20141202001201
Version         34.0
status-b2g-v2.1: fixed → verified
You need to log in before you can comment on or make changes to this bug.