Elements taller than viewport never trigger hooks about ember-in-viewport

[danieledraganti]

Hello everyone. Is no one going to merge either of those two fixes? This bug really breaks many use cases...
Thank you.

[regsii]

@awaer @poteto
Looks like this addon (at least in version 1.2.5) doesn't handle case when the element is not in viewport from the very beginning (when _triggerDidAccessViewport is called for the first time).
You can think of this like value of viewportEntered property is changed from false to false (since the default value of viewportEntered property is false).
But _triggerDidAccessViewport method only handles change of viewportEntered property from true to false and from false to true.

https://github.com/dockyard/ember-in-viewport/blob/1845c04c196bab104368878ab7005d24bee5128f/addon/mixins/in-viewport.js#L130

[laantorchaweb]

same issue here, I didn't know what was happening until I tried to add smaller elements. But, I can confirm that if the element (component) it's taller than the viewport the events aren't fired.

[patuku-roy]

@poteto any updates about this? or maybe @awaer already had any enlightenment?

[awaer]

@patuku-roy I couldn't find a workaround. The nearest alternative addon (ember-waypoints) doesn't meet my use case (and seems to be falling behind), so I opted for rolling my own solution that leans on scrollMonitor. It's not ideal, but it works for now.

[patuku-roy]

Same here, I've tried to use ember-waypoint but it seems using the same approach, I ended by splitting the ember-in-viewport implementation into many smaller part of the DOM, for example: if I have div contains image and text, then I put ember-in-viewport for image only, because in my case, the image height always shorter than viewport height, this is not ideal solution but at least working on my problem now.

Btw I will take a look scrollMonitor for the second option. Thanks anyway @awaer for your share.

[bekharsky]

This is very annoying problem on narrow viewports :( When the element is wider than viewport.

[oligriffiths]

@poteto This still appears to be an issue. Elements taller or wider than the viewport do not trigger the enter/exit hooks. I notice that #62 attempts to fix the problem but hasn't been merged.

[poteto]

@oligriffiths Could you try this in your package.json and let me know if it fixes your issue?

"ember-in-viewport": "DockYard/ember-in-viewport#0e31648"

[oligriffiths]

@poteto That sort of works, however if the element is initially loaded and partially outside of the viewport, then the enter hook isn't triggered. For example, if the element is partially shown but partially below the bottom of the viewport, the enter hook is not triggered.

[markmhendrickson]

@poteto I've added 0e31648 to my package.json and it fixes this problem for me. I don't appear to be getting the same issue reported by @oligriffiths. It'd be great to see this branch merged into master so the dependency would be cleaner. Thanks!

[lifeinafolder]

Any updates on this?