[GlobalStep] Non-functional edit button present when viewing own site.

[wptester9845]

Description

If the user chooses to view their own site, each post within it will have a footer with information such as the author name, and the data published. The last part of the footer will be an edit icon with no text. Tapping this icon has no function.

On web the edit icon is present with the text “Edit” next to it. Tapping this text will allow the user to edit that post.

Reproduction Rate

4/4 100%

Expected behavior

Either the edit button should be function when tapped, or having matching text “edit” which allows the user to edit their post.
Or the edit button should be removed as the functional text link is not present on mobile.

Actual behavior

An edit icon is present with no function.

Steps to reproduce the behavior

1. Launch WordPress 14.1 (14.1.0.0)
2. Log into an account which has at least one site and one or more post.
3. Tap View Site.
4. Observe the edit icon as the end of the footer in any post.
5. Attempt to interact with the edit icon.

Tested on

iPhone XS (12.3.1)

iOS - Edit Icon.zip

Submitted By:

Alex Wood

[designsimply]

This is a tricky case. In the past, we disabled the edit icon as a stopgap because admin area links, including the editor as well as some other areas of WP Admin, weren't working well within Webviews (the view that opens when you tap 'View Site') and causing quite a bit of confusion for people using the app. That said, there is an issue at #12074 requesting to make that Edit link open the editor within the app if possible and I'd like to close this in favor of that request. Thank you!

[designsimply]

Re-opening because I talked it out with my team and the edit link should either be removed completely if it's non-functional or we should make the link work and open the editor within the app as requested at #12074.

[designsimply]

@jeherve I think this might be a regression of Automattic/jetpack#12867 and I noticed you were the code reviewer on that issue. Is there any chance you can help us out in getting this re-checked and fixed so that we don't have a non-functional edit link in Webviews in the mobile apps?

^{(internal reference: p77Llu-ccd-p2)}

[designsimply]

I tested this in Safari on iPhone 6S iOS 13.3 and found that "Edit" appears next to the icon as a clickable link and the icon is also there but is not clickable. It seems like the edit link got removed (as intended) but the icon got left behind and the icon isn't clickable on the web or in the mobile app Webviews.

[jeherve]

@designsimply I can't seem to be able to reproduce your issue on my end (on Android). I don't have an iOS device to test I'm afraid.

The PR you linked to above aimed to remove the Edit link, but only when viewing the site via the in-app browser. It does appear to work still:

Edit link visible when viewing the post in Chrome

Edit link is gone when viewing the same post via the in-app browser

Looking at your screenshot above, I don't see the toolbars added by the in-app browser. Were you accessing your site in the browser instead?

---

An edit icon is present with no function.

I believe this may be because your theme uses the edit_post_link() function to add the edit post link, and provided a "before" or "after" parameter to add the icon before the text. The Jetpack plugin and WordPress.com remove the edit text and its link, but your theme still adds the "before" or "after" element around it.

Twenty Nineteen, for example, does this:
https://github.com/WordPress/WordPress/blob/master/wp-content/themes/twentynineteen/inc/template-tags.php#L115-L130

I've just pushed this PR to try to work around this when themes do that:
Automattic/jetpack#14514

[designsimply]

My screenshot was comparing Safari (to note the difference). I've updated the original issue to show the Webview screenshot inline.

For reference, I believe the site in the screenshot is from madefortesting9845.wordpress.com and was using the Independent Publisher 2 theme at the time.

I reviewed the PR workaround for both Jetpack and WP.com and both LGTM! ❤️ Thank you @jeherve!