Skip to content
This repository has been archived by the owner on Mar 15, 2018. It is now read-only.

Make the lightbox work with image-deferrer (bug 1030159) #526

Closed
wants to merge 1 commit into from

Conversation

diox
Copy link
Member

@diox diox commented Jul 23, 2014

https://bugzilla.mozilla.org/show_bug.cgi?id=1030159

Losing the swipe w/ snap made me sad, so here is my attempt to keep flipsnap, making image deferring work with it.

TODO:

  • Rebase after feed changes
  • Rebase and convert tests after casper changes
  • Investigate and fix issues with flipsnap and privileged packaged app (Maybe I can do that by forcing a more restricted CSP policy locally, that way I can debug without having to generate a packaged app everytime)

src to show the rocket image in order to try to avoid having
coordinates completely out of whack when the image is replaced by
the real one */
background-position: center center;
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

one center would suffice

@ngokevin
Copy link
Contributor

  1. Do a search.
  2. Toggle the previews in the search listing page.
  3. Quickly click on a preview to open a lightbox, then close it.

Previews seem to stop loading after I close the lightbox. Images are not loading in other lightboxes I open either.

@diox
Copy link
Member Author

diox commented Jul 23, 2014

Will look into that, I had not tested previews in search at all :/

@diox
Copy link
Member Author

diox commented Jul 28, 2014

Ahah, so the problem lies with scrolling: when you visit the search results page, you scroll down, and when you show the lightbox, that scroll amount is still used in the calculations even though the lightbox is fixed and doesn't care about the vertical scroll. Working on a fix.

@diox
Copy link
Member Author

diox commented Jul 28, 2014

Should be fixed now. I'm about to write some tests, in the meantime, r? @ngokevin

@ngokevin
Copy link
Contributor

image deferring on the search page seems broken, images mostly aren't loading. Probably a change in the offset logic?

@diox
Copy link
Member Author

diox commented Jul 28, 2014

It's working for me ? Something that's still broken is the switch between expanded/compact styles, I'll fix that, in the meantime when you switch, reload the page. I also need to double-check that we aren't loading the images in compact mode.

@ngokevin
Copy link
Contributor

Doesn't work for me in either mode, and even after I scroll. After I switch + reload, it works. But on a fresh search:

screen shot 2014-07-28 at 11 47 37 am

@diox
Copy link
Member Author

diox commented Jul 28, 2014

Ok, adding that to my testcase list, I'll look into it tomorrow.

@diox
Copy link
Member Author

diox commented Jul 29, 2014

All cases should be working for me now.

I've added some tests, but it's far from covering everything - it's very hard to write good tests here, because a) we depend on stuff not being loaded (without knowing what's an appropriate amount of time to wait to make sure it has not been loaded) b) we're using a very old version of casper with an abstraction layer that makes it super difficult to use advanced casper functionalities.

@ngokevin
Copy link
Contributor

yeah, our testing framework needs freshening. It's something I'd like to get to sometime. I'm not too worried about full coverage here though, I don't remember a time when our frontend tests caught any regressions.

@@ -74,8 +58,10 @@ define('image-deferrer', ['underscore', 'urls', 'z'], function(_, urls, z) {

var scrollListener = function(e) {
if (!$images) {
return;
// console.info('No images to load, ignoring...');
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We could remove these

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

and all the other debug statements

@ngokevin
Copy link
Contributor

r+squash, works great

@diox
Copy link
Member Author

diox commented Aug 5, 2014

FYI: not merged yet because the last time we pushed the flipsnap upgrade, it caused bug 1041838. I'm trying to come up with a way to detect this issue locally and find a suitable workaround.

@ngokevin
Copy link
Contributor

Let's hold this up until we get feed merged in. I did a lot of stuff with image deferring logic (support background-images) and styles.

@muffinresearch
Copy link
Contributor

@diox if you need any help with converting these tests to the new casper setup let me know.

@andymckay
Copy link
Contributor

@ngokevin based on your comment about "hold this up until we get feed merged in". It's merged what should we do now?

@ngokevin
Copy link
Contributor

ngokevin commented Sep 9, 2014

Now this patch needs to be updated with merge conflicts and flipsnap upgrade.

@diox
Copy link
Member Author

diox commented Sep 9, 2014

Yep, see the TODO I've left in the description.

@ngokevin
Copy link
Contributor

Going to close this in the meantime.

@ngokevin ngokevin closed this Sep 26, 2014
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

6 participants