Publish button is too close to ellipsis menu button

[salty-horse]

In post editing mode, the "Publish" button is very close to the ellipsis menu. This makes it easy to accidentally press Publish (before the post is ready) when you mean to select "Preview" from the menu.

The old app had more spacing between the two buttons (shown here in HTML editing mode, but it's the same idea):

Tested on iPhone 8, WPiOS 9.5

[rachelmcr]

Thanks for the report! This should be resolved in the next app update with a new publish confirmation dialog: #8806

That way if you accidentally press publish you have an opportunity to cancel and keep editing.

[salty-horse]

Thanks, but don't close this just yet :)

Does the confirmation box also appear when editing an existing post, rather than publishing a new one? In this case the button is labeled "Update". (I think it still asks for confirmation, if I'm understanding 5affe38 correctly.)

The confirmation dialog does prevent accidental posting, but doesn't address the problem of the buttons being too close together. There are many times you'd want to reach for the ellipsis menu while editing, and having the "Are you sure you want to publish" confirmation appear every once in a while is frustrating.

[rachelmcr]

@iamthomasbishop and/or @diegoreymendez could you weigh in? My understanding is that this was the chosen solution for #6397 but you're probably best positioned to say if additional changes might be made here.

[iamthomasbishop]

A couple thoughts:

We should definitely add a little more space between the Publish button and ••• icon. @diegoreymendez: it looks like this is currently ~10pt – can we make it ~20pt? I can't recall off the top of my head what the default margins are here but I agree there should be more space.

For the confirmation alerts, we focused on the initial publish confirmation, not subsequent updates. I think that's a good first step, and if we continue to hear about accidental publishes, we'll know we need to add a confirmation on Update (while published).

[frosty]

@iamthomasbishop fwiw, these buttons are just set as standard navigation bar buttons, so iOS currently controls the spacing. We could override it, but it's currently using the default.

[rachelmcr]

Reopened to address @iamthomasbishop's feedback above.

[mchowning]

I actually thought that the ellipsis button wasn't working because I would bias my finger away from the publish button (to make sure I didn't hit the publish button) and as a result the ellipsis button would frequently not activate because too much of my finger was off to the right of the ellipsis.

Writing that out, it sounds like fairly reasonable behavior, but it is incredibly easy for me to accidentally fail to tap the more button when I’m trying to avoid hitting the publish button. I tried to make a video showing this, but it was tough to make it obvious on a video. The best I came up with is this video where I modified the app to give the more button a green background so it would be more obvious where I was tapping:

https://cloudup.com/cQqXHm2jjwf

It is hard to tell in the video, but a decent portion of my finger was definitely touching the more button without activating it.

As a disclaimer, I am primarily an Android user, so my difficulty may be partially due to me being less familiar with typical iOS behavior? It seems like similar screens on Android let you activate the more button all the way up to the edge screen, so I might just be having trouble because I'm use to that (particularly if we haven't been getting any other complaints about this from iOS users). Here's a screenshot of Android where I am pressing the more button and you can see it extends almost the entire way to the edge of the screen:

This is really just a long way of saying that I like @iamthomasbishop 's suggestion to increase the space between the publish button and the more icon (or extend the tappable area for the more icon further toward the edge of the screen).