Openfoodnetwork: Embedded shop/group doesn't scroll on mobile

[sstead]

Description

When viewing an embedded shop or group on my iphone I can't scroll down to view the shop/group. Scrolling down only scrolls the header of the parent website, not the iframe.

Steps to Reproduce

1. Checkout this embedded shop - https://openfoodnetwork.org/user-guide/advanced-features/demo-embedded-shop/
   and this embedded group - https://openfoodnetwork.org/user-guide/advanced-features/demo-embedded-group/ on a phone
2. Try to scroll down to view the shop/group

Animated Gif/Screenshot

Context

This bug makes embedded shops and groups useless on mobile - a fairly big disincentive to anyone using embedded shops/groups.

Severity

2-3 - we've launched a feature that can't be used - this is bad for reputation.

Your Environment

• iphone 6s
• Safari

[sstead]

Can others please check whether this is also a problem on other phone types @myriamboure @RachL @kirstenalarsen @Matt-Yorkley

[RachL]

@sstead on my mobile (using latest Firefox version) I have a secury message that prevent me from testing :
https://user-images.githubusercontent.com/6525576/37594220-dbaf6468-2b74-11e8-91cf-ebeb013f2b74.png
However on desktop while forcing mobile mode it seems to work (same Firefox version) :
https://user-images.githubusercontent.com/6525576/37594292-0f651578-2b75-11e8-93da-6a88de357754.png

[sauloperez]

I can scroll the body of the page without any problem on Chrome.

A thing I found worth mentioning is that the header on the group page takes up a big portion of the page but that's even worse on the shop page, greatly affecting the UX while shopping.

[Matt-Yorkley]

Works OK on Android with Firefox.

[myriamboure]

On iphone with Chrome I get exactly the same thing as you @sstead not working at all but interestingly for the embedd shop page I got some lower banner asking me to accept cookies ;-) I guess it's from wordpress? Because we don't have that on OFN:-o
Here is what I see for embed shop and can't scroll at all anything.

[sauloperez]

Certainly, the tiny small area left out of the header doesn't do any help. I wonder if the bug you experience might even be caused by this. At least it does in your case @myriamboure .

[myriamboure]

After discussing with @enricostano this morning we agreed that today we can't really say that we offer the "mobile ready" feature so this is not really a bug, just a feature that is not yet there. There is a whole bunch of things related to bad UX experience on mobile, things that are not working, etc. SO we are collecting them all in this icebox item: https://community.openfoodnetwork.org/t/customers-easily-go-through-the-whole-placing-order-process-on-mobile/1244 to keep track of them, and @kirstenalarsen will have a first go on this in the coming 3 months ("review mobile recommendations and select quick wins" has been prioritized for Q2). So closing it for now as it is tracked in this icebox.